/* ================================================================
   filament-pescar-theme.css  — v2
   Dau la Peste · Filament 3 Pescar panel
   Dark forest-to-water theme. Selectors verified against
   real Filament 3 blade output.
   ================================================================ */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

/* ── Variables ────────────────────────────────────────────── */
:root {
    --fp-darkest:     #061510;
    --fp-dark:        #0f2218;
    --fp-mid:         #1a3a2a;
    --fp-light:       #2d5a3d;
    --fp-bright:      #4a7c5e;
    --fp-green-400:   #4ade80;
    --fp-green-500:   #22c55e;
    --fp-teal-500:    #14b8a6;
    --fp-water-dark:  #0d3a52;
    --fp-water-mid:   #1a5a7a;
    --fp-amber:       #f59e0b;
    --fp-text-light:  #e2f4e8;
    --fp-text-muted:  rgba(180,230,200,0.65);
}

/* ── Base / page container backgrounds ───────────────────── */
html,
.fi-body,
.fi-page,
.fi-page-main,
.fi-page-content,
.fi-page-header-main-ctn {
    background: transparent !important;
}

.fi-body {
    font-family: 'Inter', sans-serif !important;
}

/* ================================================================
   SIDEBAR
   ================================================================ */

/* Make sidebar stretch to match content height instead of fixed viewport height */
.fi-layout {
    display: flex !important;
    align-items: stretch !important;
    min-height: 100vh !important;
}

.fi-sidebar {
    height: auto !important;
    min-height: 100% !important;
    align-self: stretch !important;
    background: linear-gradient(
        175deg,
        #061510 0%,
        #0f2218 25%,
        #1a3a2a 60%,
        #0d3a52 85%,
        #081e2e 100%
    ) !important;
    border-right: 1px solid rgba(74,222,128,0.12) !important;
}

.fi-sidebar.fi-sidebar-open {
    box-shadow: 4px 0 24px rgba(0,0,0,0.4) !important;
}

.fi-sidebar::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 120% 40% at 50% 0%, rgba(74,222,128,0.06) 0%, transparent 60%),
        radial-gradient(ellipse 80% 30% at 50% 100%, rgba(13,58,82,0.5) 0%, transparent 70%);
    pointer-events: none;
    z-index: 0;
}

.fi-sidebar > * {
    position: relative;
    z-index: 1;
}

/* ── Sidebar header (brand) — hidden, topbar has logo ─────── */
.fi-sidebar-header-ctn {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    min-height: 0 !important;
}

.fi-sidebar-header {
    display: none !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    min-height: 0 !important;
}

.fi-logo {
    color: var(--fp-text-light) !important;
    font-weight: 900 !important;
    font-size: 1.05rem !important;
    letter-spacing: -0.2px !important;
    text-shadow: 0 1px 8px rgba(74,222,128,0.25) !important;
}

/* ── Group label ──────────────────────────────────────────── */
.fi-sidebar-group-label {
    color: rgba(180,230,200,0.35) !important;
    font-size: 0.6rem !important;
    font-weight: 700 !important;
    letter-spacing: 1.8px !important;
    text-transform: uppercase !important;
}

/* ── Nav items ────────────────────────────────────────────── */
.fi-sidebar-item-button {
    color: var(--fp-text-muted) !important;
    border-radius: 0.6rem !important;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease !important;
    margin: 1px 0 !important;
}

.fi-sidebar-item-button:hover {
    background: rgba(74,222,128,0.1) !important;
    color: var(--fp-green-400) !important;
    box-shadow: inset 0 0 0 1px rgba(74,222,128,0.18) !important;
}

.fi-sidebar-item-active .fi-sidebar-item-button,
.fi-sidebar-item-button[aria-current="page"],
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn:where(.dark, .dark *) {
    background: linear-gradient(90deg, rgba(13,58,82,0.55) 0%, rgba(26,90,122,0.25) 100%) !important;
    color: var(--fp-text-light) !important;
    box-shadow: inset 3px 0 0 var(--fp-teal-500), inset 0 0 0 1px rgba(20,184,166,0.2) !important;
}

.fi-sidebar-item-active .fi-sidebar-item-button:hover,
.fi-sidebar-item-button[aria-current="page"]:hover,
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn:hover {
    background: linear-gradient(90deg, rgba(13,58,82,0.8) 0%, rgba(26,90,122,0.5) 100%) !important;
    box-shadow: inset 3px 0 0 var(--fp-teal-500), inset 0 0 0 1px rgba(20,184,166,0.4) !important;
}

.fi-sidebar-item-icon {
    color: inherit !important;
    opacity: 0.85;
}

.fi-sidebar-item-active .fi-sidebar-item-icon {
    opacity: 1;
    filter: drop-shadow(0 0 4px rgba(74,222,128,0.5));
}

/* ================================================================
   TOPBAR
   ================================================================ */

.fi-topbar {
    background: linear-gradient(90deg, #0f2218 0%, #1a3a2a 100%) !important;
    border-bottom: 1px solid rgba(74,222,128,0.12) !important;
    box-shadow: 0 2px 20px rgba(0,0,0,0.35) !important;
    overflow: visible !important;
}

/* User menu dropdown — nu tăia conținutul */
.fi-topbar nav,
.fi-topbar > div {
    background: transparent !important;
    overflow: visible !important;
}

/* Dropdown user menu — fix soare care iese din container */
[data-tippy-content] .fi-color-scheme-switcher-btn,
.tippy-box,
.tippy-content {
    overflow: hidden !important;
}

[data-tippy-root] {
    overflow: visible !important;
}

/* Limitează iconița soare/lună din selectorul de temă */
.fi-color-scheme-switcher .fi-icon-btn svg,
.fi-color-scheme-switcher button svg,
[wire\:key*="color"] svg,
[x-data*="colorScheme"] svg {
    max-width: 1.25rem !important;
    max-height: 1.25rem !important;
    overflow: hidden !important;
}

.fi-topbar button svg,
.fi-topbar a svg {
    color: var(--fp-text-muted) !important;
}

.fi-topbar button:hover svg,
.fi-topbar a:hover svg {
    color: var(--fp-green-400) !important;
}

/* ================================================================
   MAIN CONTENT
   ================================================================ */

.fi-main,
.fi-main-ctn {
    background: linear-gradient(
        160deg,
        #0a1c12 0%,
        #0f2218 40%,
        #0d1e2e 100%
    ) !important;
    min-height: 100vh;
    width: 100% !important;
    max-width: 100% !important;
}

/* Force full width for page content and widgets */
.fi-page-main,
.fi-page-content,
.fi-wi,
.fi-wi-grid,
.fi-wi-chart,
.fi-ta-ctn,
.fi-ta-table-ctn,
.fi-ta-table,
.fi-wi-table {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure table widget spans full width immediately */
.fi-wi[class*="full"] {
    grid-column: 1 / -1 !important;
}

/* Force chart canvases and their containers to respect full width */
.fi-wi canvas,
.fi-wi canvas[role="img"],
.fi-wi div:has(> canvas) {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
}

/* Remove borders from stats overview container */
.fi-wi-stats-overview,
.fi-wi-stats-overview .fi-section,
.fi-wi-stats-overview .fi-section-content-ctn {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* ================================================================
   PAGE HEADER
   ================================================================ */

.fi-header {
    border-bottom: 1px solid rgba(74,222,128,0.1) !important;
    backdrop-filter: blur(8px) !important;
}

.fi-header-heading {
    color: var(--fp-text-light) !important;
    font-weight: 800 !important;
    letter-spacing: -0.3px !important;
}

.fi-header-subheading {
    color: var(--fp-text-muted) !important;
}

/* ================================================================
   BUTTONS
   ================================================================ */

.fi-btn-color-primary.fi-btn {
    background: linear-gradient(135deg, var(--fp-green-500) 0%, var(--fp-teal-500) 100%) !important;
    border-color: transparent !important;
    color: #fff !important;
    font-weight: 700 !important;
    box-shadow: 0 2px 12px rgba(34,197,94,0.3), 0 1px 3px rgba(0,0,0,0.1) !important;
    transition: filter 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
}

.fi-btn-color-primary.fi-btn:hover {
    filter: brightness(1.08) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 20px rgba(34,197,94,0.4), 0 2px 6px rgba(0,0,0,0.12) !important;
}

.fi-btn-color-primary.fi-btn:active {
    transform: translateY(0) !important;
}

/* Ensure all buttons appear above decorative elements */
.fi-btn {
    position: relative !important;
    z-index: 5 !important;
}

/* ================================================================
   FORM INPUTS
   ================================================================ */

.fi-input:focus,
.fi-input-wrp:focus-within {
    border-color: var(--fp-green-500) !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,0.16) !important;
    outline: none !important;
}

/* ================================================================
   FORM SECTIONS (cards)
   ================================================================ */

/* ── Tabs ─────────────────────────────────────────────────── */
.fi-tabs,
.fi-tabs-ctn,
.fi-tabs.fi-contained,
.fi-tabs > div,
.fi-sc-tabs,
.fi-sc-tabs.fi-contained,
.fi-sc-tabs.fi-contained:where(.dark, .dark *) {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.fi-section {
    background: rgba(15,34,24,0.75) !important;
    border: 1px solid rgba(74,222,128,0.12) !important;
    border-radius: 0.875rem !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.3), 0 1px 6px rgba(0,0,0,0.2) !important;
    overflow: hidden !important;
    backdrop-filter: blur(6px) !important;
}

.fi-section-header {
    background: rgba(6,21,16,0.5) !important;
    border-bottom: 1px solid rgba(74,222,128,0.1) !important;
}

.fi-section-header-heading {
    color: var(--fp-text-light) !important;
    font-weight: 700 !important;
    font-size: 0.9rem !important;
}

/* Form field labels & text inside sections */
.fi-fo-field-wrp-label {
    color: rgba(180,230,200,0.8) !important;
}

.fi-fo-field-wrp-hint {
    color: var(--fp-text-muted) !important;
}

.fi-input,
.fi-select-input,
.fi-textarea {
    background: rgba(6,21,16,0.6) !important;
    border-color: rgba(74,222,128,0.18) !important;
    color: var(--fp-text-light) !important;
}

.fi-input::placeholder,
.fi-textarea::placeholder {
    color: rgba(180,230,200,0.25) !important;
}

/* ================================================================
   TABLE
   ================================================================ */

.fi-ta-ctn {
    background: rgba(15,34,24,0.75) !important;
    border: 1px solid rgba(74,222,128,0.12) !important;
    border-radius: 0.875rem !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
}

.fi-ta-table {
    width: 100% !important;
    max-width: 100% !important;
    table-layout: auto !important;
}

.fi-ta-header-cell {
    background: rgba(6,21,16,0.8) !important;
    color: var(--fp-text-light) !important;
    font-weight: 600 !important;
    font-size: 0.68rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.7px !important;
    border-bottom: 1px solid rgba(74,222,128,0.1) !important;
}

.fi-ta-row td {
    background: transparent !important;
    color: var(--fp-text-muted) !important;
     border-bottom: 1px solid rgba(74,222,128,0.06) !important;
}

.fi-ta-row:hover td {
    background: rgba(34,197,94,0.07) !important;
    color: var(--fp-text-light) !important;
}

/* ================================================================
   LOGIN PAGE  (.fi-simple-layout)
   ================================================================ */

.fi-simple-layout {
    position: relative;
    min-height: 100vh;
    background: linear-gradient(
        180deg,
        #061510 0%,
        #0f2218 28%,
        #1a3a2a 58%,
        #0d3a52 80%,
        #081e2e 100%
    ) !important;
    /* overflow: hidden removed — breaks sticky navbar and clips footer */
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

.fi-simple-layout::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 220px;
    background: linear-gradient(180deg, var(--fp-water-mid) 0%, #081e2e 100%);
    pointer-events: none;
    z-index: 0;
}

.fi-simple-main-ctn {
    flex: 1;
}

.fi-simple-main {
    position: relative;
    z-index: 10;
    background: transparent;
    min-height: 60vh;
}

/* Navbar inside simple layout */
.fi-simple-layout .site-nav {
    position: relative;
    top: auto;
    z-index: 50;
    flex-shrink: 0;
    width: 100%;
    max-width: 100vw;
}

/* ── Login card ───────────────────────────────────────────── */
.fi-simple-page {
    background: linear-gradient(
        160deg,
        #0f2218 0%,
        #1a3a2a 50%,
        #163325 100%
    ) !important;
    border: 1px solid rgba(74,222,128,0.2) !important;
    border-radius: 1.4rem !important;
    box-shadow:
        0 8px 40px rgba(0,0,0,0.45),
        0 0 0 1px rgba(74,222,128,0.08),
        inset 0 1px 0 rgba(255,255,255,0.08) !important;
    padding: 2.25rem 2rem !important;
    position: relative;
    overflow: hidden;
}

.fi-simple-page::before {
    content: '';
    position: absolute;
    top: 0;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(74,222,128,0.55), transparent);
    pointer-events: none;
}

.fi-simple-header-heading {
    color: #ffffff !important;
    font-weight: 800 !important;
    font-size: 1.4rem !important;
    letter-spacing: -0.3px !important;
}

.fi-simple-header-subheading {
    color: rgba(180,230,200,0.65) !important;
    font-size: .88rem !important;
}

.fi-simple-page .fi-fo-field-wrp-label {
    color: rgba(200,240,215,0.75) !important;
    font-weight: 500 !important;
    font-size: 0.82rem !important;
}

.fi-simple-page .fi-input {
    background: rgba(0,0,0,0.25) !important;
    border: 1.5px solid rgba(74,222,128,0.2) !important;
    color: #dcfce7 !important;
    border-radius: .6rem !important;
}

.fi-simple-page .fi-input::placeholder {
    color: rgba(180,230,200,0.45) !important;
}

.fi-simple-page .fi-input:focus,
.fi-simple-page .fi-input:active,
.fi-simple-page .fi-input-wrp:focus-within .fi-input {
    background: rgba(0,0,0,0.35) !important;
    border-color: #22c55e !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,0.2) !important;
    color: #dcfce7 !important;
}

/* Stars on login */
.fp-star {
    position: fixed;
    background: #fff;
    border-radius: 50%;
    pointer-events: none;
    z-index: 1;
    animation: fp-twinkle ease-in-out infinite;
}

@keyframes fp-twinkle {
    0%, 100% { opacity: 0.12; transform: scale(1);   }
    50%       { opacity: 0.9;  transform: scale(1.6); }
}

/* Moon on login */
.fp-login-moon {
    position: fixed;
    top: 10%;
    right: 15%;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: radial-gradient(circle at 33% 33%, #fff8c0, #f0d060);
    box-shadow:
        0 0 0 2px rgba(240,210,80,0.15),
        0 0 30px 10px rgba(240,210,80,0.22),
        0 0 70px 28px rgba(240,210,80,0.09);
    animation: fp-moon-glow 5s ease-in-out infinite;
    pointer-events: none;
}

@keyframes fp-moon-glow {
    0%, 100% { box-shadow: 0 0 0 2px rgba(240,210,80,0.15), 0 0 30px 10px rgba(240,210,80,0.22), 0 0 70px 28px rgba(240,210,80,0.09); }
    50%       { box-shadow: 0 0 0 3px rgba(240,210,80,0.22), 0 0 50px 18px rgba(240,210,80,0.35), 0 0 100px 40px rgba(240,210,80,0.12); }
}

/* ================================================================
   SIDEBAR FOOTER — REEDS + WAVES + FISH
   ================================================================ */

.fp-reeds {
    display: flex;
    align-items: flex-end;
    justify-content: space-around;
    padding: 0 0.5rem;
    pointer-events: none;
    user-select: none;
    position: relative;
    z-index: 2;
}

.fp-reed {
    width: 3px;
    border-radius: 3px 3px 0 0;
    background: linear-gradient(180deg, rgba(74,222,128,0.8) 0%, rgba(34,197,94,0.25) 100%);
    transform-origin: bottom center;
    animation: fp-sway ease-in-out infinite;
    position: relative;
}

.fp-reed::before {
    content: '';
    position: absolute;
    top: -15px;
    left: -4px;
    width: 10px;
    height: 16px;
    background: rgba(74,222,128,0.55);
    border-radius: 50% 50% 30% 30% / 65% 65% 35% 35%;
    transform-origin: bottom center;
}

@keyframes fp-sway {
    0%, 100% { transform: rotate(-5deg) skewX(-1deg); }
    50%       { transform: rotate(6deg)  skewX(1.2deg); }
}

.fp-waves {
    height: 42px;
    overflow: hidden;
    pointer-events: none;
    user-select: none;
    position: relative;
    z-index: 2;
    margin-top: -2px;
}

.fp-waves svg {
    width: 200%;
    height: 100%;
    animation: fp-wave-scroll 8s linear infinite;
}

@keyframes fp-wave-scroll {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}

.fp-fish {
    position: absolute;
    pointer-events: none;
    user-select: none;
    z-index: 3;
    animation: fp-swim linear infinite;
    filter: drop-shadow(0 1px 3px rgba(0,0,0,0.5));
}

@keyframes fp-swim {
    0%   { right: -10%; opacity: 0; }
    5%   { opacity: 0.7; }
    90%  { opacity: 0.7; }
    100% { right: 108%; opacity: 0; }
}

/* ================================================================
   MISC POLISH
   ================================================================ */

/* Stats overview cards */
.fi-wi-stats-overview-stat,
.fi-wi-stats-overview-stat:where(.dark, .dark *) {
    background-color: rgba(15,34,24,0.75) !important;
    --tw-ring-color: rgba(74,222,128,0.12) !important;
    border: 1px solid rgba(74,222,128,0.12) !important;
    border-radius: 0.875rem !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.3) !important;
    backdrop-filter: blur(6px) !important;
}

.fi-badge-color-primary {
    background: rgba(34,197,94,0.14) !important;
    color: #166534 !important;
    border-color: rgba(34,197,94,0.25) !important;
}

.fi-no-notification {
    border-radius: 0.875rem !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12) !important;
}

.fi-sidebar-nav {
    background: transparent !important;
    flex: 1 1 0 !important;
    overflow-y: auto !important;
    min-height: 0 !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
}

.fi-sidebar-nav::-webkit-scrollbar        { width: 3px; }
.fi-sidebar-nav::-webkit-scrollbar-track  { background: transparent; }
.fi-sidebar-nav::-webkit-scrollbar-thumb  { background: rgba(74,222,128,0.25); border-radius: 3px; }

/* ── Sidebar username badge ───────────────────────────────── */
.fp-sidebar-username {
    margin: 0.5rem 0.75rem 1rem;
    padding: 0.55rem 0.85rem;
    border-radius: 8px;
    background: rgba(74,222,128,0.07);
    border: 1px solid rgba(74,222,128,0.18);
    display: flex;
    align-items: center;
    gap: 0.25rem;
    min-width: 0;
}

.fp-sidebar-username__at {
    color: rgba(74,222,128,0.5);
    font-size: 0.75rem;
    font-weight: 700;
    flex-shrink: 0;
}

.fp-sidebar-username__name {
    color: rgba(180,230,200,0.9);
    font-size: 0.8rem;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.fp-sidebar-username--missing {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.2rem;
    border-color: rgba(245,158,11,0.25);
    background: rgba(245,158,11,0.05);
}

.fp-sidebar-username__cta {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    color: rgba(245,158,11,0.85);
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    transition: color 0.2s;
}

.fp-sidebar-username__cta:hover {
    color: rgba(245,158,11,1);
}

.fp-sidebar-username__hint {
    color: rgba(180,180,160,0.5);
    font-size: 0.65rem;
    margin: 0;
    line-height: 1.3;
}

/* Lake decoration — sticks to sidebar bottom */
.fp-sidebar-deco {
    flex-shrink: 0;
    position: relative;
    width: 100%;
    overflow: visible;
    z-index: 2;
    padding-top: 55px;
}

/* ================================================================
   THEME TOGGLE BUTTON - HIDDEN (Dark mode only)
   ================================================================ */

.fp-theme-toggle,
.fi-color-scheme-switcher,
[data-tippy-content*="color"],
[wire\:key*="color"],
[x-data*="colorScheme"] {
    display: none !important;
}

.fp-theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid rgba(74,222,128,0.3);
    background: rgba(74,222,128,0.1);
    color: var(--fp-green-400);
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s, transform 0.2s, color 0.2s;
    flex-shrink: 0;
}

.fp-theme-toggle:hover {
    background: rgba(74,222,128,0.2);
    border-color: rgba(74,222,128,0.55);
    transform: scale(1.1);
}

html[data-fp-theme="light"] .fp-theme-toggle {
    border-color: rgba(26,58,42,0.3);
    background: rgba(26,58,42,0.08);
    color: #1a3a2a;
}

html[data-fp-theme="light"] .fp-theme-toggle:hover {
    background: rgba(26,58,42,0.15);
    border-color: rgba(26,58,42,0.5);
}

/* ================================================================
   LIGHT THEME  —  html[data-fp-theme="light"]
   ================================================================ */

/* ── Sidebar ──────────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-sidebar {
    background: linear-gradient(
        175deg,
        #e8f5ec 0%,
        #d4edd9 25%,
        #c2e4ca 60%,
        #b8ddd4 85%,
        #c8e8f0 100%
    ) !important;
    border-right: 1px solid rgba(26,58,42,0.15) !important;
    box-shadow: 4px 0 24px rgba(0,0,0,0.08) !important;
}

html[data-fp-theme="light"] .fi-sidebar::before {
    background:
        radial-gradient(ellipse 120% 40% at 50% 0%, rgba(34,197,94,0.1) 0%, transparent 60%),
        radial-gradient(ellipse 80% 30% at 50% 100%, rgba(20,184,166,0.12) 0%, transparent 70%) !important;
}

html[data-fp-theme="light"] .fi-sidebar-header {
    background: rgba(255,255,255,0.65) !important;
    border-bottom: 1px solid rgba(26,58,42,0.12) !important;
}

html[data-fp-theme="light"] .fi-logo {
    color: #0f2218 !important;
    text-shadow: none !important;
}

html[data-fp-theme="light"] .fi-sidebar-group-label {
    color: rgba(26,58,42,0.45) !important;
}

html[data-fp-theme="light"] .fi-sidebar-item-button {
    color: #2d5a3d !important;
}

html[data-fp-theme="light"] .fi-sidebar-item-button:hover {
    background: rgba(34,197,94,0.12) !important;
    color: #166534 !important;
    box-shadow: inset 0 0 0 1px rgba(34,197,94,0.25) !important;
}

html[data-fp-theme="light"] .fi-sidebar-item-active .fi-sidebar-item-button,
html[data-fp-theme="light"] .fi-sidebar-item-button[aria-current="page"] {
    background: linear-gradient(90deg, rgba(34,197,94,0.2) 0%, rgba(34,197,94,0.08) 100%) !important;
    color: #166534 !important;
    box-shadow: inset 3px 0 0 var(--fp-green-500), inset 0 0 0 1px rgba(34,197,94,0.2) !important;
}

html[data-fp-theme="light"] .fi-sidebar-nav::-webkit-scrollbar-thumb {
    background: rgba(26,58,42,0.2);
}

/* ── Topbar ───────────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-topbar {
    background: #ffffff !important;
    border-bottom: 1px solid rgba(26,58,42,0.1) !important;
    box-shadow: 0 1px 8px rgba(0,0,0,0.07) !important;
}

html[data-fp-theme="light"] .fi-topbar nav,
html[data-fp-theme="light"] .fi-topbar > div {
    background: transparent !important;
}

html[data-fp-theme="light"] .fi-topbar button svg,
html[data-fp-theme="light"] .fi-topbar a svg {
    color: #4b7a5e !important;
}

html[data-fp-theme="light"] .fi-topbar button:hover svg,
html[data-fp-theme="light"] .fi-topbar a:hover svg {
    color: var(--fp-green-500) !important;
}

/* ── Main content ─────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-main,
html[data-fp-theme="light"] .fi-main-ctn {
    background: #f2f8f4 !important;
}

/* ── Page header ──────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-header {
    background: #ffffff !important;
    border-bottom: 1px solid rgba(26,58,42,0.08) !important;
    backdrop-filter: none !important;
}

html[data-fp-theme="light"] .fi-header-heading {
    color: #0f2218 !important;
}

html[data-fp-theme="light"] .fi-header-subheading {
    color: #4b7a5e !important;
}

/* ── Sections / cards ─────────────────────────────────────── */
html[data-fp-theme="light"] .fi-section {
    background: #ffffff !important;
    border: 1px solid rgba(26,58,42,0.1) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.05), 0 4px 16px rgba(0,0,0,0.04) !important;
    backdrop-filter: none !important;
}

html[data-fp-theme="light"] .fi-section-header {
    background: linear-gradient(90deg, rgba(34,197,94,0.05), rgba(34,197,94,0.01)) !important;
    border-bottom: 1px solid rgba(26,58,42,0.08) !important;
}

html[data-fp-theme="light"] .fi-section-header-heading {
    color: #0f2218 !important;
}

/* ── Form fields ──────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-fo-field-wrp-label {
    color: #2d5a3d !important;
}

html[data-fp-theme="light"] .fi-fo-field-wrp-hint {
    color: #4b7a5e !important;
}

html[data-fp-theme="light"] .fi-input,
html[data-fp-theme="light"] .fi-select-input,
html[data-fp-theme="light"] .fi-textarea {
    background: #ffffff !important;
    border-color: rgba(26,58,42,0.2) !important;
    color: #0f2218 !important;
}

html[data-fp-theme="light"] .fi-input::placeholder,
html[data-fp-theme="light"] .fi-textarea::placeholder {
    color: rgba(26,58,42,0.3) !important;
}

html[data-fp-theme="light"] .fi-input:focus,
html[data-fp-theme="light"] .fi-input-wrp:focus-within {
    border-color: var(--fp-green-500) !important;
    box-shadow: 0 0 0 3px rgba(34,197,94,0.14) !important;
}

/* ── Table ────────────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-ta-ctn {
    background: #ffffff !important;
    border: 1px solid rgba(26,58,42,0.1) !important;
}

html[data-fp-theme="light"] .fi-ta-header-cell {
    background: #f0f7f2 !important;
    color: #0f2218 !important;
    border-bottom: 1px solid rgba(26,58,42,0.1) !important;
}

html[data-fp-theme="light"] .fi-ta-row td {
    color: #2d5a3d !important;
    border-bottom: 1px solid rgba(26,58,42,0.06) !important;
}

html[data-fp-theme="light"] .fi-ta-row:hover td {
    background: rgba(34,197,94,0.05) !important;
    color: #0f2218 !important;
}

/* ── Badges ───────────────────────────────────────────────── */
html[data-fp-theme="light"] .fi-badge-color-primary {
    background: rgba(34,197,94,0.1) !important;
    color: #166534 !important;
    border-color: rgba(34,197,94,0.3) !important;
}

/* ── Dropdown panel override ──────────────────────────────── */

/* Fiecare secțiune devine propriul stacking context */
.fi-section {
    position: relative;
    z-index: 0;
}

/* Secțiunea cu dropdown deschis urcă peste vecinele ei */
.fi-section:has(.fi-dropdown-panel[style*="display: block"]),
.fi-section:has(.fi-dropdown-trigger[aria-expanded="true"]) {
    z-index: 50;
}

.fi-dropdown-panel {
    z-index: 9999 !important;
    min-width: 18rem !important;
    max-width: 24rem;
    background-color: var(--fp-dark) !important;
    border: 1px solid rgba(74, 124, 94, 0.3) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5) !important;
}

.fi-dropdown-panel:where(.dark, .dark *) {
    background-color: var(--fp-dark) !important;
    --tw-ring-color: rgba(74, 124, 94, 0.2) !important;
}

/* ================================================================
   SITE FOOTER (auth pages — no Tailwind CDN available)
   ================================================================ */

footer.site-footer {
    background: #111827;
    color: #9ca3af;
    margin-top: 0;
    position: relative;
    z-index: 20;
    flex-shrink: 0;
    width: 100%;
}

footer.site-footer .footer-grid {
    max-width: 80rem;
    margin: 0 auto;
    padding: 3rem 1rem;
    display: grid;
    grid-template-columns: 1fr;
    gap: 2rem;
}

@media (min-width: 768px) {
    footer.site-footer .footer-grid {
        grid-template-columns: 2fr 1fr 1fr;
    }
}

footer.site-footer .footer-brand {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

footer.site-footer .footer-brand-name {
    font-weight: 700;
    font-size: 1.25rem;
    color: #fff;
}

footer.site-footer .footer-brand svg {
    width: 1.5rem;
    height: 1.5rem;
}

footer.site-footer .footer-desc {
    font-size: 0.875rem;
    line-height: 1.6;
}

footer.site-footer h4 {
    color: #fff;
    font-weight: 600;
    margin-bottom: 0.75rem;
    font-size: 1rem;
}

footer.site-footer ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

footer.site-footer ul a {
    color: #9ca3af;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s;
}

footer.site-footer ul a:hover {
    color: #fff;
}

footer.site-footer .footer-bottom {
    border-top: 1px solid #1f2937;
    text-align: center;
    padding: 1rem 0;
    font-size: 0.75rem;
}

footer.site-footer .footer-bottom a {
    color: #9ca3af;
    text-decoration: none;
    transition: color 0.2s;
}

footer.site-footer .footer-bottom a:hover {
    color: #fff;
}

/* ================================================================
   RESPONSIVE  —  Tablet & Mobile
   ================================================================ */

/* ── Tablet: sidebar collapses to drawer (< 1024px) ──────── */
@media (max-width: 1023px) {
    /* Main content takes full width */
    .fi-main-ctn {
        padding-left: 0 !important;
    }

    /* Content area: slightly reduced horizontal padding */
    .fi-page-content {
        padding-left: 1.25rem !important;
        padding-right: 1.25rem !important;
    }

    /* Sidebar close overlay — only style, let Filament toggle visibility */
    .fi-sidebar-close-overlay {
        background: rgba(0, 0, 0, 0.6) !important;
        z-index: 29 !important;
    }

    /* Sidebar on mobile — full height, scrollable, above overlay */
    .fi-sidebar {
        z-index: 30 !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    .fi-sidebar .fi-sidebar-nav {
        flex: 1 1 auto !important;
        min-height: 0 !important;
        overflow-y: auto !important;
    }

    /* Theme toggle: slightly smaller */
    .fp-theme-toggle {
        width: 30px !important;
        height: 30px !important;
    }

    /* Stats cards: allow 2 per row on tablet */
    .fi-wi-stats-overview {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

/* ── Mobile: small screens (< 768px) ─────────────────────── */
@media (max-width: 767px) {
    /* Tight page padding */
    .fi-page-content {
        padding-left: 0.6rem !important;
        padding-right: 0.6rem !important;
        padding-top: 0.75rem !important;
        padding-bottom: 1.5rem !important;
    }

    /* Section card inner padding */
    .fi-section-content-ctn {
        padding: 0.75rem !important;
    }

    .fi-section-header {
        padding: 0.6rem 0.75rem !important;
    }

    .fi-section-header-heading {
        font-size: 0.82rem !important;
    }

    /* Page header — stack heading and actions vertically */
    .fi-header {
        padding: 0.6rem 0.75rem !important;
    }

    .fi-page-header-main-ctn {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 0.5rem !important;
    }

    .fi-header-actions {
        width: 100% !important;
        flex-wrap: wrap !important;
        gap: 0.4rem !important;
    }

    .fi-header-actions .fi-btn {
        flex: 1 1 auto !important;
        justify-content: center !important;
        min-width: 8rem !important;
        font-size: 0.78rem !important;
        padding-left: 0.75rem !important;
        padding-right: 0.75rem !important;
    }

    /* Topbar: compact */
    .fi-topbar {
        padding-left: 0.5rem !important;
        padding-right: 0.5rem !important;
    }

    /* Theme toggle: compact */
    .fp-theme-toggle {
        width: 28px !important;
        height: 28px !important;
        flex-shrink: 0 !important;
    }

    /* Tables: ensure horizontal scroll works */
    .fi-ta-ctn {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
    }

    /* Table row/cell padding: compact */
    .fi-ta-header-cell {
        padding: 0.45rem 0.5rem !important;
        font-size: 0.6rem !important;
        white-space: nowrap !important;
    }

    .fi-ta-row td {
        padding: 0.45rem 0.5rem !important;
        font-size: 0.8rem !important;
    }

    /* Table toolbar (search, filters): wrap */
    .fi-ta-header {
        flex-wrap: wrap !important;
        gap: 0.4rem !important;
        padding: 0.6rem !important;
    }

    .fi-ta-search-field {
        width: 100% !important;
        min-width: 0 !important;
    }

    /* Stats overview: single column on mobile */
    .fi-wi-stats-overview {
        grid-template-columns: 1fr !important;
    }

    .fi-wi-stats-overview-stat {
        min-width: 0 !important;
    }

    /* Widget wrapper padding */
    .fi-wi {
        padding: 0 !important;
    }

    /* Relation managers tabs: scrollable */
    .fi-tabs {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        flex-wrap: nowrap !important;
    }

    /* Sidebar username badge: compact */
    .fp-sidebar-username {
        margin: 0.35rem 0.5rem 0.6rem !important;
        padding: 0.4rem 0.6rem !important;
    }

    /* Sidebar lake decoration: hide in drawer to save space */
    .fp-sidebar-deco {
        display: none !important;
    }

    /* Form grid: force single column */
    .fi-fo-grid {
        grid-template-columns: 1fr !important;
    }

    /* Repeater: compact */
    .fi-fo-repeater-item-content {
        padding: 0.6rem !important;
    }

    /* Lightbox close/prev/next buttons: larger tap targets */
    /* (these are inline-styled in the blade template, handled by parent class) */
}

/* ── Very small phones (< 400px) ─────────────────────────── */
@media (max-width: 399px) {
    .fi-page-content {
        padding-left: 0.4rem !important;
        padding-right: 0.4rem !important;
    }

    .fi-section-content-ctn {
        padding: 0.5rem !important;
    }

    .fi-ta-header-cell,
    .fi-ta-row td {
        padding: 0.35rem 0.4rem !important;
        font-size: 0.72rem !important;
    }
}

/* ── Auth pages responsive (< 768px) ─────────────────────── */
@media (max-width: 767px) {
    /* Card: reduce padding, full-width with small margin */
    .fi-simple-page {
        padding: 1.5rem 1.15rem !important;
        border-radius: 1rem !important;
        margin-left: 0.5rem !important;
        margin-right: 0.5rem !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Container: tighter horizontal padding */
    .fi-simple-main-ctn {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .fi-simple-main {
        padding-left: 0.25rem !important;
        padding-right: 0.25rem !important;
    }

    /* Heading: smaller on mobile */
    .fi-simple-header-heading {
        font-size: 1.15rem !important;
    }

    .fi-simple-header-subheading {
        font-size: 0.82rem !important;
    }

    /* Moon: smaller + repositioned so it doesn't overlap content */
    .fp-login-moon {
        width: 36px !important;
        height: 36px !important;
        top: 6% !important;
        right: 8% !important;
    }

    /* Stars: hide on mobile to reduce visual clutter */
    .fp-star {
        display: none !important;
    }

    /* Inputs: ensure they don't overflow */
    .fi-simple-page .fi-input {
        font-size: 16px !important; /* prevents iOS zoom on focus */
    }

    /* Auth action links (forgot password, register link) */
    .fi-simple-page .fi-link {
        font-size: 0.82rem !important;
    }
}

/* ── Auth pages responsive — very small phones (< 400px) ── */
@media (max-width: 399px) {
    .fi-simple-page {
        padding: 1.25rem 0.85rem !important;
        margin-left: 0.25rem !important;
        margin-right: 0.25rem !important;
        border-radius: 0.75rem !important;
    }

    .fi-simple-header-heading {
        font-size: 1.05rem !important;
    }

    /* Hide moon on very small screens */
    .fp-login-moon {
        display: none !important;
    }
}

/* ── Light theme responsive overrides ────────────────────── */
@media (max-width: 767px) {
    html[data-fp-theme="light"] .fi-page-content {
        padding-left: 0.6rem !important;
        padding-right: 0.6rem !important;
    }
}

/* ── Fix Select dropdown clipped by section overflow:hidden ── */
.fi-section,
.fi-section > .fi-section-content-ctn,
.fi-section > .fi-section-content-ctn > .fi-section-content {
    overflow: visible !important;
}

.fi-fo-select .fi-dropdown-panel,
.fi-input-wrp.fi-fo-select .fi-dropdown-panel {
    top: 100% !important;
    bottom: auto !important;
    inset-block-start: 100% !important;
    inset-block-end: auto !important;
    z-index: 9999 !important;
    min-width: 18rem !important;
    max-width: 24rem !important;
}

.fi-section-header {
    z-index: 1 !important;
}