/* ==================================================================
   Presmile, finitions « premium » : uniquement visuel, aucun changement de comportement.
   Même charte (bleu nuit, citron, azur, crème, Bricolage Grotesque + Instrument Sans), plus de profondeur et de calme :
   bordures plus fines, ombres douces, titres plus affirmés, chiffres mis en valeur. Chargé après tous les autres CSS ;
   le retirer de index.html rend l'interface d'avant.
   ================================================================== */

:root, [data-theme="light"] {
  --border-subtle: #E2E6F0;
  --border-default: #AEB8D3;
  --hairline: rgba(18, 36, 92, .08);
  --ring: 0 0 0 1px rgba(18, 36, 92, .07);
  --shadow-sm: 0 1px 2px rgba(18, 36, 92, .05);
  --shadow-md: 0 1px 2px rgba(18, 36, 92, .04), 0 12px 28px -14px rgba(18, 36, 92, .22);
  --shadow-lg: 0 2px 6px rgba(18, 36, 92, .06), 0 32px 64px -28px rgba(18, 36, 92, .40);
  --radius-md: 11px;
  --radius-lg: 16px;
  --radius-xl: 22px;
  --row-hover: #F6F7FB;
}
[data-theme="dark"] {
  --hairline: rgba(255, 255, 255, .07);
  --ring: 0 0 0 1px rgba(255, 255, 255, .06);
  --row-hover: #1A2448;
}

body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; }
::selection { background: var(--brand-soft); color: var(--text-primary); }
* { scrollbar-width: thin; scrollbar-color: rgba(18, 36, 92, .18) transparent; }

/* ---------- Titres ---------- */
.title-1 { font: 700 32px/1.08 var(--font-display); letter-spacing: -0.035em; }
.title-2 { font-weight: 700; letter-spacing: -0.025em; }
.pm-page__head { margin-bottom: 4px; }
.pm-page__head .pm-muted { font-size: 15px; margin-top: 4px; }
.pm-card__title { font: 700 18px/1.25 var(--font-display); letter-spacing: -0.02em; }

/* ---------- Barre latérale ---------- */
.pm-sidebar { background: linear-gradient(180deg, #FFFFFF 0%, #FDFCF7 100%); border-right: 1px solid var(--hairline); padding: 22px 14px 16px; gap: 2px; }
[data-theme="dark"] .pm-sidebar { background: var(--surface-card); }
.pm-sidebar__brand { margin: 0 8px 14px; }
.pm-nav-item { min-height: 40px; font: 500 14.5px/1 var(--font-body); color: var(--text-secondary); border-radius: 10px; position: relative;
  transition: background var(--duration-fast) var(--ease-standard), color var(--duration-fast) var(--ease-standard); }
.pm-nav-item .pm-ic { opacity: .75; transition: opacity var(--duration-fast); }
.pm-nav-item:hover { background: rgba(18, 36, 92, .045); color: var(--text-primary); }
.pm-nav-item:hover .pm-ic { opacity: 1; }
.pm-nav-item[aria-current="page"] { background: var(--brand-soft); color: var(--text-primary); font-weight: 600; box-shadow: inset 0 0 0 1px rgba(178, 138, 0, .12); }
.pm-nav-item[aria-current="page"] .pm-ic { opacity: 1; }
.pm-sidebar__foot { border-top: 1px solid var(--hairline) !important; }
.gsearch__open { border-radius: 11px !important; border-color: var(--border-subtle) !important; background: var(--surface-page) !important; box-shadow: none !important; }
.gsearch__open:hover { border-color: var(--border-default) !important; }

/* ---------- Cartes ---------- */
.pm-card { border-color: transparent; border-radius: 18px; box-shadow: var(--ring), var(--shadow-sm); }
.pm-card--raised { box-shadow: var(--ring), var(--shadow-md); }
.pm-card--interactive { transition: transform var(--duration-base) var(--ease-standard), box-shadow var(--duration-base) var(--ease-standard); }
.pm-card--interactive:hover { border-color: transparent; transform: translateY(-2px); box-shadow: var(--ring), var(--shadow-md); }
.pm-card--error { border-color: var(--danger-border); }

/* Chiffres clés du tableau de bord et des statistiques */
.pm-stat { gap: 6px; }
.pm-stat__v { font: 700 34px/1 var(--font-display) !important; letter-spacing: -0.04em; font-variant-numeric: tabular-nums; }
.pm-stat__l { font-size: 13.5px; color: var(--text-secondary); line-height: 1.35; }

/* ---------- Boutons ---------- */
.pm-btn { border-radius: 12px; font-weight: 600; letter-spacing: -0.005em;
  transition: background var(--duration-fast) var(--ease-standard), border-color var(--duration-fast) var(--ease-standard),
              box-shadow var(--duration-fast) var(--ease-standard), transform var(--duration-fast) var(--ease-standard); }
.pm-btn:not(.pm-btn--secondary):not(.pm-btn--ghost):not(.pm-btn--danger):not(:disabled) {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .28), rgba(255, 255, 255, 0));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 1px 2px rgba(18, 36, 92, .14), 0 6px 14px -8px rgba(178, 138, 0, .55);
  border-color: rgba(18, 36, 92, .9);
}
.pm-btn:not(:disabled):active { transform: translateY(1px); }
.pm-btn--secondary { border-color: var(--border-subtle); box-shadow: var(--shadow-sm); }
.pm-btn--secondary:hover { border-color: var(--border-default); background: var(--surface-card); box-shadow: var(--shadow-md); }
.pm-btn--ghost:hover { background: rgba(18, 36, 92, .05); }
.pm-btn--danger { border-color: rgba(175, 31, 43, .35); }

/* ---------- Champs ---------- */
.pm-input, .pm-select, .pm-textarea { border-radius: 12px; border-color: var(--border-subtle); box-shadow: inset 0 1px 2px rgba(18, 36, 92, .04);
  transition: border-color var(--duration-fast) var(--ease-standard), box-shadow var(--duration-fast) var(--ease-standard); }
.pm-input:hover, .pm-select:hover, .pm-textarea:hover { border-color: var(--border-default); }
.pm-input:focus, .pm-select:focus, .pm-textarea:focus,
.pm-input:focus-visible, .pm-select:focus-visible, .pm-textarea:focus-visible {
  border-color: var(--focus-ring); box-shadow: 0 0 0 4px rgba(27, 63, 168, .12); outline: none; }
.pm-search .pm-input { border-radius: 999px; }
.pm-label { font-weight: 600; letter-spacing: -0.005em; }
.pm-hint { color: var(--text-secondary); opacity: .9; }

/* ---------- Tableaux ---------- */
.pm-table__wrap { border-color: transparent; border-radius: 18px; box-shadow: var(--ring), var(--shadow-sm); }
.pm-table th { font: 600 11.5px/16px var(--font-body); letter-spacing: .08em; color: var(--text-disabled); border-bottom: 1px solid var(--hairline);
  padding: 14px 16px; background: transparent; }
.pm-table td { padding: 14px 16px; border-bottom: 1px solid var(--hairline); }
.pm-table tbody tr:hover, .pm-table tbody tr.is-hover, .pm-table tbody tr:focus-within { background: var(--row-hover); }
.pm-table--stack tr { border-color: transparent; border-radius: 16px; box-shadow: var(--ring), var(--shadow-sm); }
.pm-table--stack tbody tr:hover { background: var(--surface-card); }

/* ---------- Onglets, filtres, segments ---------- */
.pm-tabs { border-bottom-color: var(--hairline); gap: 6px; }
.pm-tab { font-weight: 600; font-size: 14.5px; border-bottom-width: 2px; padding: 0 12px; }
.pm-tab:hover { background: none; color: var(--text-primary); }
.pm-tab[aria-selected="true"] { border-bottom-color: var(--text-primary); }
.pm-chip { border-color: var(--border-subtle); font-weight: 600; box-shadow: var(--shadow-sm); transition: border-color var(--duration-fast), background var(--duration-fast); }
.pm-chip:hover { border-color: var(--border-default); }
.pm-chip[aria-pressed="true"] { box-shadow: 0 6px 14px -8px rgba(18, 36, 92, .6); }
.pm-segments { border-color: transparent; background: rgba(18, 36, 92, .05); border-radius: 12px; }
.pm-segments button { border-radius: 9px; }

/* ---------- Badges, alertes, compteurs ---------- */
.pm-badge { border-radius: 999px; min-height: 26px; padding: 0 10px; font-size: 12.5px; letter-spacing: -0.005em; }
.pm-alert { border-color: transparent; border-radius: 14px; box-shadow: inset 0 0 0 1px rgba(18, 36, 92, .05); }
.pm-alert--danger { box-shadow: inset 0 0 0 1px rgba(175, 31, 43, .18); }
.pm-alert--warning { box-shadow: inset 0 0 0 1px rgba(178, 122, 12, .2); }
.pm-alert--success { box-shadow: inset 0 0 0 1px rgba(15, 107, 69, .16); }
.pm-count { box-shadow: 0 0 0 2px var(--surface-card); }

/* ---------- Fenêtres, notifications ---------- */
.pm-modal { border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); }
dialog.pm-modal::backdrop, dialog.pm-drawer::backdrop { background: rgba(13, 21, 48, .45); opacity: 1; backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
.pm-dialog__title { font-weight: 700; letter-spacing: -0.025em; }
.pm-dialog__foot { border-top-color: var(--hairline); }
.pm-toast { border-radius: 14px; border-color: transparent; box-shadow: var(--ring), var(--shadow-lg); }

/* ---------- Calendrier ---------- */
.pm-cal__dow { font-size: 11.5px; letter-spacing: .08em; color: var(--text-disabled); }
.pm-cal__day { border-radius: 12px; transition: background var(--duration-fast); }
.pm-cal__day--today { border-color: transparent; }
.pm-cal__day--today .pm-cal__daynum { display: inline-grid; place-items: center; min-width: 26px; height: 26px; padding: 0 6px; margin: -3px 0 0 -3px;
  border-radius: 999px; background: var(--text-primary); color: var(--surface-page); }
.pm-cal__day--selected { box-shadow: 0 10px 22px -12px rgba(18, 36, 92, .7); }

/* ---------- Téléphone : barre du bas translucide, bouton + ---------- */
.pm-tabbar { background: rgba(255, 255, 255, .86); backdrop-filter: saturate(1.6) blur(18px); -webkit-backdrop-filter: saturate(1.6) blur(18px);
  border-top: 1px solid var(--hairline); box-shadow: 0 -8px 24px -18px rgba(18, 36, 92, .35); }
[data-theme="dark"] .pm-tabbar { background: rgba(21, 31, 64, .86); }
.pm-tabbar a { font-weight: 600; }
.pm-fab { border-radius: 18px; border-color: rgba(18, 36, 92, .9);
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .3), rgba(255, 255, 255, 0));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .55), 0 14px 28px -12px rgba(18, 36, 92, .55); }

/* ---------- Tableau de bord (grille personnalisable) ---------- */
#dashGrid .grid-stack-item-content { border-radius: 18px; }

/* ---------- Accessibilité : rien ne bouge pour qui a réduit les animations ---------- */
@media (prefers-reduced-motion: reduce) {
  .pm-card--interactive:hover, .pm-btn:active { transform: none; }
}
