/* Xenora skin for legacy pages (hotel details, booking, payment, orders, profile, login ...).
   Loaded after screen.css/app.css; only restyles, never changes layout logic. Design System v1.3 */
body{font-family:var(--font-body);background:var(--color-bg-page);color:var(--color-text-primary);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--color-text-primary);letter-spacing:-.005em}
a{color:inherit}
p,li,td,th,label,input,select,textarea,button{font-family:var(--font-body)}
.container{max-width:1280px;padding-left:var(--gutter);padding-right:var(--gutter)}
.mainouter,.innerContent{background:transparent}

/* surfaces */
.accountbox,.detailsbox,.contentarea,.innerbox,.tablestyle,.profilelisting li,.popupcontant{border-radius:var(--radius-4)}
.accountbox .head h3,.innerContent .head h3,.innerContent h3{font:600 24px/32px var(--font-heading)}
.accountbox .contentarea,.contentarea.purchase{background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);box-shadow:none;overflow:hidden}
.innerContent .graybox,.graybox{background:var(--color-bg-subtle);color:var(--color-text-secondary);border:0}
.innerContent .graybox a,.innerContent .profilelisting li .details a,.contentarea .recoverInfo a,.contentarea.purchase .print,.innerContent .terms a,.popupOuter a,.detailsbox .summary p.bold{color:var(--color-text-primary);text-decoration:underline}

/* form controls */
.formcontrol,.formstyle input[type=text],.formstyle input[type=password],.formstyle input[type=email],.formstyle textarea,select,textarea{border:1px solid var(--color-border-default);border-radius:var(--radius-3);background:#fff;color:var(--color-text-primary);font:400 16px/24px var(--font-body);box-shadow:none}
.formstyle .formcontrol{height:48px;padding-top:0;padding-bottom:0}
.formcontrol:hover{border-color:var(--color-border-hover)}
.formcontrol:focus,input:focus,select:focus,textarea:focus{outline:0;border-color:var(--color-border-input-focus);box-shadow:var(--shadow-focus)}
::placeholder{color:var(--color-text-placeholder)}
.formcontrol.error,input.error{border-color:var(--color-status-error);color:var(--color-status-error)}
label.error{color:var(--color-status-error);font-size:14px}
.formgroup{-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none}

/* buttons: primary = charcoal */
.button,.btn-submit,.formstyle .button,.gustDetails .button,.tablestyle .booknow,.searchform .searchbutton,.searchform .checkbutton,.banner .searchbox .searchbutton,input[type=submit]{background:var(--color-brand-primary);border:1px solid var(--color-brand-primary);border-bottom:1px solid var(--color-brand-primary);color:#fff;border-radius:var(--radius-3);font:600 14px/20px var(--font-body);text-transform:none;letter-spacing:0;height:48px;padding:0 var(--space-6);box-shadow:none;transition:background .15s}
.button:hover,.btn-submit:hover,.formstyle .button:hover,.gustDetails .button:hover,.tablestyle .booknow:hover,.searchform .searchbutton:hover,.searchform .checkbutton:hover,input[type=submit]:hover{background:var(--color-brand-hover);border-color:var(--color-brand-hover);color:#fff}
/* secondary */
.btn,.tablestyle .btn{background:#fff;border:1px solid var(--color-border-default);color:var(--color-text-primary);border-radius:var(--radius-2);font:600 14px/20px var(--font-body);height:40px;line-height:38px;padding:0 var(--space-5)}
.btn:hover,.tablestyle .btn:hover{background:var(--color-bg-subtle);border-color:var(--color-border-hover);color:var(--color-text-primary)}
.tablestyle .btn{height:auto;line-height:20px;padding:10px var(--space-4)}
.tablestyle .booknow{height:auto;padding:10px var(--space-4)}

/* hotel details */
.hotelbanner,.hotelbanner .item img{border-radius:0}
.tablestyle{background:var(--color-bg-surface);border:1px solid var(--color-border-subtle);overflow:hidden}
.tablestyle h5,.tablestyle h5 a,.tablestyle .price h6{color:var(--color-text-primary);font-family:var(--font-heading)}
.tablestyle th{background:var(--color-bg-subtle);color:var(--color-text-primary);font:600 14px/20px var(--font-body)}
.tablestyle td,.tablestyle p{color:var(--color-text-secondary)}
.booking-mode-tabs .mode-tab{border:1px solid var(--color-border-default)!important;background:#fff!important;color:var(--color-text-primary)!important;border-radius:var(--radius-full)!important;font:600 14px/20px var(--font-body)!important;padding:10px 20px!important}
.booking-mode-tabs .mode-tab.active{background:var(--color-brand-primary)!important;border-color:var(--color-brand-primary)!important;color:#fff!important}
.card-modes .mode-btn{border:1px solid var(--color-border-default)!important;background:#fff!important;color:var(--color-text-primary)!important;border-radius:var(--radius-2)!important}
.card-modes .mode-btn:hover{background:var(--color-bg-subtle)!important}
.hourly-badge{color:var(--color-accent-warm)!important}
.fav:hover:before,.fav.active:before,.listingBox li .fav.active:before{color:var(--color-accent-warm)}
.searchform .category .formcontrol:hover,.searchform .category .formcontrol.active{background:var(--color-brand-primary);border-color:var(--color-brand-primary);color:#fff}

/* tables, alerts, popups */
.alert{border-radius:var(--radius-3)}
.popupOuter .popupcontant{box-shadow:var(--shadow-dialog)}
.rightnav a:hover,.rightnav a.btn:hover{color:var(--color-text-primary)}

/* datepicker (legacy pages share bootstrap-datepicker) */
.datepicker{border-radius:var(--radius-3);box-shadow:var(--shadow-popover);font-family:var(--font-body)}
.datepicker td.active,.datepicker td.active:hover,.datepicker td.active:focus,.datepicker td.active:active,.datepicker td span.active,.datepicker td span.active:hover{background-color:var(--color-brand-primary)!important;background-image:none!important;color:#fff;text-shadow:none;border-radius:var(--radius-2)}
.datepicker td,.datepicker th{border-radius:var(--radius-2)}

/* polish */
.head h1,.head h2,.innerContent h1,.innerContent h2,.mainouter h2{color:var(--color-text-primary)!important;font-family:var(--font-heading)}
.hotelbanner{border-radius:var(--radius-5);overflow:hidden}
