/**
 * InEvently — Custom CSS
 * Brand color: #5aa19c (teal)
 * All custom styles use the ie- prefix to avoid collision with Bootstrap/Metronic.
 */

/* ---- Brand Color Overrides ---- */
:root {
    --ie-primary: #5aa19c;
    --ie-primary-light: #e8f4f3;
    --ie-primary-dark: #4a8a86;
    --ie-primary-active: #4d8f8a;
    --ie-charcoal: #454545;
}

/* Override Metronic primary color — both theme modes and root */
:root,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --bs-primary: #5aa19c;
    --bs-primary-rgb: 90, 161, 156;
    --bs-link-color: #5aa19c;
    --bs-link-hover-color: #4d8f8a;
    --kt-primary: #5aa19c;
    --kt-primary-active: #4d8f8a;
    --kt-primary-light: #e8f4f3;
    --kt-primary-inverse: #ffffff;
}

.btn-primary {
    background-color: var(--ie-primary) !important;
    border-color: var(--ie-primary) !important;
}
.btn-primary:hover, .btn-primary:focus {
    background-color: var(--ie-primary-active) !important;
    border-color: var(--ie-primary-active) !important;
}
.btn-light-primary {
    color: var(--ie-primary) !important;
    background-color: var(--ie-primary-light) !important;
}
.btn-light-primary:hover {
    color: #fff !important;
    background-color: var(--ie-primary) !important;
}
.bg-primary { background-color: var(--ie-primary) !important; }
.bg-light-primary { background-color: var(--ie-primary-light) !important; }
.text-primary { color: var(--ie-primary) !important; }
.badge-light-primary { color: var(--ie-primary) !important; background-color: var(--ie-primary-light) !important; }
.text-hover-primary:hover { color: var(--ie-primary) !important; }
.border-primary { border-color: var(--ie-primary) !important; }

/* Metronic-specific primary overrides */
.symbol-label.bg-light-primary { background-color: var(--ie-primary-light) !important; color: var(--ie-primary) !important; }
.form-check-input:checked { background-color: var(--ie-primary) !important; border-color: var(--ie-primary) !important; }
.form-switch .form-check-input:checked { background-color: var(--ie-primary) !important; }
.page-link.active, .active > .page-link { background-color: var(--ie-primary) !important; border-color: var(--ie-primary) !important; }
.nav-link.active { color: var(--ie-primary) !important; }
.nav-tabs .nav-link.active { color: var(--ie-primary) !important; border-bottom-color: var(--ie-primary) !important; }
.nav-line-tabs .nav-link.active { color: var(--ie-primary) !important; border-bottom-color: var(--ie-primary) !important; }
a { color: var(--ie-primary); }
a:hover { color: var(--ie-primary-active); }
.menu-link:hover .menu-title, .menu-link:hover .menu-icon i { color: var(--ie-primary) !important; }
.progress-bar { background-color: var(--ie-primary) !important; }
.btn-active-light-primary:active, .btn-active-light-primary.active { color: var(--ie-primary) !important; background-color: var(--ie-primary-light) !important; }
.dropdown-item.active, .dropdown-item:active { background-color: var(--ie-primary) !important; }

/* Active sidebar item — sub-items get full highlight */
.app-sidebar .menu-sub .menu-link.active {
    background-color: var(--ie-primary-light) !important;
    color: var(--ie-primary) !important;
}
.app-sidebar .menu-sub .menu-link.active .menu-bullet .bullet {
    background-color: var(--ie-primary) !important;
}

/* Top-level active items (non-accordion) get full highlight */
.app-sidebar .menu-item:not(.menu-accordion) > .menu-link.active {
    background-color: var(--ie-primary-light) !important;
    color: var(--ie-primary) !important;
}
.app-sidebar .menu-item:not(.menu-accordion) > .menu-link.active .menu-icon i {
    color: var(--ie-primary) !important;
}

/* Accordion parent header when active — teal text only, NO background */
.app-sidebar .menu-accordion > .menu-link.active {
    background-color: transparent !important;
    color: var(--ie-primary) !important;
}
.app-sidebar .menu-accordion > .menu-link.active .menu-icon i {
    color: var(--ie-primary) !important;
}
.app-sidebar .menu-accordion > .menu-link.active .menu-title {
    color: var(--ie-primary) !important;
}
.app-sidebar .menu-accordion > .menu-link.active .menu-arrow {
    color: var(--ie-primary) !important;
}

/* ---- Sidebar ---- */
.app-sidebar-logo-minimize { display: none; }
.app-sidebar-minimize .app-sidebar-logo-default { display: none; }
.app-sidebar-minimize .app-sidebar-logo-minimize { display: inline; }

.app-sidebar .menu-section {
    text-transform: uppercase;
    font-size: 0.7rem;
    letter-spacing: 0.08em;
    font-weight: 600;
    color: #a1a5b7;
    padding: 1.25rem 0 0.5rem;
}

/* ---- Topbar Enhancements ---- */
.ie-topbar-event-selector .dropdown-toggle {
    font-weight: 600;
    font-size: 0.925rem;
    color: #3f4254;
    padding: 6px 12px;
    border-radius: 6px;
    transition: background 0.15s;
}
.ie-topbar-event-selector .dropdown-toggle:hover {
    background-color: #f4f6fa;
}

.ie-topbar-search {
    position: relative;
    width: 400px;
}
.ie-topbar-search input {
    padding-left: 38px;
    height: 40px;
    font-size: 0.875rem;
    background-color: #f9fafb;
    border: 1px solid #e4e6ef;
    border-radius: 8px;
    transition: border-color 0.15s, box-shadow 0.15s;
}
.ie-topbar-search input:focus {
    background-color: #fff;
    border-color: var(--ie-primary);
    box-shadow: 0 0 0 3px rgba(90, 161, 156, 0.15);
}
.ie-topbar-search .ie-search-icon {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #a1a5b7;
    font-size: 16px;
    pointer-events: none;
}

/* Search results dropdown */
.ie-search-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1060;
    background: #fff;
    border: 1px solid #e4e6ef;
    border-top: none;
    border-radius: 0 0 8px 8px;
    max-height: 400px;
    overflow-y: auto;
    display: none;
    box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}
.ie-search-dropdown.show { display: block; }
.ie-search-item {
    padding: 10px 14px;
    cursor: pointer;
    border-bottom: 1px solid #f4f6fa;
    transition: background 0.1s;
}
.ie-search-item:hover, .ie-search-item.active { background-color: #f9fafb; }
.ie-search-item:last-child { border-bottom: none; }
.ie-search-item .ie-search-name { font-weight: 600; color: #3f4254; }
.ie-search-item .ie-search-meta { font-size: 12px; color: #a1a5b7; }
.ie-search-empty, .ie-search-loading {
    padding: 16px;
    text-align: center;
    color: #a1a5b7;
    font-size: 0.875rem;
}

/* ---- Topbar Status Indicators ---- */
.ie-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 5px;
}
.ie-status-dot.connected { background-color: #50cd89; }
.ie-status-dot.disconnected { background-color: #f1416c; }

.ie-topbar-indicator {
    display: flex;
    align-items: center;
    padding: 4px 10px;
    font-size: 0.8rem;
    color: #a1a5b7;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s;
}
.ie-topbar-indicator:hover { background-color: #f4f6fa; }

.ie-topbar-divider {
    width: 1px;
    height: 24px;
    background: #e4e6ef;
    margin: 0 4px;
}

/* ---- Workstation Offcanvas ---- */
#ie-workstation-offcanvas .offcanvas-header {
    border-bottom: 1px solid #f4f6fa;
}
#ie-workstation-offcanvas .accordion-button:not(.collapsed) {
    color: var(--ie-primary);
    background-color: var(--ie-primary-light);
}

/* ---- Dashboard Stat Cards ---- */
.ie-stat-card {
    border-left: 4px solid transparent;
    transition: box-shadow 0.2s;
}
.ie-stat-card:hover {
    box-shadow: 0 2px 12px rgba(0,0,0,0.06);
}
.ie-stat-card.ie-stat-blue { border-left-color: var(--ie-primary); }
.ie-stat-card.ie-stat-green { border-left-color: #50cd89; }
.ie-stat-card.ie-stat-gray { border-left-color: #a1a5b7; }
.ie-stat-card.ie-stat-amber { border-left-color: #ffc700; }
.ie-stat-card.ie-stat-red { border-left-color: #f1416c; }

/* ---- Check-In Specific ---- */
.ie-checkin-success {
    animation: ieSuccessFlash 1.5s ease-out;
}
@keyframes ieSuccessFlash {
    0% { background-color: #d1f5d3; }
    100% { background-color: transparent; }
}
.ie-checkin-scan-input {
    font-size: 1.5rem;
    height: 56px;
    padding-left: 48px;
}
.ie-checkin-scan-input:focus {
    border-color: var(--ie-primary);
    box-shadow: 0 0 0 4px rgba(90, 161, 156, 0.15);
}

/* ---- Form Validation ---- */
.form-control.is-invalid,
.form-select.is-invalid {
    border-color: #f1416c !important;
    background-color: #fff5f8 !important;
    box-shadow: 0 0 0 2px rgba(241, 65, 108, 0.12) !important;
}
.form-control.is-invalid:focus,
.form-select.is-invalid:focus {
    border-color: #f1416c !important;
    box-shadow: 0 0 0 3px rgba(241, 65, 108, 0.2) !important;
}
.input-group .form-control.is-invalid {
    z-index: 2;
}
.ie-field-error {
    font-size: 0.8rem;
    color: #f1416c;
    margin-top: 4px;
}
.ie-submit-warning {
    animation: ieFadeIn 0.3s ease;
}
@keyframes ieFadeIn {
    from { opacity: 0; transform: translateY(-4px); }
    to { opacity: 1; transform: translateY(0); }
}

/* ---- Responsive ---- */
@media (max-width: 991.98px) {
    .ie-topbar-search { width: 100%; }
    .ie-hide-mobile { display: none !important; }
}