/* ============================================
   ФИКС ДЛЯ ТЁМНОЙ ТЕМЫ БРАУЗЕРА
   Применяется ТОЛЬКО когда включена тёмная тема
   ============================================ */

@media (prefers-color-scheme: dark) {
    
    /* 1. ВСЕ ПОЛЯ ВВОДА — СВЕТЛЫЙ ФОН */
    input,
    textarea,
    select {
        background-color: #ffffff !important;
        color: #212529 !important;
        border: 1px solid #ced4da !important;
    }

    input:focus,
    textarea:focus,
    select:focus {
        background-color: #ffffff !important;
        color: #212529 !important;
        border-color: #000000 !important;
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1) !important;
        outline: none !important;
    }

    /* 2. ПЛЕЙСХОЛДЕРЫ */
    input::placeholder,
    textarea::placeholder {
        color: #6c757d !important;
        opacity: 1 !important;
    }

    /* 3. СКРОЛЛБАРЫ (ВЕРТИКАЛЬНЫЕ И ГОРИЗОНТАЛЬНЫЕ) */
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 8px;
    }

    ::-webkit-scrollbar-thumb {
        background: #c1c7cd;
        border-radius: 8px;
        border: 2px solid #f1f1f1;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #a0a8b0;
    }

    * {
        scrollbar-width: thin;
        scrollbar-color: #c1c7cd #f1f1f1;
    }

    /* 4. ДЛЯ ТАБЛИЦ И КОНТЕЙНЕРОВ С ПРОКРУТКОЙ */
    .table-responsive::-webkit-scrollbar,
    .overflow-auto::-webkit-scrollbar,
    .overflow-x-auto::-webkit-scrollbar {
        height: 10px;
    }

    .table-responsive::-webkit-scrollbar-track,
    .overflow-auto::-webkit-scrollbar-track,
    .overflow-x-auto::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 8px;
    }

    .table-responsive::-webkit-scrollbar-thumb,
    .overflow-auto::-webkit-scrollbar-thumb,
    .overflow-x-auto::-webkit-scrollbar-thumb {
        background: #c1c7cd;
        border-radius: 8px;
        border: 2px solid #f1f1f1;
    }

    .table-responsive::-webkit-scrollbar-thumb:hover,
    .overflow-auto::-webkit-scrollbar-thumb:hover,
    .overflow-x-auto::-webkit-scrollbar-thumb:hover {
        background: #a0a8b0;
    }

    .table-responsive,
    .overflow-auto,
    .overflow-x-auto {
        scrollbar-width: thin;
        scrollbar-color: #c1c7cd #f1f1f1;
    }

    /* 5. СПЕЦИАЛЬНО ДЛЯ КАЛЬКУЛЯТОРА */
    .calculator-wrapper input,
    .calculator-wrapper textarea,
    .calculator-wrapper select,
    #piecesInput,
    #stockLength,
    #cutWidth,
    #minRemaining,
    #pricePerKg,
    .selector-row select,
    .selector-row input,
    .param-row input {
        background-color: #ffffff !important;
        color: #212529 !important;
    }

    .calculator-wrapper input:focus,
    .calculator-wrapper textarea:focus,
    .calculator-wrapper select:focus,
    #piecesInput:focus {
        background-color: #ffffff !important;
        color: #212529 !important;
        border-color: #000000 !important;
        box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.1) !important;
        outline: none !important;
    }

    /* 6. ДЛЯ SVG КОНТЕЙНЕРА (горизонтальный скролл) */
    #svgContainer {
        overflow-x: auto;
        overflow-y: hidden;
    }

    #svgContainer::-webkit-scrollbar {
        height: 10px;
    }

    #svgContainer::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 8px;
    }

    #svgContainer::-webkit-scrollbar-thumb {
        background: #c1c7cd;
        border-radius: 8px;
        border: 2px solid #f1f1f1;
    }

    #svgContainer::-webkit-scrollbar-thumb:hover {
        background: #a0a8b0;
    }
}