/* ===== JU GROUP — global frontend brand theme ===== */
@import url('https://fonts.googleapis.com/css2?family=Tajawal:wght@400;500;700;800;900&family=Cairo:wght@600;700;800&family=Inter:wght@400;600;700;800&display=swap');
:root{
  --jub:#07091c;--jub2:#0e1230;--jus:rgba(255,255,255,.04);--jubd:rgba(255,255,255,.10);
  --jut:#eef0ff;--jum:#aab0d4;--jublue:#4FC3F7;
  --jugrad:linear-gradient(135deg,#4FC3F7 0%,#7B6CE5 55%,#E91E63 100%);
}
body,#wrapwrap{background:#07091c;color:var(--jut);
  font-family:'Tajawal','Cairo','Inter',system-ui,sans-serif;}
main{background:transparent;}
h1,h2,h3,h4,h5,h6{color:var(--jut);}
p,.text-muted,small,.small,.o_wappointment_message_intro{color:var(--jum) !important;}
a{color:var(--jublue);}
a:hover{color:#7fd4ff;}

/* header -> dark JU (kill the default purple) */
#wrapwrap > header,#wrapwrap > header .navbar,header#top,header.o_header_standard{
  background:rgba(7,9,28,.92) !important;border-bottom:1px solid var(--jubd) !important;
  box-shadow:none !important;backdrop-filter:blur(10px);}
#wrapwrap > header a,#wrapwrap > header .nav-link,#wrapwrap > header .navbar-nav .nav-link,
#wrapwrap > header .dropdown-toggle{color:#eef0ff !important;}
#wrapwrap > header .nav-link:hover{color:var(--jublue) !important;}

/* footer -> dark JU */
#wrapwrap > footer,.o_footer{background:#0e1230 !important;color:var(--jum) !important;
  border-top:1px solid var(--jubd) !important;}
#wrapwrap > footer a{color:var(--jum) !important;}
#wrapwrap > footer a:hover{color:var(--jublue) !important;}

/* kill white strips on frontend */
.bg-white,.bg-light,.bg-100,.bg-200{background-color:#0e1230 !important;}
section{background-color:transparent !important;}

/* cards (booking choices, etc.) */
.card{background:var(--jus) !important;border:1px solid var(--jubd) !important;
  border-radius:16px !important;color:var(--jut) !important;}
.card .card-title,.card .card-text,.card .card-body{color:var(--jut) !important;}

/* primary buttons -> JU gradient */
.btn-primary,.btn-fill-primary,a.btn-primary{background:var(--jugrad) !important;
  border:0 !important;color:#fff !important;border-radius:10px !important;}
.btn-primary:hover{filter:brightness(1.08);}
.btn-secondary,.btn-outline-primary,.btn-outline-secondary{border-radius:10px !important;}

/* forms / inputs */
.form-control,.form-select,.o_appointment_input,input.form-control,select.form-select{
  background:rgba(255,255,255,.05) !important;border:1px solid var(--jubd) !important;
  color:var(--jut) !important;border-radius:10px !important;}
.form-control::placeholder{color:var(--jum) !important;}

/* appointment specifics */
.o_appointment_index,.o_appointment_choice,.o_appointment_appointments_list{color:var(--jut);}
.o_appointment_slots .btn,.o_slots_list .btn,.o_slot_button{border-radius:8px !important;}

/* ===== Helpdesk "Submit a Ticket" -> premium, centered, carded ===== */
/* stack + center the two columns (intro on top, form below) */
#wrap .row.mb16{justify-content:center !important;}
#wrap .row.mb16 > .col-md-9,
#wrap .row.mb16 > .col-md-8{flex:0 0 100% !important;max-width:820px !important;
  margin-inline:auto !important;padding-left:0 !important;padding-right:0 !important;}
/* the Arabic intro line ("املأ الاستمارة و سيتم فتح تذكرة") */
#wrap .row.mb16 > .col-md-9{text-align:center;}
#wrap .row.mb16 > .col-md-9 strong,#wrap .row.mb16 > .col-md-9 font{
  font-size:1.1rem !important;font-weight:700 !important;}
/* the page title was h2.text-muted -> make it bright + bold + centered */
#wrap .row.mb16 h2.text-muted{color:var(--jut) !important;font-weight:800 !important;
  font-size:2rem !important;text-align:center;margin:.4rem 0 1.1rem !important;}
/* card-wrap the form */
#helpdesk_section{background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.02)) !important;
  border:1px solid var(--jubd) !important;border-radius:20px !important;
  padding:8px 28px 24px !important;box-shadow:0 30px 80px -42px rgba(0,0,0,.75);}
#helpdesk_section .s_website_form{padding-top:8px !important;padding-bottom:0 !important;}
#helpdesk_ticket_form .s_website_form_label{color:var(--jut) !important;font-weight:600;}
#helpdesk_ticket_form textarea.form-control{min-height:130px;}
/* the "Choose File" attachment button -> tidy */
#helpdesk_ticket_form input[type=file]{color:var(--jum) !important;}
#helpdesk_ticket_form .s_website_form_send,
#helpdesk_ticket_form .s_website_form_submit .btn{margin-top:6px;}