/* ============================================================
   Thème « ocean » — identité visuelle complète (07/10)
   ============================================================ */
:root {
    --brand-primary: #2f86c8;
    --brand-light: #4da0dc;
    --brand-accent: #1c5f8f;
    --brand-btntext: #07263a;
    --brand-overlay-deep: rgba(9, 42, 66, .78);
    --brand-overlay-mid: rgba(9, 42, 66, .42);
    --brand-overlay-soft: rgba(9, 42, 66, .12);
    --brand-hero-sub: #d6ecfb;
}
/* — Bannière : photo héros + voile ocean — */
#header {
    background-image:
        linear-gradient(90deg, rgba(9, 42, 66, .82) 0%, rgba(9, 42, 66, .82) 30%, rgba(0,0,0,.18) 62%, rgba(9, 42, 66, .10) 100%),
        linear-gradient(180deg, rgba(0,0,0,.14) 0%, transparent 30%),
        url('../imgs-client/heroes/hero-ocean.jpg') !important;
    background-size: cover !important;
    background-position: center 38% !important;
    padding-top: 46px !important;
    padding-bottom: 44px !important;
    border-bottom: 3px solid var(--brand-accent) !important;
    box-shadow: inset 0 -18px 30px -18px rgba(0,0,0,.35) !important;
}
#label-client { color: #fff !important; text-shadow: 0 2px 12px rgba(0, 0, 0, .6) !important; }
#label-service { color: var(--brand-hero-sub) !important; text-shadow: 0 1px 8px rgba(0, 0, 0, .55) !important; }
#branding a:link, #branding a:visited { color: rgba(255,255,255,.92) !important; border-bottom-color: rgba(255,255,255,.45) !important; }

/* — Boutons : circulaire fluide — */
.default-button, button, input[type="submit"], input[type="button"] {
    border-radius: 999px !important;
    box-shadow: 0 3px 8px rgba(28, 95, 143, .30) !important;
}
a.cc-free { border-radius: 999px !important; }

/* — Calendrier : vagues bleues — en-têtes dégradés, cellules ciel — */
#calendar .calendar-date-row td { background: linear-gradient(180deg, #e7f3fb 0%, #ffffff 100%) !important; }
#calendar .calendar-date-row .day-label { color: #17567f !important; }
#calendar .calendar-cell.cc-free { box-shadow: inset 0 -3px 0 var(--brand-light), inset 0 0 0 1px #cde4f2 !important; background: #f6fbff !important; }
#calendar a.cc-free .cc-label { color: #14608f !important; }
.panel, .vamos-meteo-card { border-top: 4px solid var(--brand-primary) !important; border-radius: 14px !important; }
/* — Logo & respiration — */
#logo { margin-bottom: -30px !important; position: relative; z-index: 5; }
#content, #calendar-toolbar { margin-top: 28px !important; }
#calendar tr.cc-past .cc-label, #calendar .cc-past { opacity: .55; }