
*,*::before,*::after{box-sizing:border-box;background-origin:border-box;background-clip:border-box}
html,body{margin:0;padding:0;overflow-x:hidden}
body{background:#390915;font-family:'Cairo',sans-serif;-webkit-font-smoothing:antialiased}
img{display:block}
a{color:inherit}
.text>span{display:block;unicode-bidi:plaintext}
.text>span.pd{unicode-bidi:isolate}
html[dir=rtl] .ts>span,html[dir=ltr] .te>span{text-align:right}
html[dir=rtl] .te>span,html[dir=ltr] .ts>span{text-align:left}
/* a part that keeps the Arabic layout on the English page (the footer's brand mark, dir=rtl) */
html[dir=ltr] [dir=rtl] .ts>span{text-align:right}
html[dir=ltr] [dir=rtl] .te>span{text-align:left}
.screen{margin:0}
@media (min-width:1024px){.screen.m,.modal-layer.m{display:none!important}}
@media (max-width:1023px){.screen.d,.modal-layer.d{display:none!important}}
.modal-layer{display:none;position:fixed;inset:0;z-index:50;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain}
body.terms-open .modal-layer{display:block}
body.terms-open .pinned{visibility:hidden}
.slide{position:absolute;inset:0;background:center/cover no-repeat;border-radius:inherit;opacity:0;transition:opacity .6s;pointer-events:none}
.slide.on{opacity:1}
.dot{border:0;padding:0;margin:0;cursor:pointer;font:inherit;transition:background-color .3s}
.dot.on{background:#6E1426!important}
.dot:focus-visible{outline:2px solid #D4AF6A;outline-offset:2px}
[data-slider] [hidden]{display:none!important}
[data-anchor]{scroll-margin-top:24px}
.capbox{height:auto!important}
.capcol{display:grid!important;align-content:start;align-items:start}
.capset{grid-area:1/1;display:flex;flex-direction:column;align-items:stretch;min-width:0}
.capset[hidden]{display:flex!important;visibility:hidden}
.cap,.capt{height:auto!important;min-height:0!important;flex:none!important}
.capt{line-height:38px!important}
html[dir=ltr] .flip{transform:scaleX(-1)}
html[dir=ltr] .flowcol{position:relative!important;top:auto!important;inset-inline-start:auto!important;height:auto!important;margin:var(--ft) 0 var(--fb);margin-inline-start:var(--fs)}
@media (prefers-reduced-motion:reduce){.slide,.dot{transition:none}}
body.terms-open{overflow:hidden}
/* scrolled past its design place, the phone's WhatsApp pill docks above the bottom tabs (94px) on the same side */
.dock.docked{position:fixed!important;top:auto!important;bottom:110px!important;z-index:40}
/* a row the design clips with items past both edges (the phone home's statistics): swipe sideways, no scrollbar */
.hscroll{overflow-x:auto!important;overflow-y:hidden!important;justify-content:flex-start!important;scrollbar-width:none;
  overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.hscroll::-webkit-scrollbar{display:none}
/* scrolled to either end, its first and last items keep the phone design's 20px from the screen edge: spacers, as
   browsers differ on scrolling to a row's end padding (6px + the row's 14px gap); the design's view is unchanged */
.hscroll::before,.hscroll::after{content:"";flex:0 0 6px}
@media (pointer:fine){.hscroll.scrollable{cursor:grab}.hscroll.dragging{cursor:grabbing;user-select:none}}
/* the package page's trip programme (prepare_programme): a day opens on its header; once the open day is not the
   design's, the boxes around the lists follow their content (until then they keep the design's sizes: a browser draws
   1px borders thinner on a 125% display); an activity longer than the design's wraps (.pl), level with its bullet
   (.pl-row); the date badge centres its weekday and date (.wd) */
html[dir] .screen.days-moved .fold{height:auto!important;min-height:0!important}
[data-day-body][hidden]{display:none!important}
.day-head{cursor:pointer;-webkit-tap-highlight-color:transparent}
.day-head:focus-visible{outline:2px solid #D4AF6A;outline-offset:-2px}
.pl-row{align-items:flex-start!important}
html[dir] .screen .pl{width:auto!important;height:auto!important;flex:0 1 auto!important;min-width:0;white-space:normal}
html[dir] .screen .wd{left:0!important;right:0!important;width:auto!important;transform:none!important}
.wd>span{text-align:center!important}
.modal-scrim{position:fixed;inset:0;background:rgba(0,0,0,.5)}
/* the dialog (gen_razor.py render_modal): at its design top (--mt) when the window has room, higher when not, and the
   layer scrolls when even that is not enough (--mh = its design height); in the flow so the layer's scroll height
   includes it, and as tall as its text (the English terms are longer than the box the Arabic fits) */
.modal-box{position:relative!important;top:auto!important;height:auto!important;min-height:var(--mh);margin:min(var(--mt),max(24px,calc(var(--lh,100vh) - var(--mh) - 24px))) 0 24px}
/* Team sign-in (one 1440x900 / 430x900 screen in the design) fills the window: the page is at least the
   window's height (--z undoes the zoom applied below 1440/430 wide), the photo takes the width the form panel
   leaves (Figma's crop of it is exactly 'cover, centred'), the form stays centred and the decoration at the bottom. */
.screen.lg{min-height:max(903px,calc(100vh / var(--z,1)))!important}
/* The desktop sign-in is exactly the window's height, so it never scrolls (asked 2026-10-14), down to 622px: its form
   (486px) stays centred, or in a short window rises to keep 24px above the drawing at the bottom (96px; .lg-form
   above) and 16px below the window's top; zoomed to the width as before, it only loses or gains photo and white space
   above and below the form. Where its content starts and ends (--lga, --lgb: login-form.js) follows its messages and
   the English copy, so a grown form rises first, and only a window too short for it grows (and scrolls). */
.screen.d.lg{height:max(calc(136px - var(--lga, 0px) + var(--lgb, 486px)),calc(100vh / var(--z,1)))!important;min-height:0!important}
.lg-photo{inset-inline-start:460.8px!important;inset-inline-end:0!important;width:auto!important;height:100%!important;background-size:auto,cover,cover!important;background-position:0 0,center calc(50% - 1.85px),center!important}
.lg-panel{inset-inline-start:0!important;height:100%!important}
.lg-form{top:min(calc(207.5px + (100% - 903px) / 2),calc(100% - 120px - var(--lgb, 486px)))!important}
.lg-deco{top:auto!important;bottom:0!important}
.lg-top{inset-inline-start:auto!important;inset-inline-end:41px!important}
.screen.lgm{min-height:max(922px,calc(100vh / var(--z,1)))!important}
.lgm-card{height:auto!important;bottom:0!important}
.lgm-col{height:auto!important;align-self:stretch!important}
.lgm-deco{margin-top:auto!important;margin-bottom:-31px!important}
/* Wider than the phone design (431-767px), the phone sign-in's photo, 430px wide in the design with its picture cards
   drawn on it, covers the width, and the drawing at the bottom keeps its size, centred, its cut ends fading out
   (grown with the width it would push the form up under the card's edge). Tablets (768-1023px) get the desktop
   sign-in instead, the form panel beside the photo: it fills any width, so there it is zoomed only to fit the
   window's height (rsyc.js zoom); from 1024px it is zoomed down to the width like every desktop page. */
@media (min-width:431px){.lgm-photo{background-size:auto,cover!important;background-position:0 0,center 38%!important}
  .lgm-deco{background-position-x:center!important;
    -webkit-mask:linear-gradient(90deg,transparent,#000 70px,#000 360px,transparent) center/430px 100% no-repeat;
    mask:linear-gradient(90deg,transparent,#000 70px,#000 360px,transparent) center/430px 100% no-repeat}}
@media (min-width:768px) and (max-width:1023px){.screen.m.lgm{display:none!important}.screen.d.lg{display:block!important}}
/* Hover, press and keyboard focus (asked 2026-10-14; Figma has no states): a button filled dark lightens, one filled
   light darkens, an outline takes a tint of its border (--hl), a text or picture link fades, and each presses in a
   little. On touch screens only the press shows (a hover would stick after the tap). */
.btn,.lnk,.dot,.day-head,.pw-eye,.sw,[data-close-terms].icon,.applied-x,.applied-btn{transition:filter .15s,opacity .15s,background-color .15s,scale .1s}
[data-close-terms].icon{cursor:pointer}
/* (!important: the design's own opacity or background is written on the element) */
@media (hover:hover){
  .btn-d:hover,.applied-btn.primary:hover{filter:brightness(1.35)!important}
  .btn-l:hover,.applied-btn:not(.primary):hover,.applied-x:hover,[data-close-terms].icon:hover{filter:brightness(.93)!important}
  .btn-o:hover{background-color:var(--hl,rgba(0,0,0,.06))!important}
  .lnk:hover,.pw-eye:hover,.sw:hover,.dot:hover{opacity:.72!important}
  .day-head:hover{filter:brightness(.97)!important}
}
.btn:active,.applied-btn:active{scale:.97}
.applied-x:active,[data-close-terms].icon:active{scale:.92}
.lnk:active{opacity:.55!important}
.day-head:active{filter:brightness(.94)!important}
:is(.btn,.lnk,.day-head,.dot,.applied-x,.applied-btn):focus-visible{outline:2px solid #C9A45C;outline-offset:2px}
@media (prefers-reduced-motion:reduce){:is(.btn,.applied-btn,.applied-x,[data-close-terms].icon):active{scale:none}}
/* The 'Tearms' frame draws the desktop header logo at 67x70 (@1253,12) instead of 88x91. */
body.terms-open .screen.d .header-logo{inset-inline-start:calc(50% - 720px + 120px)!important;top:12px!important;width:67px!important;height:70px!important}
html[dir=ltr] .fc{direction:ltr}
html[dir=ltr] .g{height:auto!important;min-height:var(--h)}
html[dir=ltr] .text.nw{white-space:nowrap;overflow:visible}
html[dir=ltr] .text.nw.wr,html[dir=ltr] .text.nw.wr>span{white-space:normal!important}
html[dir=ltr] .hw{width:auto!important}
html[dir=ltr] .hc{inset-inline-start:50%!important;transform:translateX(-50%)}
html[dir=ltr] .tc,html[dir=ltr] .tc>span{text-align:center!important}
html[dir=ltr] .line{min-width:0}
html[dir=ltr] body,html[dir=ltr] body :not([dir=rtl],[dir=rtl] *){font-family:Georgia,Gelasio,'Cairo',serif!important}
html[dir=ltr] body :is(.ft,.ft *,h1,h2,h3,h1 *,h2 *,h3 *):not([dir=rtl] *){font-family:'Playfair Display',Georgia,Gelasio,'Cairo',serif!important}
.text:has(>[data-form-total]){width:auto!important}
html[dir=rtl] .lf{text-align:right!important}
.fc.lf:focus{box-shadow:none}
.lf-box:has(.lf:focus){border-color:#6E1426!important;box-shadow:0 0 0 3px rgba(110,20,38,.12)}
.lf::placeholder{color:#8A7A74;opacity:1}
.sw{display:block;background:#F4EFE6;cursor:pointer}
.sw input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.sw-k{position:absolute;top:2px;bottom:2px;inset-inline-start:2px;aspect-ratio:1;border-radius:50%;background:#fff;pointer-events:none}
.sw input:checked+.sw-k{inset-inline-start:auto;inset-inline-end:2px;background:#6E1426}
.sw:has(input:focus-visible),.pw-eye:focus-visible{outline:2px solid #6E1426;outline-offset:2px}
.fe{position:absolute;inset-inline-start:0;top:calc(var(--h) + 4px);width:100%;font-family:'Cairo',sans-serif;font-weight:600;font-size:12.5px;line-height:18px;color:#C8312B;text-align:start}
.fe:empty{display:none}
.frame:not(.g) > .fe{top:calc(100% + 4px)}
.fe.fe-row{top:auto;bottom:0}
.g:has(> .fe-row:not(:empty)){padding-bottom:24px!important;min-height:0!important}
.screen .g:has(.fe:not(:empty)){height:auto!important;min-height:var(--h)}
.g:has(> .fe:not(:empty)),.g:has(> .frame:not(.g) > .fe:not(:empty)){min-height:calc(var(--h) + 22px)!important}
.g[style*='flex-direction:row']:has(> .g .fe:not(:empty)){align-items:flex-start!important}
.flowcol:has(.fe:not(:empty)),.flowcol:has(option[value='-1']:checked){position:relative!important;top:auto!important;inset-inline-start:auto!important;height:auto!important;margin:var(--ft) 0 var(--fb);margin-inline-start:var(--fs)}
.lf-error{position:relative;align-self:stretch;flex:none;padding:10px 16px;border:1px solid #F2C4C1;border-radius:16px;background:#FDF1F0;font-family:'Cairo',sans-serif;font-weight:600;font-size:13.5px;line-height:22px;color:#C8312B;text-align:start}
.lf-error:empty{display:none}
.g:has(> .fe:not(:empty)) > .lf-box{border-color:#C8312B!important}
.screen .g:has(.lf-error:not(:empty)){height:auto!important;min-height:var(--h)}
.screen.lgm:has(.fe:not(:empty),.lf-error:not(:empty)){height:auto!important}
.lgm:has(.fe:not(:empty),.lf-error:not(:empty)) .lgm-card{position:relative!important;top:auto!important;bottom:auto!important;margin-top:382px;min-height:calc(max(922px,100vh / var(--z,1)) - 382px)}
.oc{display:none}
.g:has(> .frame > select[name='CityId'] > option[value='-1']:checked) > .oc{display:block}
.screen .g:has(option[value='-1']:checked){height:auto!important;min-height:var(--h)}
.g:has(> .frame > select[name='CityId'] > option[value='-1']:checked){min-height:calc(var(--h) + 51.8px)!important}
.g:has(> .frame > select[name='CityId'] > option[value='-1']:checked):has(> .fe:not(:empty)){min-height:calc(var(--h) + 73.8px)!important}
.g:has(> .frame > select[name='CityId'] > option[value='-1']:checked) > .fe{transform:translateY(51.8px)}
.g[style*='flex-direction:row']:has(> .g > .frame > select[name='CityId'] > option[value='-1']:checked){align-items:flex-start!important}
.terms-link{text-decoration:none;cursor:pointer}.terms-link:hover{text-decoration:underline}
.screen input[type=checkbox],label.text[for$='AcceptTerms'],label.text[for$='WantsFlightOffer'],label.text[for$='RememberMe']{cursor:pointer}
.pn{width:auto!important}
.applied{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;font-family:'Cairo',sans-serif}
.applied[hidden]{display:none}
.applied[data-state=code] .applied-sent,.applied[data-state=sent] .applied-code{display:none}
.applied-scrim{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.applied-box{position:relative;width:520px;max-width:100%;max-height:calc(100vh - 32px);overflow:auto;background:#FFFDFA;border-radius:22px;box-shadow:0 24px 70px rgba(0,0,0,.47);text-align:center;box-sizing:border-box}
.applied[data-state=sent] .applied-box{border-top:6px solid #B98A4A;padding:34px 28px 22px}
.applied-x{position:absolute;top:16px;inset-inline-end:16px;padding:0;border:0;background:none;cursor:pointer;line-height:0}
.applied-badge{position:relative;width:104px;height:104px;margin:0 auto 6px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(#E3F3E8 0 55%,#EEF7F0 56% 100%);box-shadow:0 0 0 8px rgba(47,125,79,.08)}
.applied-badge svg{filter:drop-shadow(0 8px 10px rgba(47,125,79,.33))}
.applied-badge i{position:absolute;border-radius:50%}.applied-badge .dot1{width:10px;height:10px;background:#B98A4A;top:4px;inset-inline-start:88px}.applied-badge .dot2{width:7px;height:7px;background:#7A0F2B;top:87px;inset-inline-start:2px}
.applied h2{margin:0;color:#7A0F2B;font-size:28px;font-weight:800;line-height:52px}
.applied-text{margin:0 auto;max-width:432px;color:#6B625E;font-size:15px;line-height:25.5px}
.applied-steps{list-style:none;margin:23px auto 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);max-width:420px}
.applied-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px}
.applied-steps li:not(:last-child)::after{content:'';position:absolute;top:16px;inset-inline-start:calc(50% + 25px);width:calc(100% - 50px);height:2px;background:#E4DCCF}
.applied-steps li.on::after{background:#B98A4A}
.applied-steps b{width:34px;height:34px;border-radius:50%;border:2px solid #DDD5C8;background:#fff;color:#8A7F78;font-size:15px;font-weight:700;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
.applied-steps li.on b{background:#B98A4A;border-color:#B98A4A;color:#fff}
.applied-steps span{font-size:13px;font-weight:600;color:#2B1B1F;line-height:22px}.applied-steps li.on span{font-weight:800;color:#7A0F2B}
.applied-note{margin-top:23px;display:flex;gap:16px;align-items:flex-start;text-align:start;background:#FDF1E3;border:1px solid #F2DFC4;border-radius:12px;padding:11px 16px 11px 16px;font-size:13px;line-height:24.9px;color:#2B1B1F}
.applied-note svg{flex:none;margin-top:2px}
.applied-actions{margin-top:23px;display:flex;gap:10px}
.applied-btn{flex:1;height:52px;border-radius:12px;border:1px solid #7A0F2B;background:#fff;color:#7A0F2B;font:700 16px/30px 'Cairo',sans-serif;display:flex;align-items:center;justify-content:center;text-decoration:none;cursor:pointer}
.applied-btn.primary{background:#7A0F2B;color:#fff}
.applied[data-state=code] .applied-box{padding:36px 26px 22px}
.applied-code .applied-x{top:20px;inset-inline-end:14px}
.verify-art{position:relative;width:190px;height:84px;margin:0 auto}
.verify-art svg{position:absolute;top:0;left:50%;transform:translateX(-50%)}
.applied-code h2{margin:6px 0 0;font-size:24px;line-height:45px}
.verify-text{margin:0.6px 0 0;color:#4F4744;font-size:14.5px;line-height:25.38px}
.verify-text b{color:#2B1B1F;font-weight:700}
.verify-boxes{display:flex;justify-content:center;gap:12px;margin-top:18px}
.verify-box{width:58px;height:62px;box-sizing:border-box;border:1px solid #E3D9C9;border-radius:12px;background:#fff;text-align:center;padding:0;font:700 26px/1 'Cairo',sans-serif;color:#2B1B1F;caret-color:#7A0F2B;outline:none}
.verify-box:focus{border-color:#7A0F2B;box-shadow:0 0 0 3px rgba(122,15,43,.08)}
.verify-box.is-invalid{border-color:#C8312B}
.verify-msg{margin-top:8px;font-size:13px;font-weight:600;line-height:22px;color:#2F7D4F}
.verify-msg:empty{display:none}
.verify-msg.error{color:#C8312B}
.verify-dev{margin-top:4px;font-size:12px;line-height:20px;color:#8A7F78}
.verify-dev[hidden]{display:none}
.verify-submit{display:flex;align-items:center;justify-content:center;width:100%;height:50px;margin-top:18px;border:0;border-radius:12px;background:#7A0F2B;box-shadow:0 8px 18px rgba(122,15,43,.25);color:#fff;font:700 16.5px/30.92px 'Cairo',sans-serif;cursor:pointer}
.verify-submit:disabled{opacity:.6;cursor:default}
.verify-resend{margin-top:14px;padding-inline-end:28.7px;color:#6F6460;font-size:14px;line-height:24.5px}
.verify-again{padding:0;border:0;background:none;font:700 14px/24.5px 'Cairo',sans-serif;color:#7A0F2B;text-decoration:underline;cursor:pointer}
.verify-resend .verify-again:disabled{font-weight:400;color:inherit;text-decoration:none;cursor:default!important;opacity:1}
.verify-wait b{color:#B98A4A;font-weight:800;unicode-bidi:isolate}
.verify-again:not(:disabled)+.verify-wait{display:none}
.verify-note{display:flex;align-items:center;justify-content:center;gap:9.6px;margin-top:14px;padding-top:14px;border-top:1px solid #EFE6D8;color:#6F6460;font-size:13px;line-height:22.1px;text-align:start}
.verify-note svg{flex:none}
.verify-note span{width:394.2px;max-width:100%;padding:0.95px 0}
@media (max-width:480px){.applied[data-state=sent] .applied-box{padding:30px 18px 18px}.applied[data-state=code] .applied-box{padding:36px 18px 18px}.applied h2{font-size:23px;line-height:40px}.applied-actions{flex-direction:column}.verify-note span{width:auto}}
