/**
 * Стили для плагина прогноза магнитных бурь в стиле my-calend.ru
 */

/* Основной контейнер */
.msf-forecast {
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 1.4;
    color: #333;
    margin: 20px 0;
    background: #fff;
}

/* Заголовки */
.msf-title {
    font-size: 24px;
    font-weight: bold;
    margin: 0 0 20px 0;
    color: #333;
}

.msf-section-title {
    font-size: 18px;
    font-weight: bold;
    margin: 25px 0 15px 0;
    color: #333;
}

.msf-section-subtitle {
    font-size: 16px;
    font-weight: bold;
    margin: 15px 0 10px 0;
    color: #333;
}

/* Описание текущего состояния */
.msf-current-description {
    margin: 15px 0;
    padding: 15px;
    background: #f9f9f9;
    border-radius: 4px;
    line-height: 1.5;
}

/* Таблица прогноза */
.msf-forecast-table {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0;
    background: #fff;
}

.msf-forecast-table th,
.msf-forecast-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
    vertical-align: middle;
}

.msf-forecast-table th {
    background: #f5f5f5;
    font-weight: bold;
    color: #333;
}

.msf-forecast-table .msf-date-cell {
    text-align: left;
    font-weight: bold;
    background: #f9f9f9;
    white-space: nowrap;
}

/* Цветовая схема для уровней активности (как на my-calend.ru) */
.msf-level-1 { background-color: #00ff00; color: #000; } /* Зеленый - нет возмущений */
.msf-level-2 { background-color: #90ee90; color: #000; } /* Светло-зеленый - небольшие возмущения */
.msf-level-3 { background-color: #ffff00; color: #000; } /* Желтый - слабая буря */
.msf-level-4 { background-color: #ffd700; color: #000; } /* Золотой - малая буря */
.msf-level-5 { background-color: #ff8c00; color: #000; } /* Оранжевый - умеренная буря */
.msf-level-6 { background-color: #ff4500; color: #fff; } /* Оранжево-красный - сильная буря */
.msf-level-7 { background-color: #ff0000; color: #fff; } /* Красный - жесткий шторм */
.msf-level-8 { background-color: #8b0000; color: #fff; } /* Темно-красный - экстремальный шторм */

/* Легенда */
.msf-legend {
    margin: 20px 0;
    background: #f9f9f9;
    padding: 15px;
    border-radius: 4px;
}

.msf-legend-title {
    font-weight: bold;
    margin-bottom: 10px;
    color: #333;
}

.msf-legend-table {
    width: 100%;
    border-collapse: collapse;
}

.msf-legend-table td {
    border: 1px solid #ddd;
    padding: 6px 8px;
    vertical-align: middle;
}

.msf-legend-table .msf-legend-level {
    width: 30px;
    text-align: center;
    font-weight: bold;
}

.msf-legend-table .msf-legend-description {
    text-align: left;
}

/* Информация о ближайшей сильной буре */
.msf-next-storm {
    margin: 20px 0;
}

.msf-next-storm-title {
    font-weight: bold;
    margin-bottom: 10px;
}

/* Сегодняшний прогноз */
.msf-today-forecast {
    margin: 20px 0;
}

/* Многодневный прогноз */
.msf-multiday-table {
    width: 100%;
    border-collapse: collapse;
    margin: 15px 0;
}

.msf-multiday-table th,
.msf-multiday-table td {
    border: 1px solid #ddd;
    padding: 6px;
    text-align: center;
    vertical-align: middle;
    font-size: 13px;
}

.msf-multiday-table th {
    background: #f5f5f5;
    font-weight: bold;
}

.msf-multiday-table .msf-date-cell {
    text-align: left;
    font-weight: bold;
    background: #f9f9f9;
    white-space: nowrap;
    width: 120px;
}

/* Календарь */
.msf-calendar {
    margin: 20px 0;
}

.msf-calendar-title {
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;
    font-size: 16px;
}

.msf-calendar-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 auto;
    max-width: 400px;
}

.msf-calendar-table th,
.msf-calendar-table td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: center;
    vertical-align: middle;
    width: 14.28%;
}

.msf-calendar-table th {
    background: #f5f5f5;
    font-weight: bold;
    font-size: 12px;
}

.msf-calendar-table td {
    height: 35px;
    position: relative;
}

.msf-calendar-table .msf-calendar-day {
    font-size: 13px;
    font-weight: bold;
}

.msf-calendar-table .msf-other-month {
    color: #ccc;
}

/* Компактная информация */
.msf-info-box {
    margin: 15px 0;
    padding: 12px;
    background: #f0f8ff;
    border-left: 4px solid #4682b4;
    border-radius: 0 4px 4px 0;
}

/* Ошибки */
.msf-error {
    background: #fee;
    border: 1px solid #fcc;
    border-radius: 4px;
    padding: 15px;
    color: #c33;
    margin: 10px 0;
}

/* Загрузка */
.msf-loading {
    text-align: center;
    padding: 20px;
    color: #666;
    font-style: italic;
}

/* Футер */
.msf-footer {
    text-align: center;
    padding: 10px;
    border-top: 1px solid #eee;
    color: #666;
    font-size: 12px;
    margin-top: 20px;
}

/* Адаптивность */
@media (max-width: 768px) {
    .msf-forecast-table,
    .msf-multiday-table {
        font-size: 12px;
    }
    
    .msf-forecast-table th,
    .msf-forecast-table td,
    .msf-multiday-table th,
    .msf-multiday-table td {
        padding: 6px 4px;
    }
    
    .msf-calendar-table {
        font-size: 12px;
    }
    
    .msf-title {
        font-size: 20px;
    }
    
    .msf-section-title {
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    .msf-forecast-table,
    .msf-multiday-table {
        font-size: 11px;
    }
    
    .msf-forecast-table th,
    .msf-forecast-table td,
    .msf-multiday-table th,
    .msf-multiday-table td {
        padding: 4px 2px;
    }
    
    .msf-title {
        font-size: 18px;
    }
    
    .msf-section-title {
        font-size: 14px;
    }
    
    .msf-calendar-table th,
    .msf-calendar-table td {
        padding: 4px;
        font-size: 11px;
    }
}

/* Стили для detailed шаблона в стиле my-calend.ru */
.magnitnye-buri-items {
    margin: 0 0 2rem;
    vertical-align: middle;
}

.magnitnye-buri-items[data-mobile] {
    display: none;
}

.magnitnye-buri-items td {
    padding: 0 1vw 0 0;
    line-height: 1.1;
}

.magnitnye-buri-items-weekday {
    font-size: .8rem;
    font-weight: bolder;
    color: #959595;
}

.magnitnye-buri-items [data-value] {
    padding: 16px 24px;
    text-align: center;
    border: 1px solid #fff;
    box-sizing: border-box;
}

.magnitnye-buri [data-value='1'] {
    background: #B8E9A5;
}

.magnitnye-buri [data-value='2'] {
    background: #FFECA0;
}

.magnitnye-buri [data-value='3'] {
    background: #FFA0A0;
}

.magnitnye-buri [data-value='4'] {
    background: #FF6666;
}

.magnitnye-buri [data-value='5'] {
    background: #BF2525;
}

.magnitnye-buri [data-value='6'] {
    background: #990000;
}

.magnitnye-buri [data-value='7'] {
    background: #A000A0;
}

.magnitnye-buri [data-value='8'] {
    background: #570257;
}

.magnitnye-buri-list {
    margin: 0 0 32px;
    padding: 0;
    list-style: none;
    columns: 4;
}

.magnitnye-buri_month-container {
    margin: 0 0 2rem;
    background: #f8f4e6;
}

.magnitnye-buri_month-container-item {
    display: inline-block;
    vertical-align: top;
    width: 50%;
    padding: 1rem;
    box-sizing: border-box;
}

.magnitnye-buri_month-title {
    margin: 0 0 1rem 1rem;
    font-size: 1.5rem;
}

.magnitnye-buri_month-table {
    width: 100%;
}

.magnitnye-buri_month-table th {
    color: #898989;
    font-weight: normal;
}

.magnitnye-buri_month-table td {
    position: relative;
    height: 2.4rem;
    text-align: center;
}

.magnitnye-buri_month-table td[data-value] {
    border: 1px solid #fff;
}

.magnitnye-buri_month-table td[data-value]:before {
    content: attr(data-value);
    position: absolute;
    top: 0;
    right: 0;
    font-size: .8rem;
    line-height: 1;
    outline: 1px solid #fff;
    padding: 2px;
}

.magnitnye-buri_month-table .disabled {
    color: #b7b7b7;
}

.magnitnye-buri_month-container .magnitnye-buri-items {
    margin: 0;
}

.magnitnye-buri_month-container .magnitnye-buri-items [data-value] {
    padding: .5rem 1rem;
}

@media (max-width: 799px) {
    .magnitnye-buri-items [data-value] {
        padding: 1.5vw 3vw;
    }
    .magnitnye-buri-list {
        columns: 3;
    }
}

@media (max-width: 560px) {
    .magnitnye-buri-items[data-desktop] {
        display: none;
    }
    .magnitnye-buri-items[data-mobile] {
        display: table;
    }
    .magnitnye-buri-list {
        columns: 2;
    }
    .magnitnye-buri_month-container-item {
        width: 100%;
    }
}

/* Утилиты */
.msf-text-center { text-align: center; }
.msf-text-left { text-align: left; }
.msf-text-right { text-align: right; }
.msf-bold { font-weight: bold; }
.msf-hidden { display: none; }
.msf-mb-10 { margin-bottom: 10px; }
.msf-mt-10 { margin-top: 10px; }