/* Shared page-level overrides for login and filter panels */

/* Login page glow */
.login-bg-glow {
    position: absolute;
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(0, 242, 255, 0.15) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    animation: float-glow 10s infinite ease-in-out;
}

.login-bg-glow.glow-left {
    top: -100px;
    left: -100px;
}

.login-bg-glow.glow-right {
    bottom: -100px;
    right: -100px;
    background: radial-gradient(circle, rgba(188, 19, 254, 0.15) 0%, transparent 70%);
    animation-delay: -5s;
}

.login-title-glow {
    text-shadow: 0 0 20px rgba(0, 242, 255, 0.3);
}

@keyframes float-glow {
    0%, 100% { transform: translate(0, 0) scale(1); }
    50% { transform: translate(20px, -20px) scale(1.1); }
}

/* Filter panel controls */
.filter-panel .custom-select-wrapper { display: block; width: 100%; min-width: 0; }
.filter-panel .custom-select-trigger { width: 100%; }
.filter-panel .ocr-filter-item { width: 100%; min-width: 0; }

/* Keep custom-select and input controls visually identical */
.filter-panel .custom-select-trigger,
.filter-panel .filter-control {
    min-height: 42px;
    border: 1px solid rgb(51, 65, 85) !important;
    border-radius: 0.375rem;
}

.filter-panel .filter-control {
    height: 42px;
    background-color: rgb(15, 23, 42);
    line-height: 1.5;
}

.filter-panel .custom-select-trigger:hover,
.filter-panel .filter-control:hover {
    border-color: rgb(71, 85, 105) !important;
}

/* Keep OCR filter rows balanced across common desktop widths */
@media (min-width: 1024px) {
    .filter-panel .ocr-filter-grid {
        max-width: 1180px;
        justify-content: start;
    }
}

@media (min-width: 1280px) {
    .filter-panel .ocr-filter-grid {
        max-width: 1240px;
        justify-content: start;
    }
}

@media (min-width: 1440px) {
    .filter-panel .filter-grid {
        max-width: 1120px;
        justify-content: start;
    }

    .filter-panel .ocr-filter-grid {
        max-width: 1280px;
        justify-content: start;
    }
}

@media (min-width: 1600px) {
    .filter-panel .ocr-filter-grid {
        max-width: 1360px;
        justify-content: start;
    }
}

/* Keep critical OCR whitelist columns readable on narrower screens */
.ocr-whitelist-table {
    min-width: 1180px;
    table-layout: auto;
}

.ocr-whitelist-table .ocr-whitelist-col-title {
    min-width: 180px;
}

.ocr-whitelist-table .ocr-whitelist-col-link {
    min-width: 240px;
}

.ocr-whitelist-table .ocr-whitelist-col-keyword,
.ocr-whitelist-table .ocr-whitelist-col-product {
    min-width: 160px;
}

/* Floating horizontal scrollbar for table containers */
.floating-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: rgba(71, 85, 105, 0.9) transparent;
    height: 14px;
    padding: 2px 0;
}

.floating-scrollbar::-webkit-scrollbar {
    height: 10px;
}

.floating-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.floating-scrollbar::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    background: rgba(71, 85, 105, 0.9);
}

/* OCR image preview modal scrollbar */
.ocr-preview-scroll {
    scrollbar-width: thin;
    scrollbar-color: rgba(34, 211, 238, 0.7) rgba(15, 23, 42, 0.85);
}

.ocr-preview-scroll::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.ocr-preview-scroll::-webkit-scrollbar-track {
    border-radius: 9999px;
    background: rgba(15, 23, 42, 0.85);
}

.ocr-preview-scroll::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    border: 2px solid rgba(15, 23, 42, 0.85);
    background: linear-gradient(180deg, rgba(34, 211, 238, 0.85) 0%, rgba(59, 130, 246, 0.75) 100%);
}

.ocr-preview-scroll::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, rgba(103, 232, 249, 0.95) 0%, rgba(96, 165, 250, 0.85) 100%);
}
