/**
 * Camping Météo Pro — styles widget
 * Carte contenue, palette douce, sections compactes.
 */

.cmp-widget {
    --cmp-accent: #6B8E4E;
    --cmp-accent-soft: #eef2e8;
    --cmp-warn: #C8553D;
    --cmp-text: #1F2A1E;
    --cmp-text-soft: #4a5249;
    --cmp-muted: #8b9282;
    --cmp-border: #e8e6df;
    --cmp-bg: #fbfaf6;
    --cmp-bg-soft: #f4f1e9;

    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    color: var(--cmp-text);
    background: var(--cmp-bg);
    padding: 24px 28px;
    margin: 32px auto;
    max-width: 760px;
    border: 1px solid var(--cmp-border);
    border-radius: 10px;
    line-height: 1.55;
    box-sizing: border-box;
    font-weight: 400;
    font-size: 15px;
}

.cmp-widget *,
.cmp-widget *::before,
.cmp-widget *::after { box-sizing: border-box; }

.cmp-widget h2 {
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 500;
    color: var(--cmp-text);
    margin: 0;
    line-height: 1.2;
    font-size: 1.25rem;
    letter-spacing: -0.01em;
}
.cmp-widget h3 {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--cmp-muted);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    margin: 24px 0 12px;
    font-weight: 500;
}
.cmp-widget h2 + p { margin-top: 4px; }
.cmp-widget p { margin: 0 0 8px; }
.cmp-widget ul { margin: 0; padding: 0; list-style: none; }

/* Header */
.cmp-header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 8px 16px;
    margin-bottom: 16px;
    padding-bottom: 14px;
    border-bottom: 1px dashed var(--cmp-border);
}
.cmp-station {
    font-size: 0.68rem;
    color: var(--cmp-muted);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-weight: 500;
}

/* Score confort */
.cmp-comfort-block {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 18px;
    padding: 0;
    background: transparent;
}
.cmp-comfort-circle {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--cmp-accent-soft) !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    line-height: 1;
}
.cmp-comfort-circle .score {
    font-family: 'Fraunces', Georgia, serif;
    font-size: 1.35rem;
    font-weight: 500;
    color: var(--cmp-text);
}
.cmp-comfort-circle .total {
    font-size: 0.6rem;
    color: var(--cmp-muted);
    font-weight: 500;
    margin-top: 1px;
}
.cmp-comfort-info { flex: 1; min-width: 0; }
.cmp-comfort-info h3 { display: none !important; }
.cmp-comfort-rating {
    display: inline-block;
    padding: 0;
    font-size: 0.65rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    background: transparent !important;
    color: var(--cmp-accent);
    margin: 0 0 2px;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.cmp-comfort-rating[data-rating="difficile"],
.cmp-comfort-rating[data-rating="tres_difficile"] { color: var(--cmp-warn); }
.cmp-comfort-rating[data-rating="mitige"]         { color: #B58B4C; }
.cmp-comfort-info p {
    color: var(--cmp-text-soft);
    font-size: 0.88rem;
    margin: 0;
    line-height: 1.45;
}

/* Conditions actuelles + 7 jours combinés */
.cmp-current {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 16px;
    padding: 12px 14px;
    background: var(--cmp-bg-soft);
    border-radius: 6px;
}
.cmp-current-temp {
    font-family: 'Fraunces', Georgia, serif;
    font-size: 1.8rem;
    font-weight: 400;
    color: var(--cmp-text);
    line-height: 1;
}
.cmp-current-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    font-size: 0.8rem;
    color: var(--cmp-muted);
}
.cmp-current-meta strong { color: var(--cmp-text); font-weight: 500; }

/* Forecast 7 jours */
.cmp-forecast {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
    margin-bottom: 0;
}
.cmp-forecast-day {
    background: var(--cmp-bg-soft);
    border: none;
    border-radius: 5px;
    padding: 8px 4px;
    text-align: center;
    font-size: 0.76rem;
}
.cmp-forecast-date {
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-size: 0.6rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--cmp-muted);
    font-weight: 500;
    margin-bottom: 4px;
}
.cmp-forecast-temp {
    font-family: 'Fraunces', Georgia, serif;
    font-size: 0.92rem;
    color: var(--cmp-text);
    margin: 2px 0;
    font-weight: 400;
    line-height: 1.1;
}
.cmp-forecast-temp .max { font-weight: 500; }
.cmp-forecast-temp .min { color: var(--cmp-muted); font-weight: 400; }
.cmp-forecast-cond {
    font-size: 0.65rem;
    color: var(--cmp-muted);
    margin: 3px 0;
    line-height: 1.2;
    min-height: 2.4em;
}
.cmp-forecast-pop {
    font-size: 0.6rem;
    color: var(--cmp-accent);
    font-weight: 500;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}

/* Conditions terrain */
.cmp-terrain {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    gap: 10px;
    margin-bottom: 0;
}
.cmp-terrain-card {
    padding: 10px 12px;
    border-radius: 5px;
    background: var(--cmp-bg-soft);
    border: none;
}
.cmp-terrain-label {
    font-size: 0.6rem;
    color: var(--cmp-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    font-weight: 500;
    margin-bottom: 3px;
}
.cmp-terrain-value {
    font-weight: 500;
    color: var(--cmp-text);
    font-size: 0.88rem;
}
.cmp-terrain-card[data-level="3"] .cmp-terrain-value,
.cmp-terrain-card[data-glissant="true"] .cmp-terrain-value { color: var(--cmp-warn); }
.cmp-terrain-card[data-level="2"] .cmp-terrain-value { color: #B58B4C; }

/* Équipement */
.cmp-equipment-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 14px 20px;
    margin-top: 8px;
}
.cmp-equipment-cat {
    background: transparent !important;
    border-radius: 0 !important;
    padding: 0 !important;
}
.cmp-equipment-cat h4 {
    margin: 0 0 6px !important;
    font-family: 'JetBrains Mono', ui-monospace, monospace !important;
    font-style: normal !important;
    font-size: 0.62rem !important;
    color: var(--cmp-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: 0.12em !important;
    font-weight: 500 !important;
}
.cmp-equipment-cat ul { padding: 0; list-style: none; margin: 0; }
.cmp-equipment-cat li {
    display: flex;
    gap: 6px;
    align-items: flex-start;
    margin: 3px 0;
    font-size: 0.83rem;
    color: var(--cmp-text-soft);
    font-weight: 400;
    line-height: 1.4;
}
.cmp-equipment-cat li[data-priority="critical"] { color: var(--cmp-warn); font-weight: 500; }
.cmp-equipment-cat li[data-priority="high"]     { color: var(--cmp-text); }
.cmp-equipment-cat li[data-priority="low"]      { color: var(--cmp-muted); }
.cmp-equipment-cat li > span:first-child {
    color: var(--cmp-accent);
    flex-shrink: 0;
    font-weight: 600;
    line-height: 1.4;
}

/* Texte SEO */
.cmp-seo-content {
    font-size: 0.88rem;
    color: var(--cmp-text-soft);
    line-height: 1.6;
    font-weight: 400;
}
.cmp-seo-content p { margin-bottom: 8px; }
.cmp-seo-content p:last-child { margin-bottom: 0; }

/* Source */
.cmp-source {
    margin-top: 16px;
    padding-top: 10px;
    border-top: 1px dashed var(--cmp-border);
    font-size: 0.65rem;
    color: var(--cmp-muted);
    text-align: left;
    font-family: 'JetBrains Mono', ui-monospace, monospace;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.cmp-source a {
    color: var(--cmp-muted);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}

/* État indispo */
.cmp-unavailable {
    padding: 12px 14px;
    background: #fdf3f0;
    border-left: 3px solid var(--cmp-warn);
    border-radius: 4px;
    color: var(--cmp-text-soft);
    font-size: 0.88rem;
}

/* Compact */
.cmp-widget--compact { padding: 16px 20px; max-width: 360px; }
.cmp-widget--compact .cmp-comfort-circle { width: 44px; height: 44px; }
.cmp-widget--compact .cmp-comfort-circle .score { font-size: 1rem; }
.cmp-widget--compact .cmp-forecast,
.cmp-widget--compact .cmp-equipment-grid,
.cmp-widget--compact .cmp-seo-content,
.cmp-widget--compact .cmp-current-meta { display: none; }
.cmp-widget--compact .cmp-terrain { grid-template-columns: 1fr 1fr; }

/* Responsive */
@media (max-width: 600px) {
    .cmp-widget { padding: 18px 16px; margin: 20px auto; }
    .cmp-current-temp { font-size: 1.5rem; }
    .cmp-forecast { grid-template-columns: repeat(7, 1fr); gap: 2px; }
    .cmp-forecast-cond { display: none; }
    .cmp-forecast-day { padding: 6px 2px; }
}