/**
 * HomelandBooking — Option 2: Sky Blue + Teal
 * Include before page-specific styles.
 */
:root {
    --hb-primary: #0EA5E9;
    --hb-primary-dark: #0284C7;
    --hb-primary-light: #38BDF8;
    --hb-primary-soft: #E0F2FE;
    --hb-teal: #0D9488;
    --hb-teal-dark: #0F766E;
    --hb-teal-darker: #115E59;
    --hb-teal-soft: #CCFBF1;
    --hb-success: #22C55E;
    --hb-success-dark: #16A34A;
    --hb-success-soft: #DCFCE7;
    --hb-success-text: #166534;
    --hb-danger: #EF4444;
    --hb-danger-dark: #DC2626;
    --hb-warning: #F59E0B;
    --hb-text: #0F172A;
    --hb-text-muted: #64748B;
    --hb-bg: #F8FAFC;
    --hb-gradient-brand: linear-gradient(135deg, #38BDF8 0%, #0EA5E9 45%, #0D9488 100%);
    --hb-gradient-cta: linear-gradient(135deg, #0EA5E9 0%, #0D9488 100%);
    --hb-gradient-hero: linear-gradient(135deg, #0EA5E9 0%, #0284C7 50%, #0D9488 100%);
}

/* Semantic states — keep green for success actions */
.btn-approve,
.action-btn.btn-approve {
    background: var(--hb-success) !important;
    color: #fff !important;
}

.btn-approve:hover,
.action-btn.btn-approve:hover {
    background: var(--hb-success-dark) !important;
}

.status-active,
.status-approved,
.status-badge.status-active,
.status-badge.status-approved {
    background: var(--hb-success-soft) !important;
    color: var(--hb-success-text) !important;
}

.flash-success,
.flash-message.flash-success {
    background: var(--hb-success-soft) !important;
    color: var(--hb-success-text) !important;
    border-color: #BBF7D0 !important;
}

/* Role badges */
.sidebar-role-label.host {
    background: var(--hb-teal-soft) !important;
    color: var(--hb-teal-dark) !important;
}

.sidebar-role-label.client {
    background: var(--hb-primary-soft) !important;
    color: var(--hb-primary-dark) !important;
}

/* Site footer */
.site-footer {
    margin-top: auto;
    padding: 1.25rem 1.5rem;
    background: #fff;
    border-top: 1px solid #e2e8f0;
    text-align: center;
}

.site-footer-inner {
    max-width: 1200px;
    margin: 0 auto;
}

.site-footer-copy,
.site-footer-credit {
    margin: 0;
    font-size: 0.875rem;
    line-height: 1.6;
    color: var(--hb-text-muted);
}

.site-footer-credit {
    margin-top: 0.35rem;
    font-size: 0.8125rem;
}

.site-footer .footer-bottom {
    border-top: none;
    padding-top: 0;
}

.dashboard-container {
    display: flex;
    min-height: 100vh;
}

.dashboard-container .main-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
}

@media (min-width: 769px) {
    /* Host/client: main column sits beside fixed sidebar */
    .dashboard-container > .main-content {
        margin-left: 260px;
        flex: 1;
        min-width: 0;
    }

    /* Admin: outer shell offset only — inner main must not double-offset */
    .dashboard-container > .admin-main {
        margin-left: 260px;
        flex: 1;
        min-width: 0;
        width: calc(100% - 260px);
    }

    .dashboard-container .admin-main .main-content {
        margin-left: 0;
        width: 100%;
        max-width: none;
    }

    .dashboard-container .main-content {
        min-height: 100vh;
    }
}

.dashboard-container .main-content > .site-footer {
    margin-top: auto;
    width: 100%;
}

.admin-main > .site-footer {
    width: 100%;
}

.auth-page {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
}

.auth-page .auth-main {
    flex: 1;
}

.auth-page .site-footer {
    flex-shrink: 0;
    width: 100%;
    margin-top: 0;
}