
:root{
  --bg:#ffffff; --fg:#0e1117; --card:#f6f8fa; --muted:#57606a; --border:#d0d7de; --primary:#b0a06c; --ok:#1a7f37; --warn:#bf8700; --err:#d1242f;
  --font-ui:"Segoe UI","Inter","Roboto","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{height:100%}
body{
  margin:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  background:var(--bg);
  color:var(--fg);
  font:15px/1.5 var(--font-ui);
}
input,select,textarea,button{
  font-family:var(--font-ui);
}
body>main{flex:1 0 auto}
.container{max-width:1320px;margin:0 auto;padding:16px 24px}
.app-header{background:var(--card);border-bottom:1px solid var(--border)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{display:flex;align-items:center;gap:12px}
.logo{width:36px;height:36px;border-radius:10px;background:var(--primary);display:grid;place-items:center;font-weight:800;color:#fff}
.brand-text strong{display:block}
.nav a,.nav span{margin-left:12px;color:var(--fg);text-decoration:none;opacity:.9}
.theme-toggle{margin-left:12px}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px;margin:16px 0}
.card-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.card-header--split{align-items:flex-start;gap:24px;flex-wrap:wrap}
.card-header__primary{flex:1 1 320px;min-width:260px}
.card-header__stats{flex:1 1 360px;min-width:260px;display:flex;flex-direction:column;gap:12px;align-items:stretch}
.modal-backdrop{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;background:rgba(14,17,23,0.55);z-index:1000;opacity:0;pointer-events:none;transition:opacity .2s ease}
.modal-backdrop.is-visible{opacity:1;pointer-events:auto}
.modal-backdrop.is-hidden{opacity:0;pointer-events:none}
.modal{background:var(--bg);color:var(--fg);border-radius:16px;border:1px solid var(--border);box-shadow:0 22px 45px rgba(15,23,42,0.22);max-width:480px;width:min(100%,480px);padding:24px;position:relative;outline:none}
.modal-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.modal-title{margin:0;font-size:1.35rem}
.modal-close{background:transparent;border:0;color:var(--muted);font-size:26px;line-height:1;cursor:pointer;padding:4px;border-radius:6px;transition:background .2s ease,color .2s ease}
.modal-close:hover{color:var(--fg);background:rgba(0,0,0,0.08)}
.modal-body{margin-bottom:24px;line-height:1.6;font-size:15px}
.modal-footer{display:flex;justify-content:flex-end;gap:12px}
.login-announcement-preview{border:1px solid var(--border);border-radius:14px;padding:18px;background:rgba(0,0,0,0.03)}
.login-announcement-preview__title{margin:0 0 8px 0;font-size:1.1rem}
.login-announcement-preview__body{line-height:1.6;word-break:break-word}
.login-announcement-role-card{padding:16px;display:flex;flex-direction:column;gap:12px}
.login-announcement-role-card__header{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.login-announcement-role-card__title{margin:0;font-size:1.05rem}
.login-announcement-role-card__toggle{margin-top:4px}
.login-announcement-role-card__message{min-height:200px;line-height:1.5;}
.card-header h2{margin:0;font-size:1.4rem}
.collapsible-actions{
  display:flex;
  justify-content:flex-end;
  margin:12px 0;
}
.collapsible-actions .btn{
  margin:0;
}
@media (max-width:600px){
  .collapsible-actions{
    justify-content:stretch;
  }
  .collapsible-actions .btn{
    width:100%;
  }
}
.grid{display:grid;gap:12px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.field-full{grid-column:1 / -1}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.field span{display:block;margin-bottom:6px;color:var(--muted);font-size:13px}
.input, select, textarea{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:transparent;color:var(--fg)}
.btn{
  --btn-fill: var(--primary);
  --btn-border: var(--btn-fill);
  --btn-text: #fff;
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 14px;
  height:36px;
  border-radius:10px;
  border:1px solid var(--btn-border);
  background-color:var(--btn-fill);
  color:var(--btn-text);
  font-weight:600;
  text-shadow:0 1px 0 rgba(0,0,0,0.28);
  text-decoration:none;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.18), inset 0 -1px 0 rgba(0,0,0,0.25), 0 6px 16px rgba(0,0,0,0.12);
  transition:box-shadow .25s ease, transform .25s ease;
  overflow:hidden;
}
.btn-icon{width:38px;min-width:38px;padding:0;gap:0}
.btn-icon .ico{margin-right:0}
.btn-small{
  height:32px;
  padding:0 12px;
  font-size:13px;
  border-radius:8px;
}

.btn:not(.btn-ghost){
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.38) 0%, rgba(255,255,255,0.18) 36%, rgba(255,255,255,0) 56%),
    linear-gradient(140deg, rgba(255,255,255,0.32) 0%, rgba(255,255,255,0.08) 44%, rgba(0,0,0,0.26) 100%);
  background-blend-mode:screen, normal;
}
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;width:100%;margin-bottom:12px}
.toolbar--filters{align-items:flex-end}
.toolbar--filters .toolbar-actions{flex:0 0 auto;gap:6px}
.toolbar--filters .grow{flex:1 1 220px;min-width:160px}
.toolbar--filters .w-sm{flex:0 1 160px;min-width:140px}
@media (min-width: 900px){
  .toolbar--filters{flex-wrap:nowrap}
  .toolbar--filters .grow{flex:1 1 0;min-width:0}
  .toolbar--filters .w-sm,
  .toolbar--filters select{flex:0 0 auto}
}
.table{width:100%;border-collapse:collapse}
.table th,.table td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left}
.table th{background:rgba(0,0,0,0.04)}
.table-wrap{
  width:100%;
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.card{max-width:100%}
.table th,
.table td{
  overflow-wrap:anywhere;
  word-break:break-word;
}
body[data-user-role="admin"] .table-wrap .table{
  width:100%;
  table-layout:fixed;
}
body[data-user-role="admin"] .table-wrap .table th,
body[data-user-role="admin"] .table-wrap .table td{
  white-space:normal;
}
.table td.bank-contract-number{
  font-weight:700;
}
.table td.bank-contract-points code{
  font-size:0.75em;
}
.table th.code-sap-col,
.table td.code-sap-col{
  text-align:left;
  white-space:nowrap;
  min-width:120px;
}

.table td.code-sap-col{
  font-weight:700;
}
.table th.prix-col,
.table td.prix-col{
  font-weight:700;
  text-align:right;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
}

.table tbody tr.row-create td{background:#e8f5e9;}
.table tbody tr.row-modify td{background:#fff5d6;}
.table tbody tr.row-delete td{background:#ffe5e5;}
.table th.actions-column,
.table td.actions-column{min-width:260px}
.table td.actions{justify-content:flex-end;flex-wrap:nowrap;white-space:nowrap}
@media (max-width:600px){
  .table td.actions{flex-wrap:wrap;white-space:normal}
}
.actions{display:flex;gap:8px;align-items:center}
.form-grid{align-items:end;margin-top:16px}
.form-grid .form-actions{align-self:flex-end}
.reconciliation-form-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
  justify-content:center;
  width:100%;
}
.reconciliation-site-control{
  display:flex;
  align-items:center;
  gap:8px;
}
.reconciliation-site-control select{
  flex:1 1 auto;
}
.reconciliation-site-control .btn{
  white-space:nowrap;
}
.daily-date-form{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.daily-date-form__label{font-weight:600}
.daily-date-form input[type=date]{min-width:180px}
@media (max-width:600px){
  .daily-date-form{width:100%;justify-content:flex-start}
  .daily-date-form input[type=date]{flex:1 1 160px;min-width:160px}
}
@media (max-width:600px){
  .reconciliation-site-control{
    flex-wrap:wrap;
    align-items:flex-start;
  }
  .reconciliation-site-control .btn{
    width:100%;
    justify-content:center;
  }
}
.flashes .flash{padding:10px;border-left:4px solid var(--primary);margin:10px 0;border-radius:8px;background:rgba(0,0,0,0.02)}
.flash.success{border-color:var(--ok)}.flash.danger{border-color:var(--err)}.flash.warning{border-color:var(--warn)}.flash.info{border-color:var(--primary)}
.chips{display:flex;gap:6px;flex-wrap:wrap}
.chip{background:rgba(0,0,0,0.05);border:1px solid var(--border);border-radius:999px;padding:4px 10px;font-size:12px}
.row{display:grid;grid-template-columns:100px 1fr 180px 120px 1fr 1fr auto;gap:8px;align-items:center}
@media (max-width:900px){
  .grid-2{grid-template-columns:1fr}
  .grid-3{grid-template-columns:1fr}
  .form-grid{align-items:stretch}
  .form-grid .form-actions{align-self:auto}
  .row{grid-template-columns:1fr 1fr 1fr 1fr 1fr 1fr auto}
  .table th,
  .table td{
    padding:7px 8px;
    font-size:13px;
  }
  .toolbar .grow,
  .toolbar .w-sm{
    min-width:0;
  }
  .table th[style*="width"],
  .table td[style*="width"]{
    width:auto !important;
  }
  body[data-user-role="admin"] .table-wrap .table{
    table-layout:auto;
  }
}
.checkbox-group{
  border:1px solid var(--border);
  border-radius:10px;
  padding:12px;
  display:grid;
  gap:8px 16px;
  background:rgba(0,0,0,0.02);
}
.checkbox-group.has-options{grid-template-columns:repeat(2,minmax(0,1fr));}
.checkbox-group.is-empty{
  display:block;
  border:none;
  border-radius:0;
  padding:4px 0 0;
  background:transparent;
}
.checkbox-group .checkbox{
  display:flex;
  gap:8px;
  align-items:flex-start;
  padding:6px 8px;
  border-radius:8px;
  transition:background .2s ease;
}
.checkbox-group .checkbox:hover{background:rgba(0,0,0,0.04);}
.checkbox-group .checkbox input{margin-top:4px;}
@media (max-width:900px){
  .checkbox-group.has-options{grid-template-columns:1fr;}
}
.role-checkbox-grid{
  display:grid;
  gap:8px;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
}
.role-checkbox-grid .checkbox{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(0,0,0,0.02);
  cursor:pointer;
  transition:border-color .2s ease, box-shadow .2s ease;
}
.role-checkbox-grid .checkbox input{margin:0;}
.role-checkbox-grid .checkbox[data-active="1"]{
  border-color:var(--primary);
  box-shadow:0 0 0 1px rgba(176,160,108,0.35);
}
.status-badge{
  margin-left:auto;
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
  background:rgba(0,0,0,0.06);
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:0.04em;
  white-space:nowrap;
}
.status-badge--success{
  background:rgba(26,127,55,0.15);
  color:var(--ok);
}
.status-badge--danger{
  background:rgba(209,36,47,0.15);
  color:var(--err);
}
.status-badge--muted{
  background:rgba(0,0,0,0.04);
  color:var(--muted);
}
.role-activation-form{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.role-activation-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}
.role-activation-list .toggle{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(0,0,0,0.02);
}
.role-activation-list .toggle input{margin:0;}
.toggle__label{flex:1 1 auto;}
.role-activation-list .toggle input:disabled + .toggle__label{color:var(--muted);}
@media (max-width:600px){
  .role-checkbox-grid{grid-template-columns:1fr;}
  .role-activation-list{gap:8px;}
}
.caisse-import__form .field-actions{
  margin-top:8px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.caisse-import__form .field-actions .btn{
  margin:0;
}
.form-errors{
  margin:16px 0;
  padding:14px 16px;
  border-radius:10px;
  border:1px solid rgba(220,38,38,0.4);
  background:rgba(220,38,38,0.08);
  color:var(--err);
}
.form-errors ul{margin:8px 0 0 18px; padding:0;}
.form-errors li{margin-bottom:4px;}
.form-footer{
  margin-top:24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}
.form-footer .actions{margin-left:auto;}
.footer{
  position:relative;
  margin-top:56px;
  background:#12171e;
  color:#efe9d8;
  text-align:center;
  overflow:hidden;
  --footer-crest-clear:172px;
}
.footer__seam{
  position:relative;
  height:120px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
  z-index:1;
}
.footer__seam::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,#ffffff 0%,#ffffff 50%,#12171e 50%,#12171e 100%);
  pointer-events:none;
  z-index:-2;
}
.footer__seam::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0.55) 0%,
      rgba(255,255,255,0.55) calc(50% - var(--footer-crest-clear) / 2),
      transparent calc(50% - var(--footer-crest-clear) / 2),
      transparent calc(50% + var(--footer-crest-clear) / 2),
      rgba(255,255,255,0.55) calc(50% + var(--footer-crest-clear) / 2),
      rgba(255,255,255,0.55) 100%
    );
  transform:translateY(-0.5px);
  z-index:3;
}
.footer__crest{
  position:relative;
  display:inline-flex;
  pointer-events:auto;
  z-index:2;
}
.footer__crest img{
  display:block;
  height:auto;
}
.footer__body{
  position:relative;
  z-index:1;
  padding:0px 24px 32px;
  background:#12171e;
}
.footer__content{
  max-width:1320px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:0px;
  font-size:14px;
}
.footer__content small{
  color:rgba(233,228,213,0.8);
  letter-spacing:0.05em;
}
.footer .footer-version{
  display:block;
  margin-top:6px;
  font-size:13px;
  color:rgba(233,228,213,0.62);
  letter-spacing:0.08em;
  text-transform:uppercase;
}
@media (max-width:900px){
  .footer__seam{
    height:112px;
  }
  .footer__body{
    padding:52px 20px 32px;
  }
}
@media (max-width:600px){
  .footer{
    margin-top:40px;
    --footer-crest-clear:120px;
  }
  .footer__seam{
    height:72px;
  }
  .footer__seam::before{
    background:linear-gradient(180deg,#ffffff 0%,#ffffff 56%,#12171e 56%,#12171e 100%);
  }
  .footer__seam::after{
    top:56%;
  }
  .footer__crest img{
    width:min(52vw,150px);
    height:auto;
  }
  .footer__body{
    padding:20px 16px 24px;
  }
  .footer__content{
    gap:4px;
  }
  .footer__content small{
    max-width:100%;
    font-size:12px;
    line-height:1.45;
    letter-spacing:0.02em;
  }
}
a.link, .link{color:var(--primary);text-decoration:none}

.caisse-import{
  display:flex;
  flex-direction:column;
  gap:24px;
  margin:16px 0;
}
.caisse-import .card{margin:0;}
.caisse-import__file-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:20px;
}
.caisse-import__file-field{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:16px;
  padding:24px 26px;
  border-radius:18px;
  border:1px solid rgba(176,160,108,0.32);
  background:linear-gradient(180deg, rgba(176,160,108,0.16) 0%, rgba(176,160,108,0.06) 100%);
  box-shadow:0 10px 26px rgba(0,0,0,0.08);
}
.caisse-import__file-field .field-label{
  display:flex;
  align-items:center;
  gap:12px;
  margin:0;
  color:var(--fg);
  font-weight:600;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:0.02em;
}
.caisse-import__file-field .field-step{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--primary);
  color:#fff;
  font-weight:700;
  font-size:16px;
  box-shadow:0 6px 16px rgba(0,0,0,0.18);
}
.caisse-import__file-field .field-title{
  flex:1;
}
.caisse-import__file-field input[type="file"]{
  padding:18px 22px;
  border-radius:14px;
  border:1px dashed rgba(176,160,108,0.6);
  background:rgba(255,255,255,0.9);
  color:var(--fg);
  font-weight:500;
  min-height:120px;
  transition:border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
.caisse-import__file-field input[type="file"]:focus-visible{
  outline:none;
  border-color:var(--primary);
  box-shadow:0 0 0 4px rgba(176,160,108,0.28);
  background:rgba(176,160,108,0.16);
}
.caisse-import__file-field input[type="file"]::file-selector-button,
.caisse-import__file-field input[type="file"]::-webkit-file-upload-button{
  margin-right:20px;
  padding:12px 24px;
  border:0;
  border-radius:10px;
  background:var(--primary);
  color:#fff;
  font-weight:700;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:0.04em;
  cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.24), inset 0 -1px 0 rgba(0,0,0,0.22), 0 10px 24px rgba(0,0,0,0.18);
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease;
}
.caisse-import__file-field input[type="file"]:hover::file-selector-button,
.caisse-import__file-field input[type="file"]:hover::-webkit-file-upload-button{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.28), inset 0 -1px 0 rgba(0,0,0,0.24), 0 12px 28px rgba(0,0,0,0.22);
}
.caisse-import__file-field input[type="file"]:active::file-selector-button,
.caisse-import__file-field input[type="file"]:active::-webkit-file-upload-button{
  transform:translateY(0);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.16), inset 0 -1px 0 rgba(0,0,0,0.20), 0 6px 16px rgba(0,0,0,0.18);
}
.caisse-import__file-field small{
  display:block;
}
.caisse-import__file-field .hint{
  color:var(--muted);
}
.caisse-guide__header h2{
  margin:0 0 6px;
}
.caisse-guide__list{
  margin:16px 0 0;
  padding:0;
  list-style:none;
  counter-reset:caisse-guide-step;
  column-count:2;
  column-gap:28px;
}
.caisse-guide__list li{
  position:relative;
  counter-increment:caisse-guide-step;
  break-inside:avoid;
  padding-left:48px;
  margin-bottom:18px;
  font-weight:500;
}
.caisse-guide__list li::before{
  content:counter(caisse-guide-step);
  position:absolute;
  left:0;
  top:0;
  display:grid;
  place-items:center;
  width:32px;
  height:32px;
  border-radius:999px;
  background:var(--primary);
  color:#fff;
  font-weight:700;
  font-size:16px;
  box-shadow:0 4px 12px rgba(0,0,0,0.18);
}
@media (max-width:900px){
  .caisse-guide__list{
    column-count:1;
  }
  .caisse-import__file-grid{
    grid-template-columns:1fr;
  }
}
.table--report tbody tr.subtotal td{
  font-weight:600;
  background:rgba(0,0,0,0.03);
}
.table--report tbody tr.table-separator td{
  padding:0;
  height:2px;
  background:#b0a06c;
  border:0;
}
.table--report tfoot th{
  text-align:right;
  font-size:1.05rem;
}
.table--report tfoot th.prix-col{
  font-weight:700;
}

.table--report td.table-cell--difference,
.table--report th.table-cell--difference,
.table td.table-cell--difference,
.table th.table-cell--difference{
  color:var(--err);
  font-weight:600;
}

.table--report td.table-cell--difference-positive,
.table--report th.table-cell--difference-positive,
.table td.table-cell--difference-positive,
.table th.table-cell--difference-positive{
  color:#0969da;
  font-weight:600;
}

.table--report td.table-cell--difference-zero,
.table--report th.table-cell--difference-zero,
.table td.table-cell--difference-zero,
.table th.table-cell--difference-zero{
  color:var(--ok);
  font-weight:600;
}

.table--report .balance-difference,
.table .balance-difference{
  font-weight:600;
  font-variant-numeric:tabular-nums;
  font-feature-settings:"tnum";
}

.table--report .balance-difference strong,
.table .balance-difference strong{
  font-weight:700;
  margin-right:0.1em;
}

.table--report .balance-difference--positive,
.table .balance-difference--positive{
  color:#0969da;
}

.table--report .balance-difference--zero,
.table .balance-difference--zero{
  color:var(--ok);
}

.table--report .balance-difference--negative,
.table .balance-difference--negative{
  color:var(--err);
}

table[data-sortable-table] th.is-sortable{
  cursor:pointer;
  user-select:none;
  position:relative;
}

table[data-sortable-table] th.is-sortable::after{
  content:'\21C5';
  font-size:0.7em;
  margin-left:0.35rem;
  opacity:0.5;
}

table[data-sortable-table] th.is-sortable[data-sort-direction="asc"]::after{
  content:'\25B2';
  opacity:0.9;
}

table[data-sortable-table] th.is-sortable[data-sort-direction="desc"]::after{
  content:'\25BC';
  opacity:0.9;
}

.report-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:16px;
  margin:24px 0;
  overflow:hidden;
  box-shadow:0 12px 32px rgba(15,23,42,0.08);
}

.report-card__header{
  background:linear-gradient(180deg, rgba(255,255,255,0.8) 0%, rgba(244,246,249,1) 100%);
  padding:24px 28px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.report-detail-page .report-card--summary .report-card__header{
  position:relative;
}

.report-card__logo{
  position:absolute;
  top:24px;
  right:28px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
}

.report-card__logo img{
  width:auto;
  height:auto;
  max-width:none;
  max-height:none;
  object-fit:initial;
}

.report-card__title h2{
  margin:0;
  font-size:1.6rem;
  color:var(--fg);
}

.report-card__title .muted{
  margin-top:6px;
  font-size:0.95rem;
}

.report-card__meta .meta-grid{
  display:flex;
  gap:16px;
  flex-wrap:wrap;
}

.meta-item{
  flex:1 1 220px;
  min-width:200px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:16px 18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.4);
}

.meta-label{
  display:block;
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:0.08em;
  color:var(--muted);
  margin-bottom:6px;
}

.meta-value{
  display:block;
  font-size:1.2rem;
  font-weight:700;
  color:var(--fg);
}

.report-card__body{
  padding:28px;
  background:#fff;
}

.report-card__collapsible{
  border:0;
}

.report-card__collapsible-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  list-style:none;
}

.report-card__collapsible-summary::-webkit-details-marker{display:none;}

.report-card__collapsible-summary h3{
  margin:0;
  font-size:1.1rem;
}

.report-card__collapsible-summary::after{
  content:"";
  display:inline-block;
  width:10px;
  height:10px;
  border-right:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
  transition:transform 0.2s ease;
}

.report-card__collapsible[open] .report-card__collapsible-summary{
  margin-bottom:16px;
}

.report-card__collapsible[open] .report-card__collapsible-summary::after{
  transform:rotate(-135deg);
}

.report-card__collapsible-content{
  display:block;
}

.report-card__body .report-table{
  width:100%;
  border-collapse:collapse;
  box-shadow:0 1px 0 rgba(15,23,42,0.08);
}

.report-detail-page .report-card__body .report-table{
  width:1214px;
  table-layout:auto;
}

.report-card__body .report-table th,
.report-card__body .report-table td{
  padding:14px 18px;
  border:1px solid rgba(15,23,42,0.08);
  text-align:left;
}

.report-card__body .report-table th{
  background:rgba(15,23,42,0.04);
  text-transform:uppercase;
  font-size:0.8rem;
  letter-spacing:0.08em;
}

.report-card__body .report-table td.prix-col{
  font-weight:700;
  text-align:right;
  font-variant-numeric:tabular-nums;
}

.report-card__body .report-table tr.subtotal td{
  background:rgba(15,23,42,0.06);
}

.report-card__body--point-groups{
  display:grid;
  gap:24px;
}

.report-point-block{
  background:#fff;
  border:1px solid rgba(15,23,42,0.1);
  border-radius:12px;
  padding:20px;
  box-shadow:0 1px 0 rgba(15,23,42,0.05);
}

.report-point-block__header{
  display:flex;
  flex-wrap:wrap;
  justify-content:space-between;
  align-items:flex-end;
  gap:12px;
  margin-bottom:16px;
}

.report-point-block__title-wrapper{
  min-width:200px;
}

.report-point-block__title{
  margin:0;
  font-size:1.15rem;
}

.report-point-block__subtitle{
  margin:4px 0 0;
  font-size:0.85rem;
}

.report-point-block__totals{
  text-align:right;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.report-point-block__totals strong{
  font-size:1.1rem;
}

.report-point-block__table{
  margin-top:8px;
}


/* Status chips */
.chip-status{
  font-weight:600;
  white-space:nowrap;
}
.chip-status.ouvert{background:#e8f5e9;color:#256029;border:1px solid #b7dfb9}
.chip-status.pour-validation{background:#e3f2fd;color:#0d47a1;border:1px solid #90caf9}
.chip-status.en-cours{background:#fff8e1;color:#7a4d00;border:1px solid #ffe39c}
.chip-status.clos{background:#ffebee;color:#b71c1c;border:1px solid #ffcdd2}
.chip-status.en-production{background:#e8f5e9;color:#256029;border:1px solid #b7dfb9}
.chip-status.hors-service{background:#ffebee;color:#b71c1c;border:1px solid #ffcdd2}
.chip-status.en-stock{background:#e3f2fd;color:#0d47a1;border:1px solid #90caf9}
.chip-status.chez-fournisseur{background:#fff8e1;color:#7a4d00;border:1px solid #ffe39c}


/* Top nav buttons */
.header-actions .btn-nav{
  padding:6px 10px;
  border-radius: 999px;
  background: var(--panel);
  border: 1px solid var(--line);
  font-weight: 600;
}
.header-actions .btn-nav:hover{
  background: var(--bg);
}

/* One-line toolbar */
.toolbar{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  width:100%;
  margin-bottom:12px;
}
.toolbar .grow{ flex:1 1 240px; min-width:180px; }
.toolbar .w-sm{ flex:0 1 200px; min-width:150px; }
.toolbar .btn{ flex:0 0 auto; }

/* Make inputs shorter to fit on one line comfortably */
.input{
  height: 38px;
}

/* Table container keeps horizontal padding tight */
.table-wrap{ overflow:auto; }



/* Inline SVG icons */
.btn .ico, .btn-nav .ico {
  width:16px; height:16px; margin-right:6px; vertical-align:-2px;
}
.btn-ghost .ico { opacity:.8; }

/* Ghost button style */
.btn-ghost{
  --btn-fill: transparent;
  --btn-border: var(--primary);
  --btn-text: var(--primary);
  background:none;
  color:var(--btn-text);
  box-shadow:none;
  text-shadow:none;
}
.btn-ghost:hover{
  box-shadow:0 0 0 1px rgba(0,0,0,0.12);
  box-shadow:0 0 0 1px color-mix(in srgb, currentColor 35%, transparent);
}

/* Primary button */
.btn-primary{
  --btn-fill: var(--accent, var(--primary));
  --btn-border: var(--accent, var(--primary));
  --btn-text: #fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.25), 0 6px 18px rgba(0,0,0,0.18);
  text-shadow:0 1px 0 rgba(0,0,0,0.32);
}
.btn-primary:hover{
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.24), inset 0 -1px 0 rgba(0,0,0,0.32), 0 10px 22px rgba(0,0,0,0.22);
}

.table tr.row-click:hover{background:rgba(0,0,0,0.04)}

/* Hide 'Ouvrir' column (header + cells) */
.table-list th:last-child, .table-list td:last-child{ display:none; }

/* Clickable header sorting */
.th-sort { text-decoration: none; color: inherit; }
.th-sort:hover { text-decoration: underline; }

/* Date souhaitée dépassée */
.expired { color: red; font-weight: bold; }
.due-today { color: #1e88e5; font-weight: bold; }


/* --- Brand logo image overrides --- */
.brand .logo{ background: transparent !important; padding: 0; display: grid; place-items: center; }
.brand .logo img{ width: 36px; height: 36px; display: block; object-fit: contain; }


/* Primary brand override */
.article-actions{
  display:flex;
  gap:12px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:12px;
}

.btn:not(.btn-ghost)::before{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:radial-gradient(130% 180% at 50% -45%, rgba(255,255,255,0.65) 0%, rgba(255,255,255,0) 55%);
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}

.btn:not(.btn-ghost)::after{
  content:"";
  position:absolute;
  top:-30%;
  left:-65%;
  width:45%;
  height:170%;
  background:linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.75) 48%, rgba(255,255,255,0) 100%);
  transform:translateX(-130%) skewX(-20deg);
  transition:transform .6s ease;
  pointer-events:none;
  opacity:.9;
  mix-blend-mode:screen;
}

.btn:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.24), inset 0 -1px 0 rgba(0,0,0,0.32), 0 10px 20px rgba(0,0,0,0.2);
}
.btn:not(.btn-ghost):hover::before,
.btn:not(.btn-ghost):focus-visible::before{
  opacity:1;
}
.btn:not(.btn-ghost):hover::after,
.btn:not(.btn-ghost):focus-visible::after{
  transform:translateX(230%) skewX(-20deg);
}
.btn:focus-visible{
  outline:2px solid rgba(255,255,255,0.65);
  outline-offset:2px;
}
.btn.btn-ghost:hover{
  box-shadow:0 0 0 1px rgba(0,0,0,0.12);
  box-shadow:0 0 0 1px color-mix(in srgb, currentColor 35%, transparent);
}
.btn:active{
  transform:translateY(0);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.2), inset 0 -1px 0 rgba(0,0,0,0.35), 0 4px 10px rgba(0,0,0,0.18);
}
a.btn{ color:var(--btn-text); }

.btn-ok{
  --btn-fill: var(--ok);
  --btn-border: var(--ok);
  --btn-text: #fff;
}

.btn-danger{
  --btn-fill: var(--err);
  --btn-border: var(--err);
  --btn-text: #fff;
}

.btn-ghost.btn-danger{
  --btn-fill: transparent;
  --btn-border: var(--err);
  --btn-text: var(--err);
}

.pdv-list{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.pdv-list > *{
  display:block;
}

/* Button icon spacing */
.btn .icon{display:inline-block}


/* --- Layout: keep filter buttons on same line --- */
.toolbar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;width:100%;margin-bottom:12px}
.toolbar .actions{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;flex:0 0 auto}
.ml-auto{margin-left:auto}
/* Ensure consistent button typography (anchor vs button) */
.btn, a.btn, button.btn{font-family:inherit;font-size:1rem;line-height:1.2;vertical-align:middle}
/* Icons aligned */
.btn .icon{width:18px;height:18px;display:inline-block;vertical-align:middle}
/* Keep forms inline inside actions row */
.actions form{display:inline}
/* Optional: ensure buttons row aligns nicely */
.buttons-row{margin-top:12px}

.site-card__header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.site-card__title{
  margin:0 0 4px;
  display:flex;
  align-items:center;
  gap:8px;
  cursor:pointer;
  user-select:none;
  border-radius:4px;
}
.site-card__title::before{
  content:'▾';
  font-size:0.9em;
  transition:transform 0.2s ease;
}
.site-card.is-collapsed .site-card__title::before{
  transform:rotate(-90deg);
}
.site-card__title:focus-visible{
  outline:2px solid var(--primary);
  outline-offset:2px;
}
.site-card__header-actions{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}
.site-card__content{margin-top:16px;}
.site-card.is-collapsed .site-card__content{display:none;}

.footer small{ color: var(--primary); }

form.toolbar{ display:flex !important; width:100% !important; flex-wrap:wrap !important; }
form.toolbar .actions{ margin-left:auto; }
@media (max-width: 900px){
  .toolbar .actions,
  form.toolbar .actions{ width:100%; margin-left:0; justify-content:flex-end; flex:1 0 100%; }
}

form.toolbar + .card{ display:block; width:100%; margin-top:12px }

.eyebrow{
  font-size:12px;
  font-weight:600;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  margin:0 0 6px;
}

.stat-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:12px;
  align-items:stretch;
}

.stat-grid--main{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
.stat-grid--roles{grid-template-columns:repeat(auto-fit,minmax(180px,1fr))}

.stat{
  background:rgba(0,0,0,0.04);
  border:1px solid var(--border);
  border-radius:12px;
  padding:10px 14px;
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:110px;
  align-items:center;
  text-align:center;
}

.stat strong{font-size:1.2rem;line-height:1}
.stat-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}
.stat-value{display:flex;flex-direction:column;gap:4px;align-items:center}
.card-header__primary > .stat-grid{margin-top:16px}
.stat-sub{font-size:13px;color:var(--muted);font-weight:500}

.admin-users-form{
  display:grid;
  grid-template-columns:minmax(200px,1.4fr) minmax(240px,1.6fr) minmax(220px,1.6fr) minmax(160px,1fr) auto;
  gap:16px;
  align-items:end;
  margin:16px 0 12px;
}

.admin-users-form__field{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}

.admin-users-form__field .input,
.admin-users-form__field select{
  width:100%;
}

.admin-users-form__field--role select{
  min-width:0;
}

.admin-users-form__actions{
  align-self:end;
  justify-self:end;
  display:flex;
}

.admin-users-list{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.user-card{
  background:#fff;
  border:1px solid var(--border);
  border-radius:12px;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:16px;
  box-shadow:0 1px 2px rgba(16,24,40,0.04);
}

.user-card.is-inactive{
  border-color:rgba(191,135,0,0.4);
  background:rgba(191,135,0,0.05);
}

.user-card__header{
  display:flex;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
}

.user-card__identity{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.user-card__name{
  font-size:1.05rem;
  font-weight:600;
}

.user-card__email{
  font-size:13px;
  color:var(--muted);
}

.user-card__role{
  font-size:13px;
  font-weight:600;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.04em;
}

.user-card__meta{
  display:flex;
  flex-direction:column;
  gap:6px;
  align-items:flex-end;
  text-align:right;
}

.user-card__created{font-size:13px;}

.user-card__content{
  display:grid;
  grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);
  gap:16px;
  align-items:flex-start;
}

.user-card__info{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.user-card__notice{
  margin:0;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(249,115,22,0.4);
  background:rgba(249,115,22,0.1);
  color:#8a2c0d;
  font-size:13px;
  font-weight:600;
}

.user-card__identity-form{display:flex;flex-direction:column;gap:10px;}
.user-card__identity-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;}
.user-card__identity-actions{display:flex;justify-content:flex-start;}
.user-card__role-form{margin:0;}

.user-card__role-select{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
}

.user-card__role-select .role-select{
  min-width:200px;
  flex:1 1 200px;
}

.user-card__role-select .btn{flex:0 0 auto;}

.user-card__sites{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.user-card__actions{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.user-card__action-form .btn{width:100%;}

.site-access__option--all{
  border-bottom:1px solid var(--border);
  padding-bottom:8px;
  margin-bottom:4px;
}

.site-access__option--all .site-access__name{font-weight:600;}

@media (max-width:900px){
  .user-card__content{grid-template-columns:minmax(0,1fr);}
  .user-card__meta{
    align-items:flex-start;
    text-align:left;
  }
}

@media (max-width:600px){
  .user-card{
    padding:14px;
  }
  .user-card__role-select{
    flex-direction:column;
    align-items:stretch;
  }
  .user-card__role-select .role-select{
    flex:1 1 auto;
    width:100%;
  }
  .user-card__role-select .btn{
    width:100%;
  }
  .user-card__actions{
    gap:6px;
  }
}

@media (max-width:1200px){
  .admin-users-form{
    grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) minmax(220px,1fr);
  }
  .admin-users-form__actions{
    grid-column:1 / -1;
  }
}

@media (max-width:900px){
  .admin-users-form{
    grid-template-columns:minmax(220px,1fr) minmax(220px,1fr);
  }
}

@media (max-width:640px){
  .admin-users-form{
    grid-template-columns:minmax(0,1fr);
  }
  .admin-users-form__actions{
    justify-self:stretch;
  }
  .admin-users-form__actions .btn{
    width:100%;
  }
}

.toolbar-label{
  font-size:12px;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--muted);
}

.toolbar-actions{flex:0 0 auto}

.badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:4px 10px;
  border-radius:999px;
  font-size:13px;
  font-weight:600;
  border:1px solid transparent;
}

.badge::before{
  content:"";
  display:block;
  width:8px;
  height:8px;
  border-radius:50%;
}

.badge-active{
  background:rgba(26,127,55,0.12);
  color:#1a7f37;
  border-color:rgba(26,127,55,0.25);
}

.badge-active::before{background:#1a7f37}

.badge-inactive{
  background:rgba(191,135,0,0.12);
  color:#915f00;
  border-color:rgba(191,135,0,0.2);
}

.badge-inactive::before{background:#bf8700}

.badge-site{
  background:rgba(11,94,215,0.12);
  color:#0b5ed7;
  border-color:rgba(11,94,215,0.28);
}

.badge-site::before{background:#0b5ed7}

.user-sites{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:8px;
}

.user-sites__empty{
  display:block;
  margin-top:8px;
  font-size:13px;
}

.site-access-form{width:100%;}

.site-access{
  margin-top:8px;
}

.site-access summary{
  cursor:pointer;
  font-weight:600;
  color:var(--primary);
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.site-access__options{
  margin-top:8px;
  display:grid;
  gap:6px;
}

.site-access__option{
  display:flex;
  align-items:center;
  gap:8px;
  padding:4px 0;
}

.site-access__option input{margin:0;}

.site-access__name{flex:1;}

.site-access__code{
  font-size:12px;
  color:var(--muted);
}

.site-access-form .btn{margin-top:8px;}

.section-header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}

.section-header h3{
  margin:0;
  font-size:1.2rem;
}

.section-header p{
  margin:4px 0 0;
}

.section-header__actions{
  margin-left:auto;
}

.table-search-form{
  display:flex;
  align-items:center;
  gap:12px;
}

.table-search{
  position:relative;
  display:flex;
  align-items:center;
  flex:1 1 auto;
}

.table-search__icon{
  position:absolute;
  left:12px;
  width:16px;
  height:16px;
  color:var(--muted);
}

.table-search .input--search{
  padding-left:36px;
  min-width:240px;
}

.tpe-transactions .table-search-form{
  margin:16px 0 12px;
}

.tpe-transactions__empty{
  margin:12px 0 0;
  font-size:13px;
}

.table-search__reset{
  font-size:13px;
  color:var(--muted);
  text-decoration:none;
}

.table-search__reset:hover,
.table-search__reset:focus{
  text-decoration:underline;
}

.invoice-history{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.invoice-history__list{
  display:flex;
  flex-direction:column;
  gap:12px;
}
.invoice-history__item{
  border:1px solid var(--border);
  border-radius:10px;
  padding:14px;
  background:rgba(0,0,0,0.02);
  display:flex;
  flex-direction:column;
  gap:12px;
}
.invoice-history__item--active{
  border-color:var(--primary);
  box-shadow:0 0 0 2px rgba(176,160,108,0.2);
  background:rgba(176,160,108,0.08);
}
.invoice-history__item-title{
  margin:0;
  font-size:1.05rem;
}
.invoice-history__item-link{
  color:inherit;
  text-decoration:none;
}
.invoice-history__item-link:hover,
.invoice-history__item-link:focus{
  text-decoration:underline;
}
.invoice-history__item-meta{
  margin:0;
  display:grid;
  gap:8px 16px;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
}
.invoice-history__item-meta div{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.invoice-history__item-meta dt{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:var(--muted);
}
.invoice-history__item-meta dd{
  margin:0;
  font-weight:600;
}
.invoice-history__item-actions{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}
.invoice-history__details{
  border:1px solid var(--border);
  border-radius:10px;
  padding:16px;
  background:rgba(0,0,0,0.02);
}

.invoice-history__details-grid{
  display:grid;
  gap:16px 24px;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
}

.invoice-history__details--highlight{
  border-color:var(--primary);
  box-shadow:0 0 0 2px rgba(176,160,108,0.2);
  background:rgba(176,160,108,0.08);
}
.invoice-history__details h3{
  margin-top:0;
}
.invoice-history__details-list{
  margin:0;
  display:grid;
  gap:8px 16px;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
}
.invoice-history__details-list div{
  display:flex;
  flex-direction:column;
  gap:4px;
}
.invoice-history__details-list dt{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.04em;
  color:var(--muted);
}
.invoice-history__details-list dd{
  margin:0;
  font-weight:600;
}
.invoice-history__tenders{
  margin-top:16px;
}

.invoice-history__details-grid > .invoice-history__tenders{
  margin-top:0;
}
.invoice-history__tenders h4{
  margin:0;
}
.invoice-history__tenders ul{
  list-style:none;
  margin:8px 0 0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.invoice-history__tenders li{
  display:flex;
  justify-content:space-between;
  gap:12px;
  font-size:14px;
}
.invoice-history__tenders strong{
  font-variant-numeric:tabular-nums;
}

@media (max-width:900px){
  .invoice-history__details-grid{grid-template-columns:1fr;}
}

.invoice-rows__filters{margin:12px 0 0;}
.invoice-rows__filters-panel{
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(0,0,0,0.02);
  padding:8px 12px 12px;
}
.invoice-rows__filters-title{
  margin:0 0 12px;
  font-weight:600;
}
.invoice-rows__filters-row{
  display:flex;
  gap:16px;
  margin-bottom:12px;
}
.invoice-rows__filters-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
}
.invoice-rows__summary{
  min-width:260px;
  padding:10px 12px;
  border:1px solid var(--border);
  border-radius:10px;
  background:rgba(255,255,255,0.65);
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:4px;
}
.invoice-rows__summary-label{
  font-size:13px;
  color:var(--muted);
  font-weight:600;
  line-height:1.2;
}
.invoice-rows__summary-value{
  font-size:32px;
  line-height:1.1;
  font-weight:700;
  font-variant-numeric:tabular-nums;
}
.invoice-rows__filters-row .invoice-rows__filter{
  flex:1;
}
.invoice-rows__filters-grid{
  display:grid;
  gap:10px 16px;
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}
.invoice-rows__filter{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);}
.invoice-rows__filter .input{font-size:14px;padding:8px 10px;}
.invoice-rows__filter-label{font-weight:600;}
.invoice-rows__filter-multi{display:flex;flex-direction:column;gap:6px;}
.invoice-rows__filter-multi-list{display:flex;flex-direction:column;gap:6px;}
.invoice-rows__filter-multi .btn{align-self:flex-start;}
.invoice-rows__filter-range{display:flex;flex-wrap:nowrap;gap:8px;align-items:flex-end;}
.invoice-rows__filter-range-item{display:flex;flex-direction:column;gap:4px;}
.invoice-rows__filter-range .btn{align-self:flex-end;}

.reconciliation-rows__search{margin:12px 0;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;color:var(--muted);font-size:13px;}
.reconciliation-rows__search-label{font-weight:600;}
.reconciliation-rows__search-controls{display:flex;gap:8px;align-items:center;}
.reconciliation-rows__filters{margin:12px 0 0;}
.reconciliation-rows__filters-panel{border:1px solid var(--border);border-radius:10px;background:rgba(0,0,0,0.02);padding:8px 12px 12px;}
.reconciliation-rows__filters-title{margin:0 0 12px;font-weight:600;}
.reconciliation-rows__filters-grid{display:grid;gap:10px 16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));}
.reconciliation-rows__filter{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--muted);}
.reconciliation-rows__filter .input{font-size:14px;padding:8px 10px;}
.reconciliation-rows__filter-label{font-weight:600;}
.reconciliation-rows__count{margin:12px 0 0;}
.reconciliation-rows__empty{margin:16px 0 0;}

@media (max-width:720px){
  .reconciliation-rows__filters-grid{grid-template-columns:1fr;}
  .reconciliation-rows__search{flex-direction:column;align-items:stretch;}
  .reconciliation-rows__search-controls{justify-content:flex-start;}
}

.search-feedback{
  margin:12px 0 0;
  color:var(--muted);
  font-size:13px;
}

.table[data-users-table] tbody tr.is-inactive td{background:rgba(191,135,0,0.08)}
.table[data-users-table] tbody tr:hover td{background:rgba(0,0,0,0.02)}

.role-select{min-width:160px}

.user-name{font-weight:600}
.user-email{display:block;font-size:13px;color:var(--muted)}

.actions--inline{flex-wrap:nowrap}
.actions--stacked{flex-wrap:wrap;justify-content:flex-end;gap:10px}
.actions--stacked form{flex:0 0 auto}
.actions--full form{width:100%;}
.actions--full form select{flex:1 1 auto;}
.actions--full form button{flex:0 0 auto;}

.empty-cell{padding:28px 10px;text-align:center;color:var(--muted)}

.hide-sm{display:table-cell}
.hide-lg{display:none}

@media (max-width:960px){
  .card-header--split{flex-direction:column;align-items:flex-start}
}

@media (max-width:900px){
  .card-header__stats{width:100%}
}

@media (min-width:960px){
  .invoice-history{flex-direction:row;align-items:stretch;gap:24px;}
  .invoice-history__list{flex:1 1 55%;}
  .invoice-history__details{flex:1 1 45%;}
}

@media (max-width:720px){
  .invoice-rows__filters-head{
    flex-direction:column;
    align-items:stretch;
  }
  .invoice-rows__summary{
    min-width:0;
    align-items:flex-start;
  }
  .invoice-rows__summary-value{
    font-size:26px;
  }
  .table[data-users-table] thead{display:none}
  .table[data-users-table] tbody tr{display:grid;grid-template-columns:1fr;gap:10px;padding:12px 0;border-bottom:1px solid var(--border)}
  .table[data-users-table] tbody tr td{padding:0;border:none}
  .table[data-users-table] tbody tr td:last-child{padding-top:8px}
  .table[data-users-table] tbody tr td .actions{flex-wrap:wrap;justify-content:flex-start}
  .section-header{flex-direction:column;align-items:stretch}
  .section-header__actions{width:100%}
  .table-search-form{width:100%}
  .table-search .input--search{width:100%}
  .invoice-rows__filters-grid{grid-template-columns:1fr}
  .hide-sm{display:none}
  .hide-lg{display:block}
  .actions--full form{display:flex;gap:8px;align-items:center}
}

.empty-row td{padding:28px 10px;text-align:center;color:var(--muted)}

.sr-only{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  border:0;
}

/* --- Login pages --- */
body.login-page-body{
  background:#fff;
}

body.login-page-body.login-page-body--holiday{
  background:#000;
}

body.login-page-body .app-header{
  display:none;
}

body.login-page-body main.container{
  max-width:none;
  width:100%;
  min-height:100vh;
  padding:48px clamp(20px, 5vw, 64px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  gap:28px;
}

body.login-page-body.login-page-body--holiday main.container{
  padding:0;
}

body.login-page-body.login-page-body--holiday .footer{
  display:none;
}

body.login-page-body .flashes{
  width:100%;
  max-width:480px;
  margin:0;
}

body.login-page-body .login-page{
  position:relative;
  width:100%;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:clamp(56px, 8vh, 96px) clamp(18px, 7vw, 96px);
  overflow:hidden;
  isolation:isolate;
  background:#fff;
}

body.login-page-body .login-page.has-fresco{
  background:#fff;
}

body.login-page-body .login-page.login-page--holiday{
  background:#000;
  color:#f4f6fb;
  padding:0;
}

.login-holiday{
  position:fixed;
  inset:0;
  width:100vw;
  height:100vh;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}

.login-holiday__video{
  position:absolute;
  inset:0;
  background:#000;
}

.login-holiday__video iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  pointer-events:none;
  object-fit:cover;
}

body.login-page-body .login-page__content{
  position:relative;
  z-index:3;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:36px;
  width:100%;
  max-width:520px;
}

body.login-page-body .login-page__logo{
  display:flex;
  justify-content:center;
}

body.login-page-body .login-page__logo img{
  width:min(380px, 100%);
  height:auto;
  filter:drop-shadow(0 14px 36px rgba(176,160,108,0.32));
}

body.login-page-body .login-panel{
  background:#fff;
  border:1px solid rgba(176,160,108,0.15);
  box-shadow:0 24px 90px rgba(0,0,0,0.08);
}

body.login-page-body .login-page--holiday .login-panel{
  background:rgba(247,249,255,0.9);
  border-color:rgba(255,255,255,0.65);
  box-shadow:0 28px 80px rgba(0,0,0,0.28);
  backdrop-filter:blur(10px) saturate(1.05);
  color:#0b1628;
}

body.login-page-body .login-page--holiday .login-panel__header p,
body.login-page-body .login-page--holiday .login-panel__footnote,
body.login-page-body .login-page--holiday .login-panel label span{
  color:color-mix(in srgb, #0b1628 86%, #1f2937 14%);
}

.login-fresco{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:1;
  overflow:hidden;
}

.login-fresco__backdrop{
  position:absolute;
  inset:-24% -22%;
  background:
    radial-gradient(120% 140% at 20% 18%, rgba(255,255,255,0.78) 0%, rgba(255,255,255,0.22) 56%, rgba(255,255,255,0) 100%),
    radial-gradient(140% 120% at 84% 24%, rgba(255,242,214,0.55) 0%, rgba(255,242,214,0.12) 58%, rgba(255,242,214,0) 100%),
    linear-gradient(130deg, rgba(255,248,230,0.68) 0%, rgba(250,237,208,0.46) 52%, rgba(255,255,255,0.6) 100%);
  filter:blur(52px);
  opacity:0.65;
  transform:translateZ(0);
}

.login-fresco__orbit{
  position:absolute;
  top:50%;
  left:50%;
  width:min(1600px, 140vw);
  height:min(1080px, 130vh);
  transform:translate(-50%, -50%);
  z-index:1;
}

.login-fresco__tile{
  --pos-x:0px;
  --pos-y:0px;
  --scale:1;
  --alpha:0.75;
  --float-duration:26s;
  --float-delay:0s;
  position:absolute;
  top:50%;
  left:50%;
  width:clamp(200px, 18vw, 240px);
  aspect-ratio:1;
  transform:translate3d(-50%, -50%, 0) translate3d(var(--pos-x), var(--pos-y), 0) scale(var(--scale));
  opacity:var(--alpha);
  transition:transform 6.8s cubic-bezier(0.25, 0.7, 0.2, 1), opacity 6.5s ease;
}

.login-fresco__frame{
  position:relative;
  width:100%;
  height:100%;
  border-radius:18px;
  overflow:hidden;
  background:
    linear-gradient(140deg, rgba(255,255,255,0.72) 0%, rgba(255,248,230,0.32) 52%, rgba(255,248,230,0.1) 100%);
  border:1px solid rgba(176,160,108,0.55);
  box-shadow:0 28px 90px rgba(176,160,108,0.22), inset 0 0 0 1px rgba(255,255,255,0.4);
}

.login-fresco__frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(120% 120% at 20% 18%, rgba(255,255,255,0.48) 0%, rgba(255,255,255,0) 70%);
  mix-blend-mode:screen;
  pointer-events:none;
}

.login-fresco__frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  border-radius:inherit;
  filter:saturate(var(--tile-saturation, 1.1)) contrast(var(--tile-contrast, 1.16)) brightness(var(--tile-brightness, 1.0));
  transition:filter 1.8s ease, opacity 1.2s ease;
}

.login-fresco__tile.is-fading{
  animation:login-fresco-fade-cycle 10s ease-in-out forwards;
}

@keyframes login-fresco-fade-cycle{
  0%{
    opacity:var(--alpha);
  }

  28%{
    opacity:1;
  }

  66%{
    opacity:0.78;
  }

  100%{
    opacity:var(--alpha);
  }
}

@keyframes login-fresco-float{
  0%, 100%{
    transform:translate3d(0, 0, 0);
  }

  45%{
    transform:translate3d(0, -10px, 0);
  }

  55%{
    transform:translate3d(0, -10px, 0);
  }
}

@keyframes login-fresco-backdrop{
  0%{
    transform:translate3d(-2%, -1%, 0) scale(1);
    opacity:0.62;
  }

  50%{
    transform:translate3d(2%, 1%, 0) scale(1.02);
    opacity:0.7;
  }

  100%{
    transform:translate3d(-1%, 0%, 0) scale(1.01);
    opacity:0.65;
  }
}

.login-fresco__veil{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(255,255,255,0.12) 0%, rgba(255,255,255,0.42) 32%, rgba(255,255,255,0.68) 74%, rgba(255,255,255,0.78) 100%);
  mix-blend-mode:screen;
}

[data-floating="true"] .login-fresco__tile{
  will-change:transform, opacity;
}

[data-floating="true"] .login-fresco__frame{
  animation:login-fresco-float var(--float-duration) ease-in-out infinite;
  animation-delay:var(--float-delay);
}

[data-floating="true"] .login-fresco__backdrop{
  animation:login-fresco-backdrop 60s ease-in-out infinite alternate;
}

@media (prefers-reduced-motion: reduce){
  .login-fresco__tile{
    transition:none;
  }

  .login-fresco__tile,
  .login-fresco__frame,
  .login-fresco__frame::after{
    animation:none !important;
    transform:none !important;
  }

  .login-fresco__backdrop{
    animation:none !important;
  }
}

@media (max-width:1200px){
  .login-fresco__tile{
    width:clamp(180px, 26vw, 220px);
  }
}

@media (max-width:1024px){
  body.login-page-body .login-page{
    padding:clamp(48px, 9vh, 90px) clamp(16px, 6vw, 72px);
  }
}

@media (max-width:900px){
  .login-fresco{
    position:relative;
    inset:auto;
    padding:48px 24px 16px;
  }

  .login-fresco__veil{
    display:none;
  }

  .login-fresco__backdrop{
    display:none;
  }

  .login-fresco__orbit{
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    width:100%;
    height:auto;
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:24px;
    justify-items:stretch;
  }

  .login-fresco__tile{
    position:relative;
    top:auto;
    left:auto;
    transform:none;
    opacity:1;
    width:100%;
  }

  .login-fresco__frame{
    border-radius:16px;
    box-shadow:0 16px 40px rgba(176,160,108,0.2), inset 0 0 0 1px rgba(255,255,255,0.35);
    background:linear-gradient(140deg, rgba(255,255,255,0.96) 0%, rgba(255,248,230,0.72) 100%);
  }
}

@media (max-width:768px){
  body.login-page-body .login-page{
    padding:clamp(40px, 9vh, 76px) clamp(14px, 7vw, 56px);
  }
}

@media (max-width:640px){
  .login-fresco{
    padding:32px 12px 8px;
  }

  .login-fresco__orbit{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:18px;
  }

  body.login-page-body .login-page{
    background:#fff;
  }
}

body.login-page-body .login-panel{
  width:100%;
  max-width:480px;
  padding:36px;
}

body.login-page-body .login-panel__cta{
  display:flex;
  justify-content:center;
  margin-bottom:8px;
}

body.login-page-body .login-panel__cta .btn{
  min-width:160px;
}

@media (max-width:520px){
  body.login-page-body main.container{
    padding:32px 12px;
  }

  body.login-page-body .login-page{
    max-width:none;
  }

  body.login-page-body .login-page__content{
    gap:24px;
  }

  body.login-page-body .login-page__logo img{
    width:min(260px, 100%);
  }

  body.login-page-body .login-panel{
    padding:28px 20px;
  }

  body.login-page-body .login-panel__cta .btn{
    width:100%;
    min-width:0;
  }
}

/* --- Login landing page --- */
.login-landing{
  position:relative;
  margin:52px auto 40px;
  padding:56px;
  background:linear-gradient(132deg, rgba(176,160,108,0.12) 0%, rgba(255,255,255,0.85) 36%, rgba(176,160,108,0.18) 100%);
  border:1px solid color-mix(in srgb, var(--border) 80%, transparent);
  border-radius:32px;
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:48px;
  align-items:stretch;
  box-shadow:0 30px 60px rgba(15,23,42,0.12);
  overflow:hidden;
}

.login-landing::before{
  content:"";
  position:absolute;
  inset:-30% -10% 40% 45%;
  background:radial-gradient(120% 120% at 0% 0%, rgba(255,255,255,0.85) 0%, rgba(255,255,255,0) 72%);
  pointer-events:none;
  z-index:0;
}


.login-landing__intro{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:26px;
}

.login-badge{
  align-self:flex-start;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(176,160,108,0.18);
  border:1px solid color-mix(in srgb, var(--primary) 55%, transparent);
  font-size:0.85rem;
  font-weight:600;
  letter-spacing:0.02em;
}


.login-landing__intro h1{
  margin:0;
  font-size:2.4rem;
  line-height:1.2;
}

.login-landing__lead{
  margin:0;
  max-width:560px;
  font-size:1.05rem;
  color:var(--muted);
}

.login-focus{
  list-style:none;
  margin:0;
  padding:0;
  display:grid;
  gap:16px;
}

.login-focus__item{
  display:flex;
  gap:16px;
  align-items:flex-start;
  padding:18px 20px;
  border-radius:20px;
  background:rgba(255,255,255,0.75);
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent);
  backdrop-filter:blur(10px);
}


.login-focus__icon{
  width:36px;
  height:36px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, var(--primary), color-mix(in srgb, var(--primary) 65%, #ffffff 35%));
  color:#fff;
  font-weight:700;
  font-size:0.9rem;
  flex-shrink:0;
}

.login-focus__item strong{
  display:block;
  font-size:1.05rem;
  margin-bottom:4px;
}

.login-focus__item p{
  margin:0;
  color:var(--muted);
}

.login-metrics{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.login-metric{
  position:relative;
  padding:20px 22px;
  border-radius:18px;
  background:rgba(255,255,255,0.8);
  border:1px solid color-mix(in srgb, var(--primary) 25%, transparent);
  backdrop-filter:blur(12px);
}


.login-metric__value{
  display:block;
  font-size:1.6rem;
  font-weight:700;
  margin-bottom:6px;
}

.login-metric p{
  margin:0;
  color:var(--muted);
  font-size:0.95rem;
}

.login-support{
  padding:18px 20px;
  border-radius:18px;
  background:rgba(0,0,0,0.04);
  border:1px solid color-mix(in srgb, var(--primary) 40%, transparent);
  font-size:0.98rem;
}


.login-support p{
  margin:6px 0 0;
  color:var(--muted);
}

.login-panel{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:20px;
  padding:36px;
  border-radius:24px;
  box-shadow:0 18px 36px rgba(15,23,42,0.1);
}

.login-panel__notice{
  margin:0;
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(133,90,47,0.25);
  background:linear-gradient(135deg, rgba(255,252,240,0.95), rgba(255,242,214,0.96));
  color:#8a5a2f;
  font-weight:600;
  line-height:1.5;
  box-shadow:0 10px 30px rgba(133,90,47,0.12);
}


.login-panel__header h2{
  margin:0;
  font-size:1.6rem;
}

.login-panel__header p{
  margin:8px 0 0;
  color:var(--muted);
}

.login-panel__form{
  gap:18px;
}

.login-panel__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:4px;
}

.login-panel__actions .btn{
  flex:1 1 180px;
  min-width:170px;
}

.login-panel__footnote{
  margin:0;
  font-size:0.92rem;
  color:var(--muted);
  line-height:1.5;
}

.login-showcase{
  margin:48px auto 0;
  padding:0 8px 24px;
  display:flex;
  flex-direction:column;
  gap:32px;
}

.login-showcase h2{
  margin:0;
  font-size:1.8rem;
  text-align:center;
}

.login-showcase__grid{
  display:grid;
  gap:20px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.login-showcase__card{
  padding:26px 24px;
  border-radius:20px;
  background:linear-gradient(145deg, rgba(176,160,108,0.18) 0%, rgba(255,255,255,0.9) 65%);
  border:1px solid color-mix(in srgb, var(--primary) 35%, transparent);
  box-shadow:0 18px 32px rgba(15,23,42,0.08);
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:16px;
}


.login-showcase__icon{
  width:64px;
  height:64px;
  border-radius:18px;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(176,160,108,0.32) 0%, rgba(255,255,255,0.75) 100%);
  color:color-mix(in srgb, var(--primary) 65%, #8b6f3d 35%);
  box-shadow:0 12px 24px rgba(15,23,42,0.12);
}

.login-showcase__icon-symbol{
  width:36px;
  height:36px;
  fill:currentColor;
}


.login-showcase__card h3{
  margin:0;
  font-size:1.25rem;
}

.login-showcase__card p{
  margin:0;
  color:var(--muted);
}

.login-journey{
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,340px) minmax(0,1fr);
  gap:40px;
  align-items:start;
  padding:36px 44px;
  border-radius:28px;
  border:1px solid color-mix(in srgb, var(--border) 65%, transparent);
  background:
    radial-gradient(140% 120% at 0% 0%, rgba(176,160,108,0.16) 0%, transparent 55%),
    linear-gradient(135deg, rgba(15,23,42,0.03) 0%, rgba(15,23,42,0.06) 100%);
  box-shadow:0 24px 48px rgba(15,23,42,0.08);
}


.login-journey__intro{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:24px;
  border-radius:22px;
  background:rgba(255,255,255,0.6);
  border:1px solid color-mix(in srgb, var(--border) 45%, transparent);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.45);
}


.login-journey__eyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:0.78rem;
  text-transform:uppercase;
  letter-spacing:0.12em;
  font-weight:600;
  color:color-mix(in srgb, var(--primary) 85%, var(--fg) 15%);
}

.login-journey__eyebrow::before{
  content:"";
  width:28px;
  height:1px;
  background:currentColor;
  opacity:0.5;
}

.login-journey h3{
  margin:0;
  font-size:1.45rem;
}

.login-journey__intro p{
  margin:0;
  color:color-mix(in srgb, var(--muted) 70%, var(--fg) 30%);
}

.login-journey__steps{
  position:relative;
  list-style:none;
  margin:0;
  padding:12px 0;
  display:flex;
  flex-direction:column;
  gap:26px;
}

.login-journey__steps::before{
  content:"";
  position:absolute;
  left:23px;
  top:40px;
  bottom:28px;
  width:2px;
  background:linear-gradient(180deg, rgba(176,160,108,0.65) 0%, rgba(176,160,108,0.15) 100%);
}

.login-journey__step{
  position:relative;
  display:grid;
  grid-template-columns:52px 1fr;
  gap:22px;
  align-items:flex-start;
  font-size:0.98rem;
}

.login-journey__step::after{
  content:"";
  position:absolute;
  left:23px;
  top:64px;
  bottom:-30px;
  width:2px;
  background:linear-gradient(180deg, rgba(176,160,108,0.55) 0%, rgba(176,160,108,0.05) 100%);
}

.login-journey__step:last-child::after{
  display:none;
}

.login-journey__step-index{
  display:grid;
  place-items:center;
  width:52px;
  height:52px;
  border-radius:16px;
  font-weight:700;
  font-size:1.15rem;
  color:color-mix(in srgb, var(--primary) 78%, #fff 22%);
  background:linear-gradient(140deg, rgba(255,255,255,0.92) 0%, rgba(176,160,108,0.25) 100%);
  border:1px solid color-mix(in srgb, var(--primary) 50%, transparent);
  box-shadow:0 10px 18px rgba(15,23,42,0.18);
}


.login-journey__step-content strong{
  display:block;
  margin-bottom:6px;
  font-size:1.08rem;
}

.login-journey__step-content p{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.login-highlight{
  position:relative;
  margin:80px auto 0;
  padding:52px;
  display:grid;
  grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);
  gap:56px;
  align-items:center;
  border-radius:36px;
  border:1px solid color-mix(in srgb, var(--primary) 25%, var(--border) 75%);
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(176,160,108,0.22) 0%, rgba(255,255,255,0.95) 65%),
    linear-gradient(120deg, rgba(255,255,255,0.92) 0%, rgba(255,255,255,0.65) 100%);
  overflow:hidden;
  box-shadow:0 28px 60px rgba(15,23,42,0.1);
}


.login-highlight__media{
  position:relative;
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.login-highlight__glow{
  position:absolute;
  inset:auto -80px -120px -60px;
  height:420px;
  background:radial-gradient(60% 65% at 50% 20%, rgba(176,160,108,0.45) 0%, rgba(176,160,108,0) 100%);
  filter:blur(10px);
  opacity:0.8;
}

.login-highlight__card{
  position:relative;
  z-index:1;
  max-width:360px;
  padding:32px 30px;
  border-radius:28px;
  background:rgba(255,255,255,0.86);
  border:1px solid color-mix(in srgb, var(--border) 70%, transparent);
  box-shadow:0 24px 42px rgba(15,23,42,0.18);
  display:flex;
  flex-direction:column;
  gap:18px;
}


.login-highlight__tag{
  align-self:flex-start;
  padding:6px 14px;
  border-radius:999px;
  background:rgba(176,160,108,0.16);
  border:1px solid color-mix(in srgb, var(--primary) 45%, transparent);
  font-size:0.82rem;
  font-weight:600;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:color-mix(in srgb, var(--primary) 80%, var(--fg) 20%);
}

.login-highlight__card p{
  margin:0;
  color:color-mix(in srgb, var(--muted) 65%, var(--fg) 35%);
}

.login-highlight__list{
  margin:0;
  padding:0 0 0 18px;
  display:grid;
  gap:10px;
  color:var(--muted);
  font-size:0.95rem;
}

.login-highlight__content{
  display:flex;
  flex-direction:column;
  gap:22px;
}

.login-highlight__eyebrow{
  font-size:0.85rem;
  text-transform:uppercase;
  letter-spacing:0.14em;
  color:color-mix(in srgb, var(--primary) 75%, var(--fg) 25%);
  font-weight:600;
}

.login-highlight h2{
  margin:0;
  font-size:2.1rem;
  line-height:1.25;
}

.login-highlight p{
  margin:0;
  color:color-mix(in srgb, var(--muted) 75%, var(--fg) 25%);
  font-size:1.02rem;
  line-height:1.6;
}

.login-highlight__features{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px;
  margin:0;
}

.login-highlight__features div{
  padding:18px 20px;
  border-radius:20px;
  background:rgba(255,255,255,0.8);
  border:1px solid color-mix(in srgb, var(--border) 65%, transparent);
  box-shadow:0 12px 24px rgba(15,23,42,0.08);
}


.login-highlight__features dt{
  font-weight:700;
  margin:0 0 6px;
  font-size:1.05rem;
}

.login-highlight__features dd{
  margin:0;
  color:var(--muted);
  line-height:1.55;
}

.login-testimonials{
  margin:96px auto 0;
  display:flex;
  flex-direction:column;
  gap:40px;
  text-align:center;
}

.login-testimonials__header{
  max-width:720px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.login-testimonials__eyebrow{
  align-self:center;
  font-size:0.82rem;
  text-transform:uppercase;
  letter-spacing:0.18em;
  font-weight:600;
  color:color-mix(in srgb, var(--primary) 65%, var(--fg) 35%);
}

.login-testimonials__header h2{
  margin:0;
  font-size:2rem;
}

.login-testimonials__header p{
  margin:0;
  color:var(--muted);
  font-size:1rem;
  line-height:1.6;
}

.login-testimonials__grid{
  display:grid;
  gap:26px;
  grid-template-columns:repeat(3,minmax(0,1fr));
}

.login-testimonial{
  padding:28px 26px;
  border-radius:24px;
  background:linear-gradient(160deg, rgba(255,255,255,0.92) 0%, rgba(176,160,108,0.18) 100%);
  border:1px solid color-mix(in srgb, var(--primary) 35%, transparent);
  box-shadow:0 16px 34px rgba(15,23,42,0.1);
  display:flex;
  flex-direction:column;
  gap:18px;
}


.login-testimonial__quote{
  margin:0;
  font-size:1.05rem;
  line-height:1.6;
  color:color-mix(in srgb, var(--muted) 70%, var(--fg) 30%);
}

.login-testimonial__author{
  margin:0;
  font-weight:600;
  color:color-mix(in srgb, var(--primary) 65%, var(--fg) 35%);
  letter-spacing:0.04em;
  text-transform:uppercase;
  font-size:0.82rem;
}

.login-cta{
  margin:100px auto 40px;
  padding:48px 56px;
  border-radius:32px;
  border:1px solid color-mix(in srgb, var(--primary) 30%, transparent);
  background:linear-gradient(140deg, rgba(176,160,108,0.28) 0%, rgba(255,255,255,0.9) 100%);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
  flex-wrap:wrap;
  box-shadow:0 30px 52px rgba(15,23,42,0.1);
}


.login-cta__content{
  flex:1 1 420px;
  display:flex;
  flex-direction:column;
  gap:18px;
}

.login-cta__content h2{
  margin:0;
  font-size:2rem;
  line-height:1.25;
}

.login-cta__content p{
  margin:0;
  font-size:1.02rem;
  color:color-mix(in srgb, var(--muted) 70%, var(--fg) 30%);
  line-height:1.6;
}

.login-cta__actions{
  display:flex;
  gap:16px;
  align-items:center;
  flex-wrap:wrap;
}

.login-cta .btn-ghost{
  --btn-fill: transparent;
  --btn-border: color-mix(in srgb, var(--primary) 60%, var(--border) 40%);
  --btn-text: color-mix(in srgb, var(--primary) 75%, var(--fg) 25%);
  box-shadow:none;
  background-image:none;
}

.login-cta .btn-ghost:hover,
.login-cta .btn-ghost:focus-visible{
  background:rgba(255,255,255,0.4);
}

@media (max-width:1024px){
  .login-landing{
    padding:44px;
    grid-template-columns:1fr;
  }
  .login-metrics{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .login-showcase__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .login-journey{
    grid-template-columns:1fr;
    padding:32px;
  }
  .login-highlight{
    grid-template-columns:1fr;
    padding:44px;
    gap:44px;
  }
  .login-highlight__media{
    min-height:260px;
  }
  .login-highlight__features{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .login-testimonials__grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:720px){
  .login-landing{
    margin:32px auto 28px;
    padding:28px;
    border-radius:24px;
    gap:32px;
  }
  .login-panel{
    padding:28px;
  }
  .login-focus{
    gap:14px;
  }
  .login-metrics{
    grid-template-columns:1fr;
  }
  .login-showcase__grid{
    grid-template-columns:1fr;
  }
  .login-journey{
    padding:26px;
    gap:28px;
  }
  .login-highlight{
    margin:64px auto 0;
    padding:32px;
  }
  .login-highlight__features{
    grid-template-columns:1fr;
  }
  .login-testimonials{
    margin:72px auto 0;
  }
  .login-testimonials__grid{
    grid-template-columns:1fr;
  }
  .login-cta{
    padding:36px;
    margin:80px auto 32px;
    flex-direction:column;
    align-items:flex-start;
  }
}

@media (max-width:520px){
  .login-landing{
    padding:22px;
  }
  .login-panel{
    padding:24px 20px;
  }
  .login-journey{
    padding:22px;
  }
  .login-journey__steps{
    gap:22px;
  }
  .login-journey__steps::before{
    left:20px;
  }
  .login-journey__step{
    grid-template-columns:48px 1fr;
    gap:18px;
  }
  .login-journey__step::after{
    left:20px;
  }
  .login-journey__step-index{
    width:48px;
    height:48px;
    font-size:1.05rem;
  }
  .login-highlight{
    padding:26px;
    gap:32px;
  }
  .login-highlight__card{
    padding:26px 22px;
  }
  .login-cta{
    padding:28px 24px;
  }
}
