/* ISEC Dark Theme Variables (Penguin Palette — orange-forward) */
.isec-dark {
    /* Primary brand colors (orange-forward for dark mode) */
    --primary: #f68922;                           /* Orange Bill */
    --primary-foreground: #ffffff;                /* White */

    /* Dark background colors */
    --background: #0b1526;                        /* Darkened Ice Blue */
    --foreground: #f8fafc;                        /* Clean light text */

    /* Card and surface colors */
    --card: #0f1f37;                              /* Darkened Ice Blue */
    --card-foreground: #f8fafc;

    /* Popover colors */
    --popover: #0f1f37;
    --popover-foreground: #f8fafc;

    /* Secondary (cool counterpoint to orange) */
    --secondary: #4980c2;                         /* Ocean Blue */
    --secondary-foreground: #ffffff;

    /* Muted */
    --muted: #132a4d;                             /* Darkened Ice Blue */
    --muted-foreground: #6da9db;                  /* Glacier Blue */

    /* Accent (warm highlight) */
    --accent: #e96a52;                            /* Pastel - Penguin */
    --accent-foreground: #19305a;                 /* Ice Blue */

    /* Destructive */
    --destructive: #d52628;                       /* Polar Ember */
    --destructive-foreground: #ffffff;

    /* Border and input */
    --border: #1f3e6f;
    --input: #1f3e6f;

    /* Focus ring */
    --ring: #f68922;                              /* Orange Bill */

    /* Charts */
    --chart-1: #f68922;                           /* Orange Bill */
    --chart-2: #6da9db;                           /* Glacier Blue */
    --chart-3: #4980c2;                           /* Ocean Blue */
    --chart-4: #984b8f;                           /* Emperor’s Majesty */
    --chart-5: #007c8f;                           /* Deep Ice Teal */
}

/* Sidebar Menu Item Styling - Remove background on selected items, keep only orange text */
.isec-dark .kt-menu-item.active .kt-menu-link {
    background: transparent !important;
    color: var(--primary) !important;             /* Orange text for sidebar */
    border-color: var(--primary) !important;      /* Orange border */
}

.isec-dark .kt-menu-item.active .kt-menu-link:hover {
    background: transparent !important;
    color: var(--primary) !important;             /* Keep orange text on hover */
    border-color: var(--primary) !important;      /* Keep orange border */
}

/* Navbar Item Styling - Keep text white with orange underline for selected items */
.isec-dark .kt-menu-item.active .kt-menu-title {
    color: var(--foreground) !important;          /* Keep text white, override text-mono */
}

.isec-dark .kt-menu-item.active {
    border-bottom-color: var(--primary) !important; /* Orange underline instead of border-b-mono */
}

.isec-dark .kt-menu-link:hover .kt-menu-title {
    color: var(--foreground) !important;          /* Keep text white on hover, override text-mono */
}

/* Dropdown/Select Item Styling - Only highlight text in orange, no background */
.isec-dark .kt-select-option.active,
.isec-dark .kt-select-option[aria-selected="true"],
.isec-dark [data-kt-select-dropdown] .option.active,
.isec-dark [data-kt-select-dropdown] .option[aria-selected="true"] {
    background: transparent !important;           /* No background */
    color: var(--primary) !important;             /* Orange text only */
}

.isec-dark .kt-select-option:hover,
.isec-dark [data-kt-select-dropdown] .option:hover {
    background: rgba(246, 137, 34, 0.1) !important; /* Subtle orange tint on hover */
    color: var(--primary) !important;             /* Orange text */
}

/* Modal Title Styling - Use orange in dark theme */
.isec-dark .kt-modal-title {
    color: #f68922 !important;                    /* Orange Bill */
}

/* Section Headers in Modals - Use orange in dark theme */
.isec-dark .kt-section-header {
    color: #f68922 !important;                    /* Orange Bill */
}

/* Fix text-mono class to use light text instead of black in dark theme */
.isec-dark .text-mono {
    color: var(--foreground) !important;          /* Light text for dark theme */
}

/* Ensure text-lg font-medium text-mono combinations are visible */
.isec-dark .text-lg.font-medium.text-mono,
.isec-dark .text-lg.text-mono {
    color: var(--foreground) !important;          /* Light text for dark theme */
}