/**
 * GLOBAL CHECKBOX FIX - Компактные чекбоксы
 * 
 * Проблема: Чекбоксы и их контейнеры занимают 60-80px в высоту
 * Решение: Принудительное уменьшение до стандарта Desktop UI (16x16px)
 * 
 * Применяется к:
 * - Marketplace фильтры (/marketplace/)
 * - Настройки уведомлений (/accounts/lawyer/notifications/)
 * - Все формы с чекбоксами
 */

/* ============================================
   1. ГЛОБАЛЬНЫЙ СБРОС ЧЕКБОКСОВ
   ============================================ */

/* Стандартный размер чекбокса: 16x16px */
input[type="checkbox"] {
    width: 16px !important;
    height: 16px !important;
    min-width: 16px !important;
    min-height: 16px !important;
    max-width: 16px !important;
    max-height: 16px !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important; /* Убираем scale */
    flex-shrink: 0; /* Не сжимать */
}

/* Tailwind классы для чекбоксов */
input[type="checkbox"].w-4 {
    width: 16px !important;
}

input[type="checkbox"].h-4 {
    height: 16px !important;
}

/* Убираем любые transform: scale */
input[type="checkbox"][style*="transform"] {
    transform: none !important;
}

/* ============================================
   2. MARKETPLACE ФИЛЬТРЫ - Компактные строки
   ============================================ */

/* Контейнер фильтров */
#filterForm .space-y-2 {
    gap: 4px !important;
}

/* Строка с чекбоксом в фильтрах */
#filterForm label {
    padding: 4px 8px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    gap: 8px !important;
    display: flex !important;
    align-items: center !important;
}

/* Текст рядом с чекбоксом */
#filterForm label span {
    font-size: 14px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

/* Убираем лишние отступы в списке специализаций */
#filterForm .space-y-2 > label {
    margin-bottom: 2px !important;
}

/* ============================================
   3. НАСТРОЙКИ УВЕДОМЛЕНИЙ - Компактные карточки
   ============================================ */

/* Контейнер настройки (цветная карточка) */
.bg-gray-50.rounded-lg,
.bg-orange-50.rounded-lg,
.bg-blue-50.rounded-lg,
.bg-purple-50.rounded-lg {
    padding: 12px !important; /* Было p-4 (16px), стало 12px */
    min-height: 48px !important;
    max-height: 48px !important;
    display: flex !important;
    align-items: center !important;
}

/* Чекбокс в настройках */
.bg-gray-50 input[type="checkbox"],
.bg-orange-50 input[type="checkbox"],
.bg-blue-50 input[type="checkbox"],
.bg-purple-50 input[type="checkbox"] {
    margin-top: 0 !important;
}

/* Контейнер чекбокса */
.flex.items-center.h-5 {
    height: auto !important;
    margin-top: 0 !important;
}

/* Текстовый блок рядом с чекбоксом */
.ml-3 {
    margin-left: 8px !important;
}

/* Заголовок настройки */
.ml-3 label {
    font-size: 14px !important;
    line-height: 1.3 !important;
    margin-bottom: 2px !important;
    font-weight: 600 !important;
}

/* Описание настройки (мелкий текст) */
.ml-3 p.text-sm {
    font-size: 12px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
}

/* Убираем лишние отступы между карточками */
form .space-y-4 {
    gap: 8px !important;
}

form .space-y-4 > div {
    margin-bottom: 8px !important;
}

/* ============================================
   4. ORDER FORM - Компактные специализации
   ============================================ */

/* Теги специализаций */
.spec-tag {
    padding: 6px 12px !important;
    min-height: 32px !important;
    max-height: 32px !important;
    font-size: 14px !important;
    gap: 6px !important;
}

/* Скрытый чекбокс в специализациях */
.spec-tag input[type="checkbox"] {
    position: absolute !important;
    opacity: 0 !important;
    width: 0 !important;
    height: 0 !important;
}

/* Текст в теге */
.spec-tag span {
    font-size: 14px !important;
    line-height: 1.2 !important;
}

/* ============================================
   5. ОБЩИЕ ПРАВИЛА ДЛЯ ВСЕХ ФОРМ
   ============================================ */

/* Лейбл с чекбоксом */
label.flex.items-center {
    gap: 8px !important;
    padding: 4px 0 !important;
}

/* Курсор pointer для всех чекбоксов */
input[type="checkbox"],
label[for] {
    cursor: pointer !important;
}

/* Убираем лишние margin у чекбоксов */
input[type="checkbox"] + span,
input[type="checkbox"] + label {
    margin-left: 8px !important;
}

/* ============================================
   6. RESPONSIVE - Мобильные устройства
   ============================================ */

@media (max-width: 640px) {
    /* На мобильных чекбоксы остаются 16x16px */
    input[type="checkbox"] {
        width: 16px !important;
        height: 16px !important;
    }
    
    /* Немного увеличиваем область клика на мобильных */
    label.flex.items-center {
        padding: 8px 4px !important;
        min-height: 44px !important; /* Accessibility: минимум 44px для тача */
    }
    
    /* Настройки уведомлений на мобильных */
    .bg-gray-50.rounded-lg,
    .bg-orange-50.rounded-lg,
    .bg-blue-50.rounded-lg,
    .bg-purple-50.rounded-lg {
        min-height: 56px !important;
        max-height: none !important;
        padding: 12px !important;
    }
}

/* ============================================
   7. ACCESSIBILITY - Фокус и hover
   ============================================ */

/* Видимый фокус для клавиатурной навигации */
input[type="checkbox"]:focus {
    outline: 2px solid #0891b2 !important;
    outline-offset: 2px !important;
}

/* Hover эффект для строк с чекбоксами */
label:has(input[type="checkbox"]):hover {
    background-color: rgba(8, 145, 178, 0.05) !important;
}

/* Активное состояние */
label:has(input[type="checkbox"]):active {
    background-color: rgba(8, 145, 178, 0.1) !important;
}

/* ============================================
   8. СПЕЦИФИЧНЫЕ ИСПРАВЛЕНИЯ
   ============================================ */

/* Чекбокс "Не знаю цену" в форме заказа */
#budget_unknown {
    width: 16px !important;
    height: 16px !important;
}

/* Чекбокс согласия с условиями */
#id_agreement {
    width: 16px !important;
    height: 16px !important;
    margin-top: 2px !important;
}

/* Убираем огромные паддинги у label в регистрации */
label[for="id_agreement"] {
    padding: 0 !important;
    margin: 0 !important;
}

/* ============================================
   9. PRINT STYLES - Для печати
   ============================================ */

@media print {
    input[type="checkbox"] {
        width: 12px !important;
        height: 12px !important;
    }
}

/* ============================================
   10. DARK MODE SUPPORT (опционально)
   ============================================ */

@media (prefers-color-scheme: dark) {
    input[type="checkbox"]:focus {
        outline-color: #06b6d4 !important;
    }
}