/*
 Bootstrap 5 dark theme overrides + admin panel enhancements
 Color palette retained from existing theme:
   Background: #0a0a0f / #141414 / #181818 / #222
   Accent / Primary: #ff6666 (gradient to #bb4444)
   Text: #d0d0d0
*/

/* Maker's Mark (hidden alien) */
.hidden-alien-bg {
    position: fixed;
    bottom: 18px;
    left: 18px;
    width: 60px;
    height: 60px;
    opacity: 0.08; /* Very faint */
    pointer-events: none; /* Don't block clicks */
    z-index: 0; /* Behind everything */
    filter: grayscale(1) blur(0.5px);
    user-select: none;
    background: none;
    mix-blend-mode: lighten;
}

:root,
:root[data-bs-theme="dark"] {
    /* Core brand colors */
    --cdsy-accent: #ff6666;
    --cdsy-accent-alt: #bb4444;
    --cdsy-accent-rgb: 255, 102, 102;
    --cdsy-gradient: linear-gradient(90deg, #ff6666 0%, #bb4444 100%);
    --cdsy-focus-ring: 0 0 0 0.2rem rgba(255, 102, 102, 0.45);

    /* Bootstrap variable overrides */
    --bs-body-bg: #0a0a0f;
    --bs-body-color: #d0d0d0;

    --bs-primary: #ff6666;
    --bs-primary-rgb: 255, 102, 102;

    --bs-danger: #ff6666;
    --bs-danger-rgb: 255, 102, 102;

    --bs-secondary: #181818;
    --bs-secondary-rgb: 24, 24, 24;

    --bs-border-color: #262626;
    --bs-border-color-translucent: rgba(255, 255, 255, 0.08);

    --bs-card-bg: #141414;
    --bs-card-border-color: #1e1e1e;

    --bs-table-bg: transparent;
    --bs-table-color: #d0d0d0;

    --bs-link-color: #ff6666;
    --bs-link-hover-color: #ff7d7d;

    --bs-focus-ring-color: rgba(255, 102, 102, 0.35);
}

/* Smooth fade / elevation helpers */
.fade-in {
    opacity: 0;
    animation: adminFadeIn 0.5s ease forwards;
}
@keyframes adminFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: none;
    }
}

/* BODY LAYOUT ENHANCEMENTS */
body.admin-body {
    font-family:
        "Inter", "Segoe UI", "Roboto", "Helvetica Neue", Arial, sans-serif;
    font-size: 14.5px;
    line-height: 1.4;
    background: radial-gradient(circle at 20% 15%, #15151c 0%, #0a0a0f 70%)
        fixed;
    background-color: #0a0a0f;
    padding-bottom: 4rem;
}

/* HEADINGS CONSISTENCY */
body.admin-body h1.site-title,
body.admin-body h2,
body.admin-body h3,
body.admin-body h4 {
    letter-spacing: 0.5px;
    color: #eee;
    text-shadow: 0 0 4px rgba(255, 102, 102, 0.15);
}
body.admin-body h2.h5,
body.admin-body h2.h6 {
    text-shadow: none;
}

/* CARD THEME */
.admin-section-card.card {
    background: #141414;
    border: 1px solid #1f1f1f;
    box-shadow:
        0 4px 18px -6px rgba(0, 0, 0, 0.7),
        0 0 0 1px #101010;
    backdrop-filter: blur(2px);
    transition:
        border-color 0.18s ease,
        box-shadow 0.25s ease,
        transform 0.25s ease;
    border-radius: 10px;
}
.admin-section-card.card:hover {
    border-color: #292929;
    box-shadow:
        0 6px 26px -6px rgba(0, 0, 0, 0.85),
        0 0 0 1px #191919;
    transform: translateY(-2px);
}
.admin-section-card .card-header {
    background: #181818;
    border-bottom: 1px solid #222;
    padding: 0.65rem 0.95rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}
.admin-section-card .card-body {
    padding: 0.95rem 1rem 1.15rem;
}

/* SECTION SPACING */
/* (Removed old global min-height:100% equal-height enforcement so cards can shrink naturally) */

/* TABLES */
body.admin-body table.table {
    --bs-table-striped-bg: rgba(255, 255, 255, 0.03);
    --bs-table-hover-bg: rgba(255, 102, 102, 0.08);
    --bs-table-border-color: #242424;
    vertical-align: middle;
    margin-bottom: 0.35rem;
}
body.admin-body table.table thead th {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 600;
    border-bottom: 1px solid #262626 !important;
    color: #c3c3c3;
    white-space: nowrap;
}
body.admin-body table.table tbody tr {
    transition:
        background-color 0.18s ease,
        box-shadow 0.18s ease;
}
body.admin-body table.table tbody tr:focus-within {
    outline: 1px solid #ff666680;
    background: rgba(255, 102, 102, 0.07);
}
body.admin-body table.table tbody td {
    padding: 0.45rem 0.5rem;
    border-bottom: 1px solid #202020;
}

/* SCROLLBARS (WebKit) */
body.admin-body .table-responsive::-webkit-scrollbar {
    height: 10px;
}
body.admin-body .table-responsive::-webkit-scrollbar-track {
    background: #0f0f0f;
}
body.admin-body .table-responsive::-webkit-scrollbar-thumb {
    background: #252525;
    border-radius: 6px;
    border: 2px solid #0f0f0f;
}
body.admin-body .table-responsive::-webkit-scrollbar-thumb:hover {
    background: #303030;
}

/* FORM CONTROLS */
body.admin-body .form-control,
body.admin-body .form-select {
    background-color: #181818;
    border: 1px solid #262626;
    color: #e0e0e0;
    font-size: 0.8rem;
    padding: 0.35rem 0.5rem;
    line-height: 1.2;
    border-radius: 6px;
    transition:
        background-color 0.18s,
        border-color 0.18s,
        box-shadow 0.18s;
}
body.admin-body .form-control:focus,
body.admin-body .form-select:focus {
    background-color: #1d1d1d;
    border-color: #ff6666;
    box-shadow: var(--cdsy-focus-ring);
    color: #fff;
}
body.admin-body .form-control::placeholder {
    color: #777;
}
body.admin-body .form-control:disabled,
body.admin-body .form-select:disabled {
    background: #111;
    color: #666;
    border-color: #222;
    opacity: 0.8;
}

/* SPECIFIC WIDTH TUNING FOR TIGHT COLUMNS */
#stockTable input[name$="[quantity]"],
#stockTable input[name$="[price]"],
#addStockTable input[name$="[quantity]"] {
    max-width: 86px;
}
#addStockTable input[name$="[price]"] {
    max-width: 120px;
}
#addStockTable input[name$="[location]"] {
    min-width: 130px;
}

/* CHECKBOX ALIGNMENT */
body.admin-body .form-check-input {
    cursor: pointer;
    border: 1px solid #444;
    background: #181818;
    width: 16px;
    height: 16px;
    margin-top: 0;
}
body.admin-body .form-check-input:checked {
    background-color: #ff6666;
    border-color: #ff6666;
    box-shadow: 0 0 0 1px #222;
}
body.admin-body .form-check-input:focus {
    outline: none;
    box-shadow: var(--cdsy-focus-ring);
}

/* BUTTONS – Bootstrap style with red flair */
body.admin-body .btn {
    font-weight: 500;
    border-radius: 0.375rem;
    font-size: 0.8rem;
    padding: 0.5rem 0.9rem;
    line-height: 1.1;
    background-color: #1c1c1f;
    border: 1px solid #2f2f32;
    color: #e3e3e3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    transition:
        background-color 0.15s,
        color 0.15s,
        border-color 0.15s,
        box-shadow 0.15s;
}
body.admin-body .btn:hover {
    background-color: #27272b;
    border-color: #3a3a3e;
    color: #fff;
}
body.admin-body .btn:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 0.2rem rgba(255, 102, 102, 0.35);
}
body.admin-body .btn:active {
    background-color: #202023;
    transform: none;
    box-shadow: inset 0 0 0 0.05rem rgba(255, 255, 255, 0.05);
}

/* Brand / Primary (shared red) */
body.admin-body .btn-primary,
body.admin-body .btn-danger,
body.admin-body .btn-brand {
    --bs-btn-color: #fff;
    --bs-btn-bg: #ff5b5b;
    --bs-btn-border-color: #ff5151;
    --bs-btn-hover-bg: #ff6d6d;
    --bs-btn-hover-border-color: #ff5959;
    --bs-btn-active-bg: #e84d4d;
    --bs-btn-active-border-color: #d44141;
    --bs-btn-disabled-bg: #7a3c3c;
    --bs-btn-disabled-border-color: #7a3c3c;
    background: linear-gradient(180deg, #ff6a6a 0%, #ff5959 50%, #d64242 100%);
    border: 1px solid var(--bs-btn-border-color);
    color: #fff;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.4);
}
body.admin-body .btn-primary:hover,
body.admin-body .btn-danger:hover,
body.admin-body .btn-brand:hover {
    background: linear-gradient(180deg, #ff7878 0%, #ff6161 45%, #cc4242 100%);
    color: #fff;
}
body.admin-body .btn-primary:active,
body.admin-body .btn-danger:active,
body.admin-body .btn-brand:active {
    background: linear-gradient(180deg, #e84d4d 0%, #c63c3c 100%);
    border-color: #c63c3c;
}

/* Outline red */
body.admin-body .btn-outline-danger {
    color: #ff5b5b;
    border: 1px solid #ff5b5b;
    background: transparent;
}
body.admin-body .btn-outline-danger:hover {
    background: #ff5b5b;
    color: #fff;
    box-shadow: 0 0 0 0.15rem rgba(255, 91, 91, 0.35);
}

/* Outline secondary */
body.admin-body .btn-outline-secondary {
    color: #c9c9c9;
    border: 1px solid #2f2f32;
    background: #1b1b1e;
}
body.admin-body .btn-outline-secondary:hover {
    background: #26262a;
    color: #fff;
    border-color: #3a3a3e;
}

/* Ghost subtle */
body.admin-body .btn-ghost {
    background: transparent;
    border: 1px solid transparent;
    color: #b0b0b0;
}
body.admin-body .btn-ghost:hover {
    color: #fff;
    background: #1f1f20;
    border-color: #303033;
}

/* Size & spacing */
body.admin-body .btn-sm {
    font-size: 0.7rem;
    padding: 0.35rem 0.65rem;
    border-radius: 0.3rem;
}
body.admin-body .btn + .btn {
    margin-left: 0.4rem;
}

/* Disabled */
body.admin-body .btn:disabled,
body.admin-body .btn.disabled {
    opacity: 0.55;
    box-shadow: none;
    background: #3a2020 !important;
    border-color: #3a2020 !important;
    color: #ddd !important;
}

/* SMALL BADGES */
body.admin-body .badge.bg-success {
    background: #1d4c2d !important;
}
body.admin-body .badge.bg-info {
    background: #173a52 !important;
}
body.admin-body .badge.bg-warning {
    background: #5a3e12 !important;
}
body.admin-body .badge {
    font-weight: 500;
    letter-spacing: 0.3px;
    border: 1px solid rgba(255, 255, 255, 0.07);
}

/* STOCK FILTER INPUT IN HEADER */
#stockFilter {
    min-width: 170px;
}
#stockFilter:focus {
    border-color: #ff6666;
}

/* PRICE NORMALIZATION INDICATOR (temporary highlight) */
.price-normalized {
    animation: priceGlow 1.4s ease;
}
@keyframes priceGlow {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 102, 102, 0);
        background: #181818;
    }
    30% {
        box-shadow: 0 0 0 0.25rem rgba(255, 102, 102, 0.35);
        background: #222;
    }
    100% {
        box-shadow: 0 0 0 0 rgba(255, 102, 102, 0);
        background: #181818;
    }
}

/* TABLE ROW ADD/REMOVE BUTTONS */
#addStockTable .remove-row.btn {
    width: 100%;
    font-weight: 700;
    padding: 0.15rem 0;
}

/* HOVER FOCUS STATES */
body.admin-body input.form-control:hover,
body.admin-body select.form-select:hover {
    border-color: #333;
}
body.admin-body input.form-control:focus:hover,
body.admin-body select.form-select:focus:hover {
    border-color: #ff6666;
}

/* UTILITY: subtle divider */
.admin-divider {
    height: 1px;
    background: linear-gradient(90deg, transparent, #222, transparent);
    margin: 0.75rem 0 1rem;
}

/* STICKY FOOTER GUARD */
footer.footer {
    background: transparent;
    border-top: 1px solid #181818;
    padding-top: 1.25rem;
}

/* RESPONSIVE TWEAKS */
@media (max-width: 1199.98px) {
    body.admin-body .card.admin-section-card {
        margin-bottom: 0.5rem;
    }
}
@media (max-width: 991.98px) {
    #addStockTable input[name$="[janice]"] {
        min-width: 140px;
    }
}
@media (max-width: 767.98px) {
    .admin-section-card .card-header {
        flex-direction: column;
        align-items: flex-start;
    }
    #stockFilter {
        width: 100%;
    }
    .admin-section-card.card:hover {
        transform: none;
    }
}
@media (max-width: 575.98px) {
    body.admin-body {
        font-size: 13.5px;
    }
    body.admin-body .btn {
        font-size: 0.7rem;
        padding: 0.35rem 0.55rem;
    }
    body.admin-body table.table thead th {
        font-size: 0.6rem;
    }
    body.admin-body .form-control,
    body.admin-body .form-select {
        font-size: 0.7rem;
        padding: 0.3rem 0.45rem;
    }
}

/* ACCESSIBLE FOCUS OUTLINE FOR KEYBOARD NAVIGATION */
:focus-visible {
    outline: 2px solid #ff6666;
    outline-offset: 2px;
}

/* ROW HIGHLIGHT WHEN ANY INPUT CHANGED */
tr.row-changed {
    background: rgba(255, 102, 102, 0.08) !important;
    transition: background-color 0.3s ease;
}

/* JS helper class for filtered out (smooth fade) */
tr.row-filtered-out {
    animation: fadeRowOut 0.25s forwards;
}
@keyframes fadeRowOut {
    to {
        opacity: 0;
        height: 0;
        padding-top: 0;
        padding-bottom: 0;
        border: 0;
        transform: scaleY(0.6);
    }
}

/* LIGHT GLIMMER ON CARD EDGES */
.admin-section-card.card::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background: linear-gradient(
        120deg,
        rgba(255, 102, 102, 0.08),
        transparent 28%,
        transparent 72%,
        rgba(255, 102, 102, 0.07)
    );
    opacity: 0.5;
    mix-blend-mode: plus-lighter;
}

/* INLINE STATUS TAG */
.status-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4ch;
    padding: 0.25rem 0.55rem;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    border: 1px solid #2a2a2a;
    border-radius: 1rem;
    background: #181818;
    color: #ff8888;
}

/* ANIMATED BUTTON PRESS */
body.admin-body .btn:active {
    transform: translateY(0) scale(0.96);
    box-shadow: none;
    transition:
        transform 0.08s,
        box-shadow 0.08s;
}

/* JANICE LINK INPUT SPECIAL CASE: if value looks like URL */
input[name$="[janice]"][value^="http"] {
    color: #b6eaff;
    font-style: italic;
}

/* PROGRESS-LIKE BACKGROUND FOR TABLE HEADERS (subtle) */
#stockTable thead,
#addStockTable thead {
    background: linear-gradient(
        90deg,
        rgba(255, 102, 102, 0.07) 0%,
        rgba(255, 102, 102, 0.03) 40%,
        rgba(255, 102, 102, 0.05) 100%
    );
}

/* LINK REFINEMENTS */
body.admin-body a {
    color: #ff6666;
}
body.admin-body a:hover {
    color: #ff8585;
}

/* OPTIONAL PULSE FOR FLASH BADGES (brief) */
@keyframes flashPulse {
    0% {
        transform: scale(0.9);
        filter: brightness(0.9);
    }
    50% {
        transform: scale(1.05);
        filter: brightness(1.15);
    }
    100% {
        transform: scale(1);
        filter: brightness(1);
    }
}
body.admin-body .badge {
    animation: flashPulse 0.6s ease;
}

/* HELPER: subdued text */
.text-faint {
    color: #7a7a7a !important;
}

/* Metric summary card label & value enhancements */
#metricRow .card span.text-secondary {
    color: #ff8585 !important;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-shadow: 0 0 3px rgba(255, 102, 102, 0.25);
}
#metricRow .card {
    position: relative;
    overflow: hidden;
}
#metricRow .card::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        135deg,
        rgba(255, 102, 102, 0.1),
        rgba(187, 68, 68, 0.05) 40%,
        transparent 70%
    );
    opacity: 0.7;
    pointer-events: none;
}
#metricRow .card .fs-4.fw-bold {
    color: #ffe0e0;
    text-shadow: 0 0 6px rgba(255, 102, 102, 0.35);
}
/* Slight hover emphasis */
#metricRow .card:hover span.text-secondary {
    color: #ff9d9d !important;
}
#metricRow .card:hover .fs-4.fw-bold {
    color: #ffffff;
}
#metricRow .badge.bg-danger-subtle {
    background: #2a1414 !important;
    border-color: #412020 !important;
    color: #ff9a9a !important;
    font-weight: 500;
}
/* ==========================================================================
   CARD HEIGHT & CLAMP UTILITIES (ADDED)
   ========================================================================== */
/* Tighter internal spacing for denser cards */
.card-tight > .card-header {
    padding: 0.55rem 0.8rem;
}
.card-tight > .card-body {
    padding: 0.65rem 0.8rem 0.75rem;
}

/* Fixed-height small info cards (adds internal scroll only for body) */
.card-fixed-sm {
    max-height: 260px;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.card-fixed-sm > .card-body {
    overflow-y: auto;
    scrollbar-width: thin;
}
.card-fixed-sm > .card-body::-webkit-scrollbar {
    width: 8px;
}
.card-fixed-sm > .card-body::-webkit-scrollbar-thumb {
    background: #242b39;
    border-radius: 8px;
}

/* Generic line clamp helpers (WebKit-based; degrade gracefully elsewhere) */
.clamp-2,
.clamp-3,
.clamp-4,
.clamp-5,
.clamp-6 {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.clamp-2 {
    -webkit-line-clamp: 2;
}
.clamp-3 {
    -webkit-line-clamp: 3;
}
.clamp-4 {
    -webkit-line-clamp: 4;
}
.clamp-5 {
    -webkit-line-clamp: 5;
}
.clamp-6 {
    -webkit-line-clamp: 6;
}

/* Compact list style inside constrained cards */
.card-fixed-sm ul:last-child,
.card-tight ul:last-child,
.card-fixed-sm p:last-child,
.card-tight p:last-child {
    margin-bottom: 0;
}

/* -----------------------------------------------------------
   CARD HEIGHT REFINEMENT (shrink-to-content default)
   ----------------------------------------------------------- */

/* Reset safeguard (neutralize any legacy equal-height rule) */
@media (min-width: 1400px) {
    .admin-body .container-fluid > .row > [class*="col-"] .admin-section-card {
        min-height: auto !important;
    }
}

/* Opt-in equal heights: add class="row equal-heights" on rows that need it */
@media (min-width: 992px) {
    .admin-body .equal-heights > [class*="col-"] .admin-section-card {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
}

/* Prevent stretching explicitly (use on a specific card) */
.card.no-stretch,
.no-stretch.card,
.no-stretch > .card {
    height: auto !important;
    min-height: 0 !important;
    flex: 0 0 auto !important;
    align-self: flex-start !important;
}

/* Optional cap with internal scroll */
.card.cap-viewport {
    max-height: 70vh;
    overflow: hidden;
    display: flex;
    flex-direction: column;
}
.card.cap-viewport > .card-body {
    overflow-y: auto;
    scrollbar-width: thin;
}
.card.cap-viewport > .card-body::-webkit-scrollbar {
    width: 8px;
}
.card.cap-viewport > .card-body::-webkit-scrollbar-thumb {
    background: #262626;
    border-radius: 6px;
}

/* Knowledge base specific tweak */
.kb-card-grid .card.no-stretch {
    width: 100%;
}

/* -----------------------------------------------------------
   END CARD HEIGHT REFINEMENT
   ----------------------------------------------------------- */

/* Hero & Landing Redesign ---------------------------------- */
.helpdesk-hero {
    background: radial-gradient(
        circle at 20% 20%,
        #271010 0%,
        #120d0d 65%,
        #080808 100%
    );
    border: 1px solid #1e1e1e;
    box-shadow:
        0 8px 30px -10px rgba(0, 0, 0, 0.7),
        0 0 0 1px #101010;
    position: relative;
}
.helpdesk-hero .hero-bg {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(135deg, rgba(255, 70, 70, 0.15), transparent 60%),
        radial-gradient(
            circle at 75% 25%,
            rgba(255, 0, 80, 0.08),
            transparent 60%
        );
    mix-blend-mode: screen;
    opacity: 0.9;
    pointer-events: none;
}
.hero-overlay {
    position: relative;
    z-index: 2;
}
.hero-title {
    letter-spacing: 0.03em;
}
.hero-tagline {
    font-size: 1.05rem;
    color: #d8d8d8;
    max-width: 640px;
}
.hero-categories .hero-pill {
    background: rgba(255, 80, 80, 0.12) !important;
    border: 1px solid rgba(255, 90, 90, 0.25);
    color: #ffb3b3;
    font-weight: 500;
    transition:
        background 0.25s,
        border-color 0.25s,
        color 0.25s;
}
.hero-categories .hero-pill:hover,
.hero-categories .hero-pill:focus {
    background: rgba(255, 100, 100, 0.25) !important;
    color: #fff;
    border-color: rgba(255, 110, 110, 0.5);
}
.hero-cta-card {
    background: rgba(16, 16, 16, 0.72);
    border-color: #262626 !important;
    width: min(100%, 300px);
    backdrop-filter: blur(6px);
}
.hero-cta-card .btn {
    letter-spacing: 0.02em;
}
.article-list a:hover span,
.faq-list li:hover span.fw-semibold {
    text-decoration: underline;
}
.stat-label {
    font-size: 0.55rem;
    letter-spacing: 0.08em;
    opacity: 0.9;
}
/* End Hero & Landing Redesign ------------------------------ */

/* END OF FILE */