/* DNB prototype UX layer. The original palette and illustration assets are retained. */
:root{--dnb-ink:#29213c;--dnb-purple:#443077;--dnb-muted:#6d647d;--dnb-line:#ded9ea;--dnb-paper:#fdfcff;--dnb-canvas:#f3f2f8}
html{scroll-padding-top:20px}body{overflow-x:hidden!important}
.dnb-prototype,.ux-reference{width:100%!important;max-width:1440px;box-sizing:border-box}
.dnb-prototype *,.ux-reference *{box-sizing:border-box}
.dnb-prototype div,.dnb-prototype section{min-width:0}
.dnb-prototype button,.ux-reference button{white-space:normal;line-height:1.5!important;transition:background .16s,box-shadow .16s,transform .16s;touch-action:manipulation}
.dnb-prototype button:not(:disabled):active{transform:translateY(2px)}
.dnb-prototype button:disabled,.ux-reference button:disabled{background:#ece9f1!important;color:#746a83!important;border-color:#d8d1e2!important;box-shadow:inset 0 1px 2px #44307718!important;cursor:not-allowed!important;transform:none!important}
.dnb-prototype :focus-visible,.ux-reference :focus-visible{outline:3px solid #66529d;outline-offset:3px}
.dnb-prototype input:not([type=checkbox]),.dnb-prototype textarea,.dnb-prototype select{max-width:100%;min-width:0!important;font-size:16px!important;transition:border-color .16s,box-shadow .16s}
.dnb-prototype textarea{resize:vertical;min-height:110px}
.dnb-prototype input:focus,.dnb-prototype textarea:focus{border-color:#66529d!important;box-shadow:0 0 0 3px #66529d19!important}
.dnb-prototype input[type=checkbox]{flex-shrink:0;cursor:pointer}
.dnb-prototype h1,.dnb-prototype h2,.dnb-prototype h3{overflow-wrap:break-word}
.dnb-prototype h1:focus{outline:none}
.ux-toolbar{padding:8px 24px!important;gap:8px 12px!important;min-height:54px}
.ux-toolbar>a{border:0!important;min-height:36px!important}
.ux-toolbar>span:nth-of-type(2){font-size:11px!important}
.ux-tools-trigger{position:static!important;min-height:36px!important;padding:6px 12px!important;border-radius:8px!important;box-shadow:inset 0 1px 0 #fff,0 2px 0 #c3b8dd!important;background:linear-gradient(#fff,#eee8f8)!important;border-color:#c8bedb!important;color:#443077!important;font-size:12px!important;z-index:auto!important}
.ux-roles{position:relative;flex:none;font-size:12px;color:#443077}
.ux-roles summary{list-style-position:inside;cursor:pointer;padding:8px 12px;border:1px solid #c8bedb;border-radius:8px;background:#fdfcff;font-weight:600;min-height:36px}
.ux-roles[open]>div{position:absolute;inset-inline-end:0;top:calc(100% + 8px);width:245px;z-index:60;padding:10px;background:#fff;border:1px solid #ded9ea;border-radius:12px;box-shadow:0 12px 40px #30205226;display:flex!important;flex-direction:column}
.ux-roles[open]>div button{text-align:start;border-radius:8px!important}
.ux-scenes{padding:8px 24px!important;flex-wrap:nowrap!important;overflow:auto;scrollbar-width:thin;gap:6px!important;scrollbar-color:#c8bedb transparent}
.ux-scenes>span{display:none}.ux-scenes button{flex:none;white-space:nowrap;min-height:38px!important;font-size:12px!important}
.ux-header{padding:10px 24px!important;gap:16px!important}
.ux-header nav{gap:4px!important;flex-wrap:nowrap!important}
.ux-header nav button{padding:4px 10px!important;flex-shrink:0}
.ux-header nav img{width:38px!important;height:38px!important}
.ux-header nav span{font-size:14px!important;line-height:22px!important}
.ux-header>button>span{display:none}.ux-header>button{padding:8px 12px!important}.ux-header>button img{height:42px!important}
.dnb-prototype main{padding:28px 24px 48px!important}
.ux-screen{animation:ux-enter .2s ease-out}
.ux-screen>div:first-child h1{font-size:28px!important;line-height:1.5!important}
.ux-panel{border-radius:16px!important;box-shadow:0 2px 0 #e0dcec,0 8px 24px -18px #44307745!important}
.ux-split{grid-template-columns:minmax(0,2.3fr) minmax(250px,1fr)!important;gap:20px!important}
.ux-split>div{min-width:0}
.ux-table{overflow:auto!important;scrollbar-width:thin;scrollbar-color:#c8bedb #f3f2f8}
.ux-table-row{min-width:790px!important;gap:16px!important}.ux-table-wide .ux-table-row{min-width:1080px!important}
.ux-table-row:not(:first-child):hover{background:#f8f6fc!important}
.ux-table-row button{min-height:40px}
.ux-table-row>div{overflow-wrap:anywhere}
.ux-table>div:last-child:not(.ux-table-row){min-width:0}
.ux-scroll-hint{display:none;color:#6d647d;font-size:12px;margin:0 0 8px}
.ux-results{font-size:13px;color:#6d647d;margin-bottom:-12px}
.ux-empty{text-align:center;padding:28px;background:#fff;border:1px dashed #c8bedb;border-radius:16px}.ux-empty h2{font:700 21px/1.6 Cairo;margin:0;color:#443077}.ux-empty p{color:#6d647d}
.ux-dialog{position:fixed!important;inset:50% auto auto 50%!important;transform:translate(-50%,-50%);z-index:100!important;width:640px!important;max-width:calc(100vw - 32px)!important;max-height:calc(100dvh - 40px)!important;overflow:auto!important;padding:24px!important;background:#fdfcff;border:1px solid #ded9ea;border-radius:18px!important;box-shadow:0 20px 80px #30205233,0 0 0 100vmax #29213c80!important;overscroll-behavior:contain}
.ux-dialog-title,.ux-form-actions{display:flex;justify-content:space-between;align-items:center;gap:12px}.ux-dialog h2{font:700 24px/1.5 Cairo;color:#443077;margin:0}.ux-dialog p{font-size:14px;line-height:1.8;color:#6d647d}.ux-dialog small{display:block;margin-top:14px;color:#6d647d}
.ux-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.ux-field{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:500;margin:0 0 14px}.ux-field input,.ux-field textarea{width:100%;border:1px solid #aaa0be;background:#fff;border-radius:10px;padding:12px;color:#29213c;font:400 16px/1.6 'IBM Plex Sans Arabic',sans-serif}.ux-form-actions{justify-content:flex-start;margin-top:12px}.ux-form-error{color:#963a26!important;padding:12px;background:#fff2ed;border-radius:8px}
.ux-primary,.ux-secondary{min-height:44px;border-radius:10px;padding:10px 18px;font:600 15px/1.5 'IBM Plex Sans Arabic',sans-serif;cursor:pointer;color:#443077;border:1px solid #c8bedb;background:linear-gradient(#fff,#eee8f8);box-shadow:inset 0 1px 0 #fff,0 3px 0 #c3b8dd}.ux-primary{background:linear-gradient(#ffa180,#f0744f);border-color:#da6340;color:#271b49;box-shadow:0 3px 0 #b3472a}
.ux-notice{padding:12px 24px 0!important}.ux-notice[data-kind=error]>div{background:#fff2ed!important;border-color:#e7b2a0!important}.ux-notice[data-kind=error] span,.ux-notice[data-kind=error] button{color:#963a26!important}.ux-notice[data-kind=info]>div{background:#f0effc!important;border-color:#c8c7e4!important}.ux-notice[data-kind=info] span,.ux-notice[data-kind=info] button{color:#443077!important}
.ux-skip{position:fixed;top:8px;right:8px;z-index:150;transform:translateY(-180%);padding:12px;background:#443077;color:white!important;border-radius:8px}.ux-skip:focus{transform:translateY(0)}
.ux-phone{display:flex;flex-direction:column;width:410px!important;max-width:100%;height:calc(100dvh - 252px);min-height:470px;max-height:850px;border-width:8px!important;border-radius:32px!important}
.ux-phone>div{flex-shrink:0}.ux-phone-notch{height:28px!important}.ux-phone-notch span{height:14px!important;width:90px!important}
.ux-phone-body{flex:1!important;min-height:0;height:auto!important;overscroll-behavior:contain;scrollbar-width:thin;padding:12px!important}.ux-phone-body>div{flex:none}.ux-phone-body h1{font-size:24px!important;line-height:1.5!important}.ux-phone-body .ux-panel{padding:16px!important}
.ux-booking-footer{flex:none;border-radius:0!important;box-shadow:0 -5px 18px #4430770a!important;border-width:1px 0 0!important;padding:12px 14px!important;gap:8px!important}.ux-booking-footer button{padding-inline:22px!important}.ux-booking-footer>div:first-child>div:first-child{font-weight:700!important}
.ux-checkout-progress{font-size:12px;color:#6d647d;border-bottom:1px solid #ded9ea;padding-bottom:10px;margin-bottom:4px}
.dnb-prototype .ux-referral{flex:0 1 340px!important;width:100%;min-width:0!important}
@media(min-width:721px){.ux-trip-hero{height:130px!important}.ux-phone-body>div:first-child>div:first-child{padding:12px!important;gap:8px!important}.ux-phone-body>div:first-child>div:first-child h1{font-size:22px!important;margin:2px 0!important}}
@media(max-width:460px){.dnb-prototype .ux-min-content{min-width:0!important;max-width:100%}}
@media(max-width:720px){.ux-reference header{flex-direction:column!important;align-items:flex-start!important;padding:22px!important}.ux-reference header>div{width:100%;flex:auto!important}.ux-reference header h1{font-size:26px!important;line-height:1.6!important}.ux-reference header img{height:40px!important}.ux-reference header>a{align-self:stretch;justify-content:center}}
@media(max-width:460px){.ux-screen[data-scene=intro]>div:first-child,.ux-screen[data-scene=closing]>div:first-child{flex-direction:column!important;align-items:flex-start!important;padding:22px!important;gap:16px!important}.ux-screen[data-scene=intro]>div:first-child>div,.ux-screen[data-scene=closing]>div:first-child>div{width:100%;flex:auto!important}.ux-screen[data-scene=closing]>div:first-child>img{width:80px!important;height:80px!important}.ux-screen[data-scene=closing] h1{font-size:24px!important;line-height:1.6!important}}
.ux-reference [style*="min-width"]{min-width:0!important}.ux-reference input,.ux-reference textarea{max-width:100%}
@keyframes ux-enter{from{opacity:.65;transform:translateY(4px)}to{opacity:1;transform:none}}
@media(max-width:1100px){.ux-split{grid-template-columns:minmax(0,1fr)!important}.ux-split>div:last-child{min-width:0}.ux-header>div:first-child>span:first-of-type{display:none}.ux-toolbar>span:nth-of-type(2){display:none}.ux-scroll-hint{display:block}.ux-header>div:first-child>button{display:none}}
@media(max-width:720px){.ux-toolbar{padding:8px 12px!important;gap:8px!important}.ux-toolbar>span{display:none}.ux-toolbar>a{font-size:11px!important;padding-inline:0!important}.ux-toolbar .ux-tools-trigger{margin-inline-start:auto}.ux-roles summary{font-size:11px;padding:8px}.ux-scenes{padding:8px 12px!important}.ux-header{padding:10px 12px!important;gap:10px!important}.ux-header>div:first-child{display:none!important}.ux-header>button{order:-1;padding:6px!important}.ux-header>button img{height:34px!important}.ux-header nav{justify-content:flex-start!important;overflow-x:auto;scrollbar-width:none}.ux-header nav button{padding:2px 8px!important}.ux-header nav img{width:30px!important;height:30px!important}.ux-header nav span{font-size:12px!important;white-space:nowrap}.dnb-prototype main{padding:20px 14px 32px!important}.ux-screen>div:first-child h1{font-size:24px!important}.ux-panel{padding:18px!important}.ux-panel.ux-table{padding:0!important}.ux-table-row{padding:12px 16px!important}.ux-small-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.ux-funnel-row{grid-template-columns:1fr 1fr!important;gap:6px!important}.ux-funnel-row>div:nth-child(2){grid-row:2;grid-column:1 / -1}.ux-funnel-row>div:last-child{text-align:end}.ux-dialog{padding:18px!important}.ux-phone{border:0!important;border-radius:0!important;width:100%!important;max-width:480px;height:auto!important;min-height:0!important;max-height:none!important;box-shadow:none!important;overflow:visible!important}.ux-phone-notch{display:none!important}.ux-phone-body{overflow:visible!important;padding:0!important}.dnb-prototype[data-screen=traveler] main{padding:0 14px 120px!important}.ux-booking-footer{position:fixed;inset:auto 0 0;z-index:30;padding:12px max(16px,calc((100vw - 450px)/2)) calc(12px + env(safe-area-inset-bottom))!important;box-shadow:0 -6px 24px #4430771a!important}.ux-phone>div:nth-child(2){margin-bottom:14px}.ux-phone-body input{scroll-margin-top:16px}.ux-reference{padding:20px 14px!important}.ux-reference [style*="padding:28px"],.ux-reference [style*="padding:32px"]{padding:20px!important}}
@media(max-width:460px){.ux-form-grid{grid-template-columns:1fr}.ux-small-grid{grid-template-columns:1fr!important}.dnb-prototype [style*="min-width:280px"],.dnb-prototype [style*="min-width:250px"]{min-width:0!important;max-width:100%}.dnb-prototype [style*="min-width:220px"]{min-width:0!important}.ux-screen [style*="padding:32px"]{padding:20px!important}.ux-screen[data-scene=intro]>div:first-child>img{width:80px!important;height:80px!important}.ux-screen[data-scene=intro]>div:first-child{gap:14px!important}.ux-screen[data-scene=intro]>div:first-child>div{flex-basis:100%}.ux-screen[data-scene=closing] h1{font-size:26px!important;line-height:1.6!important}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}