/**
 * Фронтенд стили калькулятора (B2B Premium / Legal Design)
 */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&display=swap');
.ccalc-wrapper {
    font-family: 'Inter', sans-serif; color: #2b2b2b; background: var(--gcalc-bg, #F5F5F0);
    padding: 30px; border: 1px solid #e0e0e0; border-radius: 2px; max-width: 1000px; margin: 0 auto;
}
.ccalc-wrapper * { box-sizing: border-box; }
.ccalc-label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.ccalc-global-controls { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 30px; padding-bottom: 20px; border-bottom: 2px solid #e0e0e0; }
.ccalc-control-group { flex: 1; min-width: 300px; }
.ccalc-segmented-control { display: flex; border: 1px solid #ccc; background: #fff; }
.ccalc-seg-btn { flex: 1; padding: 12px 15px; background: transparent; border: none; border-right: 1px solid #ccc; font-weight: 600; cursor: pointer; }
.ccalc-seg-btn:last-child { border-right: none; }
.ccalc-seg-btn.active { background: var(--gcalc-accent, #2b2b2b); color: #fff; }
.ccalc-zone { background: #fff; border: 1px solid #ccc; margin-bottom: 20px; padding: 25px; }
.ccalc-zone-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; border-bottom: 1px solid #eee; padding-bottom: 15px; }
.ccalc-zone-category-select { font-size: 18px; font-weight: 700; border: none; background: transparent; cursor: pointer; outline: none; }
.ccalc-zone-remove { background: transparent; border: 1px solid #ccc; padding: 6px 12px; font-weight: 600; cursor: pointer; }
.ccalc-zone-remove:hover { background: var(--gcalc-accent, #2b2b2b); color: #fff; }
.ccalc-row { display: flex; flex-wrap: wrap; gap: 20px; margin-bottom: 20px; }
.ccalc-col { flex: 1; min-width: 250px; }
.ccalc-input { width: 100%; padding: 12px 15px; border: 1px solid #ccc; font-size: 15px; }
.ccalc-custom-select { position: relative; width: 100%; }
.ccalc-select-trigger { width: 100%; padding: 12px 15px; border: 1px solid #ccc; background: #fff; cursor: pointer; display: flex; justify-content: space-between; }
.ccalc-select-trigger::after { content: "▼"; font-size: 10px; }
.ccalc-select-dropdown { display: none; position: absolute; top: 100%; left: 0; width: 100%; background: #fff; border: 1px solid #ccc; z-index: 10; max-height: 250px; overflow-y: auto; }
.ccalc-select-dropdown.open { display: block; }
.ccalc-custom-option { display: flex; align-items: center; padding: 10px 15px; cursor: pointer; }
.ccalc-custom-option:hover { background: var(--gcalc-bg, #F5F5F0); }
.ccalc-custom-option input[type="checkbox"] { display: none; }
.ccalc-checkbox-ui { width: 18px; height: 18px; border: 1px solid #ccc; margin-right: 12px; position: relative; }
.ccalc-custom-option input[type="checkbox"]:checked + .ccalc-checkbox-ui { background: var(--gcalc-accent, #2b2b2b); }
.ccalc-btn-outline { background: transparent; border: 2px dashed #ccc; width: 100%; padding: 15px; font-weight: 700; cursor: pointer; text-transform: uppercase; }
.ccalc-total-panel { border: 2px solid var(--gcalc-accent, #2b2b2b); padding: 30px; display: flex; justify-content: space-between; align-items: center; background: #fff; }
#ccalc-total-price { font-size: 32px; font-weight: 800; color: var(--gcalc-accent, #2b2b2b); }
.ccalc-btn-primary { background: var(--gcalc-accent, #2b2b2b); color: #fff; border: none; padding: 18px 30px; font-weight: 700; cursor: pointer; text-transform: uppercase; }
.ccalc-modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(43, 43, 43, 0.85); z-index: 99999; display: flex; align-items: center; justify-content: center; }
.ccalc-modal-content { background: var(--gcalc-bg, #F5F5F0); width: 100%; max-width: 500px; padding: 40px; position: relative; border: 1px solid #ccc; }
.ccalc-modal-close { position: absolute; top: 15px; right: 20px; font-size: 28px; cursor: pointer; }
.ccalc-cf7-container input[type="text"], .ccalc-cf7-container input[type="email"], .ccalc-cf7-container input[type="tel"] { width: 100%; padding: 12px 15px; margin-bottom: 15px; border: 1px solid #ccc; }
.ccalc-cf7-container input[type="submit"] { width: 100%; background: var(--gcalc-accent, #2b2b2b); color: #fff; border: none; padding: 15px; font-weight: 700; text-transform: uppercase; cursor: pointer; }
/* Жесткий сброс стилей темы для инпутов калькулятора */
.ccalc-wrapper input[type="number"],
.ccalc-wrapper input[type="text"],
.ccalc-wrapper select {
    background-color: #F5F5F0 !important;
    color: #2B2B2B !important;
    border: 2px solid #2B2B2B !important;
    border-radius: 2px !important;
    padding: 12px 15px !important;
    font-family: sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    outline: none !important;
    appearance: auto !important;
}

/* Выделение при клике (фокус) */
.ccalc-wrapper input[type="number"]:focus,
.ccalc-wrapper input[type="text"]:focus,
.ccalc-wrapper select:focus {
    border-color: #C5A059 !important;
    box-shadow: 0 0 0 1px #C5A059 !important;
}

/* Отступы для блоков */
.ccalc-zone {
    margin-bottom: 30px !important;
    padding-bottom: 20px !important;
    border-bottom: 1px dashed #2B2B2B !important;
}

/* Переключатель режима: Материалы / С монтажом */
.ccalc-mode-switch {
    display: flex;
    gap: 10px;
    margin-bottom: 20px;
    background: #2B2B2B !important;
    padding: 5px;
    border-radius: 4px;
}

.ccalc-mode-switch input[type="radio"] {
    display: none;
}

.ccalc-mode-switch label {
    flex: 1;
    text-align: center;
    padding: 12px 15px;
    cursor: pointer;
    color: #F5F5F0 !important;
    font-weight: 600;
    transition: all 0.3s ease;
    border-radius: 2px;
    margin: 0;
}

.ccalc-mode-switch input[type="radio"]:checked + label {
    background: #C5A059 !important;
    color: #1A1A1A !important;
}

.ccalc-works-container.hidden {
    display: none !important;
}
/* --- ЖЕСТКИЙ ФИКС ШИРИНЫ И ПЕРЕНОСА ТЕКСТА --- */
@media (max-width: 768px) {
    #ccalc-app {
        overflow-x: hidden !important;
        width: 100% !important;
        max-width: 100vw !important;
    }

    /* 1. ЛОМАЕМ "ЛОМ": Разрешаем любому тексту внутри калькулятора переноситься */
    #ccalc-app * {
        box-sizing: border-box !important;
        white-space: normal !important; 
        word-wrap: break-word !important;
    }

    /* 2. Обнуляем отступы у всех строк и колонок */
    #ccalc-app .ccalc-row, 
    #ccalc-app .ccalc-col,
    #ccalc-app .ccalc-zone-header {
        display: block !important;
        width: 100% !important;
        margin: 0 0 15px 0 !important;
        padding: 0 !important;
    }

    /* 3. Жестко ограничиваем инпуты, селекты и их обертки */
    #ccalc-app input, 
    #ccalc-app select, 
    #ccalc-app .ccalc-custom-select,
    #ccalc-app .ccalc-input {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
    }
}/* Принудительная активация событий клика в iOS Safari */
#ccalc-modal, 
.ccalc-modal-close, 
#ccalc-btn-lead {
    cursor: pointer !important;
    -webkit-tap-highlight-color: transparent;
}