/* FindMyStay — full-width app shell */
:root {
    --ss-font: "Inter", sans-serif;
    --ss-content-max: none;
    --ss-content-pad: clamp(16px, 2.5vw, 40px);
    --ss-header-h: 88px;
    --ss-header-bg: #0a2540;
    --ss-header-bg-deep: #061a2e;
    --ss-accent: #1565c0;
    --ss-accent-deep: #0d47a1;
}

/* Dark-blue header (overrides theme green #294b29 colored topbar) */
body[data-layout="horizontal"][data-topbar="colored"] #page-topbar,
body[data-topbar="colored"] #page-topbar,
#page-topbar {
    background-color: var(--ss-header-bg) !important;
    background-image: none !important;
    box-shadow: 0 2px 8px rgba(6, 26, 46, 0.25) !important;
}

body[data-layout="horizontal"][data-topbar="colored"] .header-item,
body[data-layout="horizontal"][data-topbar="colored"] .header-item:hover,
body[data-topbar="colored"] .header-item,
body[data-topbar="colored"] .noti-icon i {
    color: #fff !important;
}

html,
body,
button,
input,
select,
textarea,
.btn,
.form-control,
.dropdown-menu,
.card,
.nav,
.navbar,
h1, h2, h3, h4, h5, h6,
p, a, span, li, label, table, th, td {
    font-family: var(--ss-font) !important;
}

html, body {
    font-family: var(--ss-font) !important;
}

body {
    background: #fff;
}

/* Force fluid width — override theme boxed / 85% / 1300px caps */
body[data-layout="horizontal"] #layout-wrapper,
body[data-layout="horizontal"][data-layout-size="boxed"] #layout-wrapper,
body[data-layout-size="boxed"] #layout-wrapper {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    background: #fff;
    position: relative;
    box-shadow: none !important;
}

body[data-layout="horizontal"] #page-topbar,
body[data-layout="horizontal"][data-layout-size="boxed"] #page-topbar,
body[data-layout-size="boxed"] #page-topbar,
body[data-layout="horizontal"] .footer,
body[data-layout="horizontal"][data-layout-size="boxed"] .footer,
body[data-layout-size="boxed"] .footer {
    max-width: 100% !important;
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body[data-layout="horizontal"] .navbar-header,
body[data-layout="horizontal"] .container-fluid,
body[data-layout="horizontal"][data-layout-size="boxed"] .navbar-header,
body[data-layout="horizontal"][data-layout-size="boxed"] .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
}

/*
 * Theme horizontal topnav is a large white panel (often ~360px when the
 * state/city menu expands) that covers page content. Remove it everywhere.
 */
body[data-layout="horizontal"] .topnav,
body[data-layout="horizontal"] #page-topbar > .container-fluid:has(.topnav) {
    display: none !important;
    height: 0 !important;
    max-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* Theme sets .footer { position:absolute; bottom:0; height:60px } —
   keep footer in normal flow. */
body[data-layout="horizontal"] .main-content {
    overflow: visible;
    min-height: calc(100vh - var(--ss-header-h));
    display: flex;
    flex-direction: column;
    margin-left: 0 !important;
    width: 100% !important;
}

body[data-layout="horizontal"] .page-content {
    flex: 1 0 auto;
    margin-top: 0 !important;
    padding-top: calc(var(--ss-header-h) + 1rem) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
}

.main-content .page-content {
    padding-bottom: 1.5rem;
}

body[data-layout="horizontal"] .footer {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    flex-shrink: 0;
}

/* Primary content shell — full width with side padding */
.ss-page-container {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
    padding-left: var(--ss-content-pad);
    padding-right: var(--ss-content-pad);
    box-sizing: border-box;
}

/* Nested Bootstrap .container inside our shell should not shrink again */
.ss-page-container > .container,
.ss-page-container > .container-fluid,
.ss-page-container > .container-sm,
.ss-page-container > .container-md,
.ss-page-container > .container-lg,
.ss-page-container > .container-xl,
.ss-page-container > .container-xxl {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.ss-page-footer-keywords,
.ss-page-footer-keywords .footer-keywords,
.ss-page-footer-keywords .container,
.ss-page-footer-keywords .container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box;
}

.ss-page-footer-keywords {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Header aligns edge-to-edge with content padding */
body[data-layout="horizontal"] #page-topbar .navbar-header {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--ss-content-pad) !important;
    padding-right: var(--ss-content-pad) !important;
}

.footer .container-fluid {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--ss-content-pad) !important;
    padding-right: var(--ss-content-pad) !important;
}

@media (max-width: 575.98px) {
    :root {
        --ss-content-pad: 14px;
    }
}
