/* Better — Charte graphique officielle v1.0 */
:root {
  --clic-navy: #062D62;
  --clic-cyan: #00B8E4;
  --clic-green: #65C83F;
  --clic-teal: #00BFA5;
  --clic-white: #FFFFFF;
  --clic-bg: #F5F8FC;
  --clic-border: #E2E8F0;
  --clic-text: #172B4D;
  --clic-success: #15803D;
  --clic-danger: #DC2626;
  --clic-gradient-blue: linear-gradient(110deg, #062D62, #00B8E4);
  --clic-gradient-one: linear-gradient(110deg, #00B8E4, #00BFA5, #65C83F);
  --clic-radius: 12px;
  --clic-shadow: 0 8px 28px rgba(6,45,98,.08);
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--clic-bg); color: var(--clic-text); font-family: Inter, system-ui, sans-serif; }
h1,h2,h3,h4,h5,h6 { font-family: 'Plus Jakarta Sans', Inter, system-ui, sans-serif; color: var(--clic-navy); }
a { color: var(--clic-navy); }
a:hover { color: #08417D; }
.btn-clic-primary,.btn-brand { background: var(--clic-navy); color: white; border: 0; border-radius: var(--clic-radius); padding: .7rem 1.2rem; font-weight: 600; }
.btn-clic-primary:hover,.btn-brand:hover { background: #08417D; color: white; }
.clic-card,.q-card,.dashboard-card { background: white; border: 1px solid var(--clic-border); border-radius: var(--clic-radius); box-shadow: var(--clic-shadow); }
.clic-focus:focus-visible, :where(a,button,input,select,textarea):focus-visible { outline: 3px solid var(--clic-cyan); outline-offset: 2px; }
.form-control,.form-select { border-color: var(--clic-border); border-radius: 9px; min-height: 44px; }
.form-control:focus,.form-select:focus { border-color: var(--clic-cyan); box-shadow: 0 0 0 .2rem rgba(0,184,228,.14); }
.form-label { font-weight: 600; font-size: .91rem; }
.clic-navbar { position: sticky; top: 0; z-index: 1050; background: var(--clic-white); border-bottom: 1px solid var(--clic-border); box-shadow: 0 2px 12px rgba(6,45,98,.035); }
.clic-navbar-inner { min-height: 76px; padding: 10px 28px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.clic-brand { display: inline-flex; align-items: center; }
.clic-navbar-logo { display: block; width: auto; height: 50px; max-width: 210px; object-fit: contain; }
.clic-menu-toggle { display: none; background: #f1f6fb; border: 1px solid var(--clic-border); border-radius: 9px; width: 40px; height: 40px; color: var(--clic-navy); }
.clic-user-name { color: var(--clic-text); font-size: .9rem; font-weight: 600; }
.clic-avatar { width: 34px; height: 34px; display: grid; place-items: center; background: #e8f8fc; color: var(--clic-navy); border-radius: 50%; font-weight: 700; }
.clic-logout { border-radius: 9px; }
.clic-app-shell { display: flex; min-height: calc(100vh - 76px); }
.clic-sidebar { width: 252px; flex: 0 0 252px; background: #fff; border-right: 1px solid var(--clic-border); padding: 26px 14px 24px; display: flex; flex-direction: column; }
.clic-sidebar-label { color: #8390a6; font-size: .7rem; font-weight: 800; letter-spacing: .1em; padding: 0 14px 12px; }
.clic-side-link { display: flex; align-items: center; gap: 12px; padding: 13px 14px; margin: 2px 0; color: #49617e; text-decoration: none; border-radius: 10px; font-size: .9rem; font-weight: 600; }
.clic-side-link:hover { background: #f1f8fd; color: var(--clic-navy); }
.clic-side-link.active { background: #e8f7fc; color: var(--clic-navy); box-shadow: inset 3px 0 var(--clic-cyan); }
.clic-side-link.disabled { color: #9daabc; cursor: default; }
.clic-side-link small { margin-left: auto; font-size: .65rem; font-weight: 500; }
.clic-side-icon { font-size: 1.15rem; width: 20px; text-align: center; }
.clic-sidebar-bottom { margin-top: auto; padding: 20px 12px 0; color: #8c9ab0; font-size: .75rem; }
.clic-main-column { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.clic-content { width: 100%; max-width: 1480px; margin: 0 auto; padding: 34px 36px 48px; flex: 1; }
.clic-footer { padding: 16px 36px; border-top: 1px solid var(--clic-border); display: flex; justify-content: space-between; gap: 16px; color: #8a97aa; font-size: .76rem; }
.clic-page-heading { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 20px; margin-bottom: 30px; }
.clic-page-heading h1 { font-size: clamp(1.55rem, 2.5vw, 2rem); font-weight: 800; margin: 4px 0 10px; }
.clic-eyebrow { color: #048ab0; font-size: .72rem; font-weight: 800; letter-spacing: .11em; }
.clic-date-chip { padding: 10px 16px; background: white; border: 1px solid var(--clic-border); border-radius: 9px; font-size: .83rem; color: #63758f; }
.clic-module-card { display: flex; flex-direction: column; gap: 9px; min-height: 280px; }
.clic-module-card h2 { font-weight: 700; }
.clic-module-card p { font-size: .9rem; line-height: 1.6; }
.clic-module-kicker { color: #6b7e98; font-size: .73rem; font-weight: 700; }
.clic-module-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 12px; font-size: 1.4rem; }
.clic-module-icon.cyan { background: #e1f8fe; color: #0086a9; }
.clic-module-icon.green { background: #edfae9; color: #3c9d23; }
.clic-module-icon.teal { background: #e3faf5; color: #00967f; }
.clic-coming { background: #f0f3f7; color: #73839a; border-radius: 8px; padding: 7px 12px; font-size: .75rem; font-weight: 700; }
.q-pre { white-space: pre-wrap; overflow-wrap: anywhere; }
.table thead th { color: #63758f; background: #f9fbfd; font-size: .8rem; font-weight: 700; border-bottom-color: var(--clic-border); }
.table td { color: var(--clic-text); }
.clic-login-page { background: #fff; }
.clic-login-shell { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 46%) minmax(0, 54%); }
.clic-login-intro { background: var(--clic-gradient-blue); color: white; padding: 70px; position: relative; overflow: hidden; align-items: center; }
.clic-login-intro::after { content: ""; position: absolute; right: -110px; bottom: -160px; width: 440px; height: 440px; border: 70px solid rgba(255,255,255,.09); border-radius: 50%; }
.clic-login-intro-content { position: relative; z-index: 1; max-width: 470px; }
.clic-login-intro h1 { color: white; font-weight: 800; font-size: clamp(2.3rem, 4vw, 3.6rem); line-height: 1.17; margin: 18px 0 22px; }
.clic-login-intro .clic-eyebrow { color: #d6f5ff; }
.clic-login-lead { color: #e3f2fc; font-size: 1.04rem; line-height: 1.8; }
.clic-login-intro-bottom { margin-top: 90px; font-size: .84rem; color: #d6e8f4; }
.clic-login-symbol { display: flex; align-items: end; gap: 9px; height: 52px; }
.clic-login-symbol span { display: block; width: 12px; border-radius: 8px; background: var(--clic-green); }
.clic-login-symbol span:nth-child(1) { height: 28px; }
.clic-login-symbol span:nth-child(2) { height: 43px; background: var(--clic-teal); }
.clic-login-symbol span:nth-child(3) { height: 52px; background: var(--clic-cyan); }
.clic-login-form-panel { display: grid; place-items: center; padding: 35px; }
.clic-login-card { width: min(100%, 435px); }
.clic-login-logo { display: block; width: auto; max-width: min(100%, 260px); max-height: 110px; object-fit: contain; }
.clic-login-card h2 { font-size: 1.75rem; font-weight: 800; }
.clic-login-note { text-align: center; font-size: .75rem; color: #8492a5; margin-top: 34px; }
@media(max-width: 991.98px) {
  .clic-menu-toggle { display: inline-grid; place-items: center; }
  .clic-sidebar { position: fixed; top: 76px; bottom: 0; left: 0; z-index: 1040; transform: translateX(-100%); transition: transform .2s ease; box-shadow: 8px 0 24px rgba(6,45,98,.09); }
  .clic-sidebar-open .clic-sidebar { transform: translateX(0); }
  .clic-sidebar-backdrop:not([hidden]) { position: fixed; inset: 76px 0 0; z-index: 1030; display: block; background: rgba(6,45,98,.32); }
  .clic-content { padding: 26px 20px 38px; }
  .clic-footer { padding: 16px 20px; }
}
@media(max-width: 767.98px) {
  .clic-login-shell { display: block; }
  .clic-login-form-panel { min-height: 100vh; padding: 28px 22px; }
  .clic-navbar-inner { padding: 9px 15px; }
  .clic-navbar-logo { max-width: 540px; height: 84px; }
  .clic-logout { padding: 5px 8px; font-size: .75rem; }
  .clic-content { padding: 24px 15px; }
  .clic-footer { flex-direction: column; gap: 5px; }
  .q-card { padding: 1rem !important; }
}