@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Sora:wght@600;700&display=swap');

/* ═══════════════════════════════════════
   SIDEBAR
═══════════════════════════════════════ */
.fi-sidebar,
.fi-sidebar.fi-sidebar-open {
    background-color: #f0fdfb !important;
    border-right: 1px solid #b2ece7 !important;
}
.fi-sidebar-header {
    background-color: #f0fdfb !important;
    border-bottom: 1px solid #b2ece7 !important;
    box-shadow: none !important;
}
.fi-sidebar-item-button {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    color: #374151 !important;
    border-radius: 8px !important;
    transition: all 0.15s !important;
}
.fi-sidebar-item-button:hover {
    background-color: #ccfbf5 !important;
    color: #13A79E !important;
}
.fi-sidebar-item-icon { color: #9ca3af !important; }
.fi-sidebar-item.fi-active .fi-sidebar-item-button {
    background-color: #e0f7f5 !important;
    color: #13A79E !important;
    font-weight: 600 !important;
    position: relative !important;
}
.fi-sidebar-item.fi-active .fi-sidebar-item-button::before {
    content: '' !important;
    position: absolute !important;
    left: -8px !important;
    top: 4px !important;
    bottom: 4px !important;
    width: 3px !important;
    background-color: #13A79E !important;
    border-radius: 0 3px 3px 0 !important;
}
.fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: #13A79E !important; }
.fi-sidebar-item.fi-active .fi-sidebar-item-label { color: #13A79E !important; }
.fi-sidebar-group-label {
    color: #9ca3af !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.65rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    padding-top: 8px !important;
    padding-bottom: 4px !important;
}
.fi-sidebar-group-collapse-button { display: none !important; }

/* ═══════════════════════════════════════
   TOPBAR + MAIN
═══════════════════════════════════════ */
.fi-topbar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #b2ece7 !important;
    box-shadow: 0 1px 3px rgba(19,167,158,0.08) !important;
}
.fi-main-ctn, .fi-main { background-color: #f8fffe !important; }

/* ═══════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════ */
.fi-header-heading {
    font-family: 'Sora', sans-serif !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
}
.fi-header-subheading {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.875rem !important;
    color: #6b7280 !important;
    margin-top: 2px !important;
}

/* ═══════════════════════════════════════
   BUTTONS
═══════════════════════════════════════ */
.fi-btn-color-warning {
    background-color: #FBAF40 !important;
    color: #ffffff !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 10px !important;
    padding: 10px 20px !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(251,175,64,0.3) !important;
}
.fi-btn-color-warning:hover {
    background-color: #f0a030 !important;
    box-shadow: 0 4px 12px rgba(251,175,64,0.4) !important;
}

/* ═══════════════════════════════════════
   STAT CARDS
═══════════════════════════════════════ */
.fi-wi-stats-overview-stat {
    border-radius: 12px !important;
    border: 1px solid #e5f7f6 !important;
    background: #ffffff !important;
    position: relative !important;
    overflow: hidden !important;
    padding: 20px !important;
}
.fi-wi-stats-overview-stat::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important; left: 0 !important; right: 0 !important;
    height: 3px !important;
    background: #13A79E !important;
    border-radius: 12px 12px 0 0 !important;
}
.fi-wi-stats-overview-stat-label {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}
.fi-wi-stats-overview-stat-value {
    font-family: 'Sora', sans-serif !important;
    font-size: 2rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
    line-height: 1.2 !important;
}
.fi-wi-stats-overview-stat-description {
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.75rem !important;
}

/* ═══════════════════════════════════════
   QUICK ACTIONS
═══════════════════════════════════════ */
.postly-quick-action {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 20px 12px !important;
    border: 1.5px dashed #b2ece7 !important;
    border-radius: 12px !important;
    color: #374151 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-size: 0.875rem !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: all 0.15s !important;
    background: #ffffff !important;
    cursor: pointer !important;
}
.postly-quick-action:hover {
    border-color: #13A79E !important;
    background: #f0fdfb !important;
    color: #13A79E !important;
}
.postly-quick-icon {
    width: 40px !important;
    height: 40px !important;
    border-radius: 10px !important;
    background: #f0fdfb !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #13A79E !important;
}

/* ═══════════════════════════════════════
   DARK MODE
═══════════════════════════════════════ */
.dark .fi-sidebar,
.dark .fi-sidebar.fi-sidebar-open {
    background-color: #0f1f1e !important;
    border-right: 1px solid rgba(19,167,158,0.2) !important;
}
.dark .fi-sidebar-header {
    background-color: #0f1f1e !important;
    border-bottom: 1px solid rgba(19,167,158,0.2) !important;
}
.dark .fi-sidebar-item-button { color: rgba(255,255,255,0.65) !important; }
.dark .fi-sidebar-item-button:hover {
    background-color: rgba(19,167,158,0.15) !important;
    color: #ffffff !important;
}
.dark .fi-sidebar-item.fi-active .fi-sidebar-item-button {
    background-color: rgba(19,167,158,0.2) !important;
    color: #13A79E !important;
}
.dark .fi-main-ctn, .dark .fi-main { background-color: #0d1817 !important; }

/* ═══════════════════════════════════════
   AUTH PAGES — SPLIT SCREEN
═══════════════════════════════════════ */
.postly-auth-left {
    width: 50vw !important;
    min-width: 50vw !important;
    max-width: 50vw !important;
    min-height: 100vh !important;
    background: #0f1f1e !important;
    padding: 40px 44px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
    flex-shrink: 0 !important;
    order: -1 !important;
    overflow-y: auto !important;
}

/* Auth form labels and inputs - fix white on white */
.fi-simple-page .fi-fo-field-wrp label,
.fi-simple-page .fi-fo-field-wrp .fi-fo-field-wrp-label,
.fi-simple-page label,
.fi-simple-page .block.font-medium,
.fi-simple-page .text-sm,
.fi-simple-page p,
.fi-simple-page span {
    color: #111827 !important;
}
.fi-simple-page .fi-simple-header h1,
.fi-simple-page .fi-simple-header .fi-heading {
    font-family: 'Sora', sans-serif !important;
    font-size: 1.6rem !important;
    font-weight: 700 !important;
    color: #111827 !important;
}
.fi-simple-page .fi-simple-header p,
.fi-simple-page .fi-simple-header .text-sm {
    color: #6b7280 !important;
}
.fi-simple-page input,
.fi-simple-page .fi-input {
    color: #111827 !important;
    background: #ffffff !important;
    border-color: #d1d5db !important;
}
.fi-simple-page .fi-input:focus {
    border-color: #13A79E !important;
    box-shadow: 0 0 0 2px rgba(19,167,158,0.2) !important;
}
.fi-simple-page .fi-btn-primary,
.fi-simple-page button[type="submit"] {
    background-color: #13A79E !important;
    border-radius: 10px !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    font-weight: 600 !important;
    color: #ffffff !important;
}
.fi-simple-page a {
    color: #13A79E !important;
}

/* Hide sidebar on auth pages */
body.fi-simple-layout .fi-sidebar,
body.fi-simple-layout .fi-sidebar-close-overlay,
body.fi-simple-layout .fi-topbar {
    display: none !important;
}

/* Auth no scroll */
body.fi-simple-layout {
    overflow: hidden !important;
    height: 100vh !important;
}

@media (max-width: 768px) {
    .postly-auth-left {
        width: 100vw !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
        min-height: auto !important;
    }
}

/* Mobile auth fix */
@media (max-width: 768px) {
    .fi-simple-page label,
    .fi-simple-page .block,
    .fi-simple-page p,
    .fi-simple-page span:not(.fi-badge),
    .fi-simple-page h1 {
        color: #111827 !important;
    }
}