/*
 * Inderwildi CRM shell aligned with laia.inderwildi.org.
 * Keep product boundaries: visual language is shared, functionality stays CRM-specific.
 */
:root {
    --iw-bg: #f6f8fc;
    --iw-surface: #ffffff;
    --iw-surface-alt: #eef3fb;
    --iw-surface-strong: #e3ebf8;
    --iw-ink: #122033;
    --iw-muted: #56657a;
    --iw-accent: #2563EB;
    --iw-accent-strong: #1d43ad;
    --iw-violet: #7C3AED;
    --iw-cyan: #06B6D4;
    --iw-border: #d7dfeb;
    --iw-focus: #6a46d9;
    --iw-radius-sm: 10px;
    --iw-radius: 16px;
    --iw-radius-lg: 22px;
    --iw-shadow-sm: 0 8px 24px rgba(24,44,74,.06);
    --iw-shadow: 0 18px 48px rgba(24,44,74,.10);
    --iw-max: 1160px;
    --iw-sidebar: 272px;
    --iw-topbar: 70px;
}

html { background: var(--iw-bg); }

body {
    margin: 0;
    background: var(--iw-bg);
    color: var(--iw-ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.62;
}

body h1, body h2, body h3, body h4, body h5 {
    color: var(--iw-ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    letter-spacing: -.025em;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
    outline: 4px solid var(--iw-focus);
    outline-offset: 3px;
}

.iw-skip-link {
    position: fixed;
    left: 1rem;
    top: -10rem;
    z-index: 3000;
    padding: .8rem 1rem;
    border-radius: var(--iw-radius-sm);
    background: var(--iw-ink);
    color: var(--iw-surface);
    text-decoration: none;
}
.iw-skip-link:focus { top: 1rem; }

.iw-app-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    width: var(--iw-sidebar);
    padding: 1.15rem;
    display: flex;
    flex-direction: column;
    z-index: 1100;
    background: var(--iw-surface);
    border-right: 1px solid var(--iw-border);
}

.iw-app-brand {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .35rem .25rem 1.25rem;
    color: var(--iw-ink);
    text-decoration: none;
}

.iw-app-brand-mark {
    width: 48px;
    height: 48px;
    display: grid;
    place-items: center;
    flex: 0 0 48px;
    border-radius: 14px;
    background: linear-gradient(135deg, var(--iw-violet), var(--iw-accent), var(--iw-cyan));
    color: #fff;
    font-size: 1.35rem;
    font-weight: 850;
    box-shadow: var(--iw-shadow-sm);
}

.iw-app-brand-copy strong,
.iw-app-brand-copy small {
    display: block;
}

.iw-app-brand-copy strong { font-size: 1rem; }

.iw-app-brand-copy small {
    margin-top: .1rem;
    color: var(--iw-muted);
    font-size: .72rem;
}

.iw-app-nav {
    display: grid;
    gap: .28rem;
    margin-top: .35rem;
}

.iw-app-nav a {
    min-height: 48px;
    display: grid;
    grid-template-columns: 30px 1fr;
    align-items: center;
    gap: .6rem;
    padding: .68rem .75rem;
    border: 1px solid transparent;
    border-radius: 12px;
    color: var(--iw-ink);
    font-weight: 700;
    text-decoration: none;
}

.iw-app-nav a:hover {
    background: var(--iw-surface-alt);
    border-color: var(--iw-border);
}

.iw-app-nav a.active {
    background: var(--iw-surface-strong);
    border-color: var(--iw-border);
    color: var(--iw-accent-strong);
    box-shadow: inset 3px 0 0 var(--iw-accent);
}

.iw-app-nav-icon {
    width: 28px;
    min-height: 28px;
    display: grid;
    place-items: center;
    border-radius: 8px;
    background: var(--iw-surface-alt);
    font-size: .75rem;
    font-weight: 900;
}

.iw-app-nav a.active .iw-app-nav-icon {
    background: var(--iw-accent);
    color: #fff;
}

.iw-app-sidebar-actions {
    margin-top: auto;
    padding-top: 1rem;
}

.iw-app-sidebar-actions p {
    margin: .85rem .2rem 0;
    color: var(--iw-muted);
    font-size: .78rem;
}

.iw-app-button {
    width: 100%;
    min-height: 48px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: .55rem;
    padding: .72rem 1.05rem;
    border: 2px solid transparent;
    border-radius: 11px;
    font-weight: 800;
    text-decoration: none;
}

.iw-app-button-primary {
    background: var(--iw-accent);
    color: #fff;
}

.iw-app-button-primary:hover {
    background: var(--iw-accent-strong);
    color: #fff;
}

.iw-app-button-secondary {
    background: var(--iw-surface);
    border-color: var(--iw-accent);
    color: var(--iw-accent-strong);
}

.iw-app-account {
    display: flex;
    align-items: center;
    gap: .65rem;
    padding: .65rem;
    border-radius: 11px;
    color: var(--iw-ink);
    text-decoration: none;
    background: var(--iw-surface-alt);
}

.iw-shell-user-avatar {
    width: 34px !important;
    height: 34px !important;
    border-radius: 50%;
    object-fit: cover;
}

.iw-app-topbar {
    position: sticky;
    top: 0;
    z-index: 900;
    min-height: var(--iw-topbar);
    margin-left: var(--iw-sidebar);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: .8rem max(1.25rem, calc((100vw - var(--iw-sidebar) - var(--iw-max))/2));
    background: color-mix(in srgb, var(--iw-bg) 88%, transparent);
    border-bottom: 1px solid var(--iw-border);
    backdrop-filter: blur(16px);
}

.iw-app-topbar > div:first-child { display: grid; }

.iw-app-topbar-kicker {
    color: var(--iw-muted);
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.iw-app-topbar strong { font-weight: 800; }

.iw-app-topbar-actions a {
    color: var(--iw-accent-strong);
    font-weight: 750;
    text-decoration: none;
}

.iw-app-mobile-nav { display: none; }

/* Odoo content frame: gives all public/portal pages the same readable gutters as LAIA. */
#wrap,
.o_portal_wrap,
main,
.oe_website_login_container {
    margin-left: var(--iw-sidebar);
}

#wrap .container,
.iw-laia-home .container,
.o_portal_wrap > .container,
.o_portal .container {
    width: min(calc(100% - 2.5rem), var(--iw-max)) !important;
    max-width: var(--iw-max) !important;
    margin-inline: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

#wrap p,
#wrap li,
.o_portal_wrap p,
.o_portal_wrap li {
    max-width: 72ch;
}

/* Login */
.oe_website_login_container {
    min-height: calc(100vh - var(--iw-topbar));
    padding: 44px max(1.25rem, calc((100vw - var(--iw-sidebar) - var(--iw-max))/2));
    display: grid;
    place-items: center;
    background: var(--iw-bg);
}

.oe_website_login_container .oe_login_form,
.oe_website_login_container .oe_signup_form,
.oe_website_login_container .oe_reset_password_form {
    width: min(100%, 460px) !important;
    margin: 0 auto !important;
    padding: 30px !important;
    border: 1px solid var(--iw-border);
    border-radius: var(--iw-radius-lg);
    background: var(--iw-surface);
    box-shadow: var(--iw-shadow);
}

/* Portal */
.o_portal_wrap {
    min-height: calc(100vh - var(--iw-topbar));
    background: var(--iw-bg);
}

.o_portal_my_home {
    padding-top: 32px;
    padding-bottom: 52px;
}

.o_portal_category {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem !important;
    margin-top: 1rem !important;
}

.o_portal_index_card {
    width: auto !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.o_portal_index_card > a {
    min-height: 110px;
    display: flex !important;
    align-items: center;
    gap: 14px !important;
    padding: 18px !important;
    border: 1px solid var(--iw-border) !important;
    border-radius: var(--iw-radius) !important;
    background: var(--iw-surface) !important;
    box-shadow: var(--iw-shadow-sm);
    color: var(--iw-ink) !important;
    text-decoration: none !important;
}

.o_portal_index_card > a:hover {
    border-color: rgba(37,99,235,.35) !important;
    box-shadow: var(--iw-shadow);
}

.o_portal_wrap table,
.o_portal table {
    width: 100%;
    border-collapse: collapse;
}

.o_portal_wrap th,
.o_portal_wrap td,
.o_portal th,
.o_portal td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--iw-border);
    text-align: left;
}

/* Footer copied in structure from LAIA, content remains CRM-specific. */
.iw-app-footer {
    margin-left: var(--iw-sidebar);
    padding: 3rem 0 1.5rem;
    background: #111b2a;
    color: #fff;
}

.iw-app-shell {
    width: min(calc(100% - 2.5rem), var(--iw-max));
    margin-inline: auto;
}

.iw-app-footer a { color: #fff; }

.iw-app-footer p {
    max-width: 52ch;
    color: #d4ddea;
}

.iw-app-footer-grid {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 2rem;
}

.iw-app-footer-grid > div {
    display: grid;
    align-content: start;
    gap: .55rem;
}

.iw-app-footer-meta {
    margin-top: 2rem;
    padding-top: 1rem;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    border-top: 1px solid #44546b;
    color: #d4ddea;
    font-size: .88rem;
}

/* Hide legacy theme footer/logo remnants if an older inherited view is still present. */
.iw-footer-logo-link,
.iw-footer-logo,
.iw-nav-wrap {
    display: none !important;
}

@media (max-width: 860px) {
    :root { --iw-sidebar: 0px; }

    .iw-app-sidebar { display: none; }

    .iw-app-topbar {
        margin-left: 0;
        padding-left: 6.8rem;
    }

    .iw-app-mobile-nav {
        display: block;
        position: fixed;
        left: 1rem;
        top: .7rem;
        z-index: 1200;
    }

    .iw-app-mobile-nav summary {
        min-height: 46px;
        display: inline-flex;
        align-items: center;
        padding: .6rem .8rem;
        border: 1px solid var(--iw-border);
        border-radius: 11px;
        background: var(--iw-surface);
        color: var(--iw-ink);
        font-weight: 800;
        box-shadow: var(--iw-shadow-sm);
        cursor: pointer;
        list-style: none;
    }

    .iw-app-mobile-nav summary::-webkit-details-marker { display: none; }

    .iw-app-mobile-panel {
        width: min(86vw, 300px);
        margin-top: .5rem;
        padding: .7rem;
        display: grid;
        gap: .2rem;
        border: 1px solid var(--iw-border);
        border-radius: var(--iw-radius);
        background: var(--iw-surface);
        box-shadow: var(--iw-shadow);
    }

    .iw-app-mobile-panel a {
        padding: .75rem;
        border-radius: 10px;
        color: var(--iw-ink);
        font-weight: 700;
        text-decoration: none;
    }

    .iw-app-mobile-panel a:hover { background: var(--iw-surface-alt); }

    #wrap,
    .o_portal_wrap,
    main,
    .oe_website_login_container,
    .iw-app-footer {
        margin-left: 0;
    }
}

@media (max-width: 640px) {
    #wrap .container,
    .iw-laia-home .container,
    .o_portal_wrap > .container,
    .o_portal .container,
    .iw-app-shell {
        width: min(calc(100% - 1.2rem), var(--iw-max)) !important;
    }

    .iw-app-footer-grid { grid-template-columns: 1fr; }

    .iw-app-footer-meta {
        display: block;
    }

    .o_portal_category {
        grid-template-columns: 1fr;
    }
}


/* Public landing shell: one login action only, no CRM sidebar/navigation. */
.iw-public-header {
    margin: 0;
    border-top: 5px solid #0b5fa5;
    background: linear-gradient(90deg, #fbfdff 0%, #f7fbff 52%, #eef7ff 100%);
}

.iw-public-header-inner {
    width: min(calc(100% - 3rem), 1260px);
    min-height: 150px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2rem;
}

.iw-public-brand {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
}

.iw-public-brand img {
    width: 190px;
    height: auto;
    display: block;
}

.iw-public-site-link {
    color: #0b5fa5;
    font-weight: 800;
    text-decoration: none;
}

.iw-public-site-link:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.iw-public-footer {
    margin: 0 !important;
    background: linear-gradient(90deg, #fbfdff 0%, #f7fbff 52%, #eef7ff 100%);
    color: #6b8298;
}

.iw-public-footer-inner {
    width: min(calc(100% - 3rem), 1260px);
    margin: 0 auto;
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    border-top: 1px solid #d8e7f4;
    font-size: .82rem;
}

body:has(.iw-public-header) #wrap,
body:has(.iw-public-header) main,
body:has(.iw-public-header) .oe_website_login_container,
body:has(.iw-public-header) .o_portal_wrap {
    margin-left: 0 !important;
}

body:has(.iw-public-header) .oe_website_login_container {
    background: linear-gradient(90deg, #fbfdff 0%, #f7fbff 52%, #eef7ff 100%);
}

@media (max-width: 720px) {
    .iw-public-header-inner {
        width: min(calc(100% - 2rem), 1260px);
        min-height: 118px;
    }

    .iw-public-brand img {
        width: 150px;
    }

    .iw-public-site-link {
        font-size: .9rem;
    }

    .iw-public-footer-inner {
        width: min(calc(100% - 2rem), 1260px);
        min-height: 84px;
        align-items: flex-start;
        justify-content: center;
        flex-direction: column;
        gap: .25rem;
        padding: 1rem 0;
    }
}


/* Public CRM homepage: hide Odoo/legacy website chrome outside our own shell. */
body:has(.iw-laia-home) > #wrapwrap > header#top,
body:has(.iw-laia-home) > #wrapwrap > footer#bottom {
    display: none !important;
}

/* Keep only the header/footer embedded in the CRM homepage itself. */
body:has(.iw-laia-home) .iw-public-header,
body:has(.iw-laia-home) .iw-public-footer {
    display: block !important;
}


/* Polished Odoo login page for the Inderwildi customer portal. */
.oe_website_login_container {
    margin-left: 0 !important;
    min-height: 100vh !important;
    padding: clamp(2rem, 6vw, 5rem) 1.25rem !important;
    background:
        radial-gradient(circle at 50% 35%, rgba(11,95,165,.08), transparent 34rem),
        linear-gradient(135deg, #f8fbff 0%, #eef6fd 100%) !important;
}

.oe_website_login_container .oe_login_form,
.oe_website_login_container .oe_signup_form,
.oe_website_login_container .oe_reset_password_form {
    position: relative;
    width: min(100%, 470px) !important;
    margin: 0 auto !important;
    padding: 7.5rem 2.25rem 2.25rem !important;
    border: 1px solid #d8e7f4 !important;
    border-radius: 24px !important;
    background: #fff !important;
    box-shadow: 0 24px 70px rgba(11,47,87,.12) !important;
}

.oe_website_login_container .oe_login_form::before,
.oe_website_login_container .oe_signup_form::before,
.oe_website_login_container .oe_reset_password_form::before {
    content: "";
    position: absolute;
    top: 2rem;
    left: 2.25rem;
    width: 190px;
    height: 64px;
    background: url("/inderwildi_customer_policy/static/src/img/inderwildi-logo.svg") left center / contain no-repeat;
}

.oe_website_login_container label {
    display: block;
    margin: 0 0 .45rem !important;
    color: #183b5c !important;
    font-size: .9rem !important;
    font-weight: 750 !important;
}

.oe_website_login_container .mb-3,
.oe_website_login_container .o_caps_lock_warning {
    margin-bottom: 1.15rem !important;
}

.oe_website_login_container .form-control {
    width: 100% !important;
    min-height: 50px !important;
    padding: .75rem .9rem !important;
    border: 1px solid #cbdbea !important;
    border-radius: 11px !important;
    background: #fbfdff !important;
    color: #122033 !important;
    font: inherit !important;
    box-shadow: none !important;
}

.oe_website_login_container .form-control:focus {
    border-color: #0b5fa5 !important;
    outline: 3px solid rgba(11,95,165,.14) !important;
    outline-offset: 1px !important;
    background: #fff !important;
}

.oe_website_login_container .input-group {
    display: flex !important;
    align-items: stretch !important;
}

.oe_website_login_container .input-group .form-control {
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

.oe_website_login_container .input-group .btn {
    min-width: 48px !important;
    border: 1px solid #cbdbea !important;
    border-left: 0 !important;
    border-radius: 0 11px 11px 0 !important;
    background: #f4f8fc !important;
    color: #355978 !important;
}

.oe_website_login_container .oe_login_buttons {
    display: grid !important;
    gap: .7rem !important;
    margin-top: .6rem !important;
    text-align: center !important;
}

.oe_website_login_container .oe_login_buttons > .btn-primary,
.oe_website_login_container button[type="submit"].btn-primary {
    width: 100% !important;
    min-height: 50px !important;
    padding: .75rem 1rem !important;
    border: 0 !important;
    border-radius: 11px !important;
    background: #0b2f57 !important;
    color: #fff !important;
    font: inherit !important;
    font-weight: 800 !important;
    cursor: pointer !important;
    box-shadow: 0 10px 24px rgba(11,47,87,.16) !important;
}

.oe_website_login_container .oe_login_buttons > .btn-primary:hover,
.oe_website_login_container button[type="submit"].btn-primary:hover {
    background: #0b5fa5 !important;
}

.oe_website_login_container a {
    color: #0b5fa5 !important;
    font-weight: 650;
    text-underline-offset: 3px;
}

.oe_website_login_container .alert {
    padding: .8rem .9rem !important;
    border-radius: 10px !important;
    font-size: .9rem !important;
}

.oe_website_login_container .text-muted,
.oe_website_login_container .small {
    color: #6b8298 !important;
}

@media (max-width: 560px) {
    .oe_website_login_container {
        padding: 1rem !important;
    }

    .oe_website_login_container .oe_login_form,
    .oe_website_login_container .oe_signup_form,
    .oe_website_login_container .oe_reset_password_form {
        padding: 6.8rem 1.35rem 1.5rem !important;
        border-radius: 18px !important;
    }

    .oe_website_login_container .oe_login_form::before,
    .oe_website_login_container .oe_signup_form::before,
    .oe_website_login_container .oe_reset_password_form::before {
        left: 1.35rem;
        width: 165px;
    }
}


/* Login page: remove legacy website footer/header chrome. */
body:has(.oe_website_login_container) > #wrapwrap > footer#bottom,
body:has(.oe_website_login_container) > #wrapwrap > header#top {
    display: none !important;
}

/* Keep the login viewport clean and centered. */
body:has(.oe_website_login_container) #wrapwrap,
body:has(.oe_website_login_container) main {
    min-height: 100vh;
    background: transparent !important;
}