/* AutoRelay Pro — finition visuelle non destructive
   Cette feuille ne change aucune route ni logique applicative. */

:root {
  --arp-radius-xs: 10px;
  --arp-radius-sm: 14px;
  --arp-radius-md: 18px;
  --arp-radius-lg: 24px;
  --arp-green: #10b981;
  --arp-green-bright: #25d366;
  --arp-blue: #3b82f6;
  --arp-focus: 0 0 0 4px rgba(16, 185, 129, .16);
  --arp-ease: cubic-bezier(.2, .75, .25, 1);
}

html {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body {
  overflow-x: hidden;
}

/* Titres et rythme vertical */
.ar-page-head {
  align-items: flex-end;
  gap: 1rem;
  margin-bottom: clamp(1.25rem, 2.5vw, 2rem);
}

.ar-page-title {
  max-width: 820px;
  text-wrap: balance;
  letter-spacing: -.035em;
  line-height: 1.06;
}

.ar-page-sub {
  max-width: 760px;
  margin-top: .55rem;
  line-height: 1.65;
  text-wrap: pretty;
}

.ar-qlabel {
  letter-spacing: .055em;
}

/* Cartes cohérentes sur les anciennes et nouvelles pages */
.ar-card-pro,
.ar-stat-tile,
.ar-navcard,
.premium-glass {
  isolation: isolate;
}

.ar-card-pro {
  border-radius: var(--arp-radius-md);
  box-shadow: 0 20px 55px rgba(0, 0, 0, .16);
  overflow: hidden;
}

.ar-card-pro__head {
  min-height: 62px;
  padding-inline: clamp(1rem, 2vw, 1.35rem);
}

.ar-card-pro__body {
  padding: clamp(1rem, 2.4vw, 1.5rem);
}

.ar-stat-tile {
  min-height: 126px;
  border-radius: var(--arp-radius-sm);
  transition: transform .22s var(--arp-ease), border-color .22s ease, box-shadow .22s ease;
}

@media (hover: hover) {
  .ar-stat-tile:hover,
  .ar-navcard:hover {
    transform: translateY(-3px);
    border-color: rgba(16, 185, 129, .28);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .18);
  }
}

.ar-navcard {
  min-height: 86px;
  border-radius: var(--arp-radius-sm);
}

.ar-source {
  min-height: 70px;
  border-radius: var(--arp-radius-sm);
  padding: .85rem 1rem;
}

.ar-source + .ar-source {
  margin-top: .35rem;
}

.ar-empty {
  padding: clamp(2rem, 6vw, 4rem) 1rem;
}

/* Champs et actions : mêmes dimensions partout */
.ar-label,
.form-label {
  margin-bottom: .48rem;
  line-height: 1.35;
}

.ar-input,
.ar-textarea,
.form-control,
.form-select {
  border-radius: var(--arp-radius-xs);
  transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.ar-input,
.form-control:not(textarea),
.form-select {
  min-height: 48px;
}

.ar-textarea,
textarea.form-control {
  line-height: 1.6;
  resize: vertical;
}

.ar-input:focus,
.ar-textarea:focus,
.form-control:focus,
.form-select:focus,
.ad-search:focus,
.ad-select-sm:focus {
  border-color: rgba(16, 185, 129, .62) !important;
  box-shadow: var(--arp-focus) !important;
  outline: none !important;
}

.ar-btn,
.btn,
.ad-btn {
  min-height: 44px;
  border-radius: var(--arp-radius-xs);
  font-weight: 700;
  letter-spacing: -.01em;
  transition: transform .18s var(--arp-ease), box-shadow .18s ease, border-color .18s ease, background-color .18s ease;
}

.ar-btn:focus-visible,
.btn:focus-visible,
.ad-btn:focus-visible,
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--arp-green-bright);
  outline-offset: 3px;
}

@media (hover: hover) {
  .ar-btn:hover,
  .btn:hover,
  .ad-btn:hover {
    transform: translateY(-1px);
  }
}

.ar-btn-gradient {
  box-shadow: 0 10px 26px rgba(16, 185, 129, .18);
}

.ar-alert {
  border-radius: var(--arp-radius-sm);
  line-height: 1.55;
}

.ar-drop {
  min-height: 152px;
  border-radius: var(--arp-radius-sm);
  transition: border-color .2s ease, background-color .2s ease, transform .2s var(--arp-ease);
}

@media (hover: hover) {
  .ar-drop:hover {
    transform: translateY(-2px);
    border-color: rgba(16, 185, 129, .42);
  }
}

/* Tableaux lisibles sans casser leurs colonnes */
.table-responsive,
.ad-table-wrap {
  border-radius: var(--arp-radius-sm);
  scrollbar-width: thin;
  -webkit-overflow-scrolling: touch;
}

.table > :not(caption) > * > * {
  padding: .9rem 1rem;
  vertical-align: middle;
}

.table thead th,
.ad-table th {
  white-space: nowrap;
  font-size: .72rem;
  letter-spacing: .045em;
  text-transform: uppercase;
}

/* Navigation interne */
.sidebar-menu .nav-link {
  min-height: 44px;
}

.sidebar-menu .nav-link span:first-of-type {
  line-height: 1.28;
}

.topbar {
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}

/* Pages publiques */
.pub-main {
  width: 100%;
}

.lg-card {
  box-shadow: 0 24px 70px rgba(0, 0, 0, .18);
}

.lp-nav {
  backdrop-filter: blur(18px) saturate(135%);
  -webkit-backdrop-filter: blur(18px) saturate(135%);
}

/* Admin : densité maîtrisée et meilleure navigation mobile */
.ad-main {
  max-width: 1680px;
}

.ad-page-title {
  letter-spacing: -.03em;
  text-wrap: balance;
}

.ad-kpi,
.ad-card,
.ad-client-card {
  border-radius: var(--arp-radius-sm);
  box-shadow: 0 14px 38px rgba(0, 0, 0, .12);
}

.ad-kpi {
  min-height: 94px;
}

.ad-client-head {
  min-height: 76px;
}

.ad-search,
.ad-select-sm {
  min-height: 44px;
  border-radius: var(--arp-radius-xs);
}

.ad-modal {
  border-radius: var(--arp-radius-md);
  box-shadow: 0 32px 90px rgba(0, 0, 0, .42);
}

/* Mobile : cartes respirantes et boutons faciles à toucher */
@media (max-width: 991.98px) {
  .main-wrapper main.flex-grow-1,
  .main-wrapper > main {
    padding-inline: 14px !important;
  }

  .ar-page-head {
    align-items: flex-start;
  }

  .ar-page-head > :last-child:not(:first-child) {
    max-width: 100%;
  }

  .ar-card-pro__head {
    min-height: 58px;
  }

  .ar-stat-tile {
    min-height: 112px;
  }

  .ar-source {
    align-items: flex-start !important;
  }

  .mobile-bottom-nav {
    margin-inline: 10px !important;
    width: calc(100% - 20px) !important;
  }
}

@media (max-width: 575.98px) {
  .ar-page-title {
    font-size: clamp(1.55rem, 8vw, 2rem);
  }

  .ar-page-sub {
    font-size: .84rem;
  }

  .ar-card-pro,
  .ar-stat-tile,
  .ar-navcard,
  .ar-source {
    border-radius: 14px;
  }

  .ar-card-pro__head {
    padding-inline: .9rem;
  }

  .ar-card-pro__body {
    padding: .95rem;
  }

  .ar-btn {
    justify-content: center;
  }

  .ar-page-head > .ar-btn,
  .ar-page-head > a.ar-btn {
    width: 100% !important;
  }

  .ar-source > .ar-btn,
  .ar-source > a.ar-btn {
    width: 100% !important;
    margin-top: .35rem;
  }

  .period-seg {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .period-seg a,
  .period-seg button,
  .period-seg span {
    width: 100%;
    justify-content: center;
  }

  .lg-card {
    padding: 1.15rem;
    border-radius: 16px;
  }

  .lp-nav .container > div {
    height: 64px !important;
  }

  .lp-nav .ar-btn {
    min-height: 40px;
    padding-inline: .72rem !important;
  }

  .ad-main {
    padding-bottom: calc(36px + env(safe-area-inset-bottom)) !important;
  }

  .ad-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 360px) {
  .ad-kpi-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Accessibilité et performances */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

@media print {
  .sidebar,
  .topbar,
  .mobile-header,
  .mobile-bottom-nav,
  .floating-help-trigger,
  .lp-nav,
  .lp-footer {
    display: none !important;
  }

  .main-wrapper {
    margin-left: 0 !important;
  }
}