:root{
  --bg:#0b0f1a; --card:#111827; --muted:#94a3b8; --text:#e5e7eb; --accent:#7c3aed; --accent-2:#22c55e;
  --ring: rgba(124, 58, 237, .4); --danger:#ef4444; --ok:#10b981; --shadow:0 10px 30px rgba(0,0,0,.35); --radius:18px;
}
html,body{height:100%}
body{
  margin:0; font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans","Apple Color Emoji","Segoe UI Emoji";
  color:var(--text); background:
    radial-gradient(1200px 800px at 100% -10%, rgba(124,58,237,.15), transparent 60%),
    radial-gradient(800px 600px at -20% 120%, rgba(34,197,94,.12), transparent 60%), var(--bg);
}


/* ✅ Badge Success (vert) */
.badge-discount-annonce {
  background: rgba(34, 197, 94, .15);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, .3);
  padding:20px;
  font-size: 18px;
  border-radius:6px;
}
.discount-annonce-limit {
  font-size: 24px;
}

/* Bannière promo ponctuelle (override saisonnier) */
.promo-banner {
  margin: 0 0 14px;
  padding: 10px 16px;
  border-radius: 6px;
  font-weight: 600;
  font-size: 15px;
  text-align: center;
  /* color / background / border injectés inline depuis le thème ACCENT_* */
}


/* Layout */
.wrap{ max-width:1100px; margin:0 auto; padding:28px 20px 80px; }
@media (max-width: 900px){ .wrap{ padding-bottom: 64px; } }

header{ display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:28px; }
.brand{ display:flex; align-items:center; gap:12px; text-decoration:none; color:inherit; }
.brand-logo{ width:40px; height:40px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(135deg,var(--accent),#4f46e5); box-shadow:var(--shadow); }
.brand h1{ font-size:20px; margin:0; letter-spacing:.2px; }
.pill{ display:inline-block; padding:4px 10px; border-radius:999px; background:rgba(124,58,237,.18); border:1px solid rgba(124,58,237,.3); color:#c4b5fd; font-weight:700; font-size:12px; letter-spacing:.2px; }

.hero{ padding:22px; background:rgba(17,24,39,.6); border:1px solid rgba(148,163,184,.15); border-radius:var(--radius); box-shadow:var(--shadow); }
.hero h2{ margin:0 0 8px; font-size:clamp(22px, 3vw, 30px); }
.hero p{ margin:0; color:var(--muted); }

/* Grids */
.grid{ margin-top:16px; display:grid; grid-template-columns: 1.1fr .9fr; gap:16px; }
.panel{ margin-top:18px; display:grid; grid-template-columns: 1.2fr .8fr; gap:16px; }


.panel_1col{ margin-top:18px; display:flex; }



@media (max-width: 900px){ .grid, .panel{ grid-template-columns: 1fr; } }

/* Cards */
.card{ background:var(--card); border:1px solid rgba(148,163,184,.14); border-radius:var(--radius); box-shadow:var(--shadow); }
.form{ padding:20px; }
.aside{ padding:18px; display:grid; gap:12px; }
.summary{ padding:18px; display:grid; gap:12px; }


/* licence INPUT  */

a{
color:#c4b5fd;

text-underline-offset: 4px; 
}
#license{
  width:700px;

    font-family: monospace;
  font-size: 10px;
    letter-spacing: 2px;
}
/* Form */
.field{ display:grid; gap:8px; margin-bottom:14px; }
label{ font-weight:650; }
.row, .row-split{ display:flex; gap:10px; flex-wrap:wrap; }
input[type="text"], input[type="email"], select{
  flex:1 1 260px; padding:12px 14px; border-radius:12px; border:1px solid rgba(148,163,184,.25); background:#0b1220; color:var(--text); outline:none;
}
input:focus, select:focus{ border-color:var(--accent); box-shadow:0 0 0 4px var(--ring); }
.checkbox{ display:flex; align-items:flex-start; gap:10px; }
.checkbox input{ margin-top:4px; width:18px; height:18px; }

/* Typo helpers */
.hint{ color:var(--muted); font-size:14px; }
.error{ color:var(--danger); font-weight:600; }
.small{ font-size:12px; color:var(--muted); }
.label{ color:var(--muted); }
.list{ margin:0; padding-left:18px; }
.sr-only{ position:absolute; left:-9999px; }
.footer, .foot{ margin-top:26px; color:var(--muted); font-size:13px; text-align:center; }

/* Buttons */
button, .btn{ appearance:none; border:0; cursor:pointer; font-weight:800; text-decoration:none; color:white; padding:12px 16px; border-radius:12px; display:inline-flex; align-items:center; justify-content:center; gap:10px; background:linear-gradient(135deg, var(--accent), #4f46e5); }
.btn-ghost, .btn.ghost{ background:transparent; color:var(--text); border:1px solid rgba(148,163,184,.25); }
.btn-secondary, .btn.secondary{ background:linear-gradient(135deg, var(--accent-2), #16a34a); }
button[disabled]{ opacity:.5; cursor:not-allowed; }

/* Offer cards (page licence) */

/*
.offers{ padding:6px 6px 10px; display:grid; grid-template-columns: repeat(12, 1fr); gap:12px; }
.offer{ grid-column: span 6; background:#0f172a; border:1px solid rgba(148,163,184,.16); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; }
*/

.offers{ border:0px solid red;padding:6px 6px 10px; display:flex; flex-direction:column;gap:10px;}
.offer{ background:#0f172a; border:1px solid rgba(148,163,184,.5); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; }



/* ✅ Badge Success (vert) */
.badge-success {
  background: rgba(34, 197, 94, .15);
  color: #86efac;
  border: 1px solid rgba(34, 197, 94, .3);
}

/* ⚠️ Badge Warning (jaune/orangé) */
.badge-warning {
  background: rgba(250, 204, 21, .15);
  color: #fde047;
  border: 1px solid rgba(250, 204, 21, .3);
}

/* ❌ Badge Error (rouge) */
.badge-error {
  background: rgba(239, 68, 68, .15);
  color: #fca5a5;
  border: 1px solid rgba(239, 68, 68, .3);
}



/*
@media (max-width: 900px){ .offer{ grid-column: span 12; } }
*/
.offer-head{ display:flex; align-items:center; justify-content:space-between; padding:16px 16px 10px; }
.offer-title{ font-size:17px; font-weight:700; margin:0;   padding:6px 10px; border-radius:5px;}
.badge{ font-size:18px; font-weight:800; padding:6px 10px; border-radius:999px; background: rgba(34,197,94,.15); color:#86efac; border:1px solid rgba(34,197,94,.3); }
.offer-body{ padding:0 16px 16px; color:var(--muted); }
.pricing{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.price-now, .now{ font-size:22px; font-weight:900; }
.price-before, .before{ text-decoration: line-through; opacity:.65; }
.offer-actions{ margin-top:auto; padding:12px 12px 16px; display:flex; gap:10px; flex-wrap:wrap; }

.offer-license-header{ border:0px solid green;margin-top:auto; padding:12px 12px 16px; display:flex; gap:10px; flex-wrap:wrap; }


.license-box {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border: 1px solid #ccc;
  border-radius: 8px;
  font-family: monospace;
  font-size: 10px;
  background: #f9f9f9;
  user-select: all;
}

.license-box span {
  color: #333;
  letter-spacing: 2px;
}

.copy-btn {
  padding: 6px 12px;
  font-size: 14px;
  border: none;
  border-radius: 6px;
  background: #4caf50;
  color: white;
  cursor: pointer;
  transition: background 0.2s;
}

.copy-btn:hover {
  background: #43a047;
}


.actual_software {display:none;}
.software-title{font-size:17px; font-weight:normal; }
.badge-software-title{ padding:6px 10px; border-radius:5px; }

/* Icons & status (aside) */
.check{ display:flex; gap:10px; align-items:flex-start; }
.dot{ width:10px; height:10px; border-radius:50%; background:var(--ok); margin-top:6px; box-shadow:0 0 0 2px rgba(16,185,129,.25); }

/* Price boxes (achat & paiement) */
.price-box{ background:#0f172a; border:1px solid rgba(148,163,184,.16); border-radius:16px; padding:14px; }
.save{ font-weight:800; color:#86efac; }

/* Modals (page paiement virement) */
dialog{ border:none; border-radius:16px; padding:0; max-width:720px; width:calc(100% - 32px); background:#0b1220; color:var(--text); box-shadow:var(--shadow); }
.modal{ padding:18px; }
.modal h3{ margin:0 0 8px; }
.modal .hint{ color:var(--muted); }
.modal .bank{ display:grid; gap:6px; margin-top:10px; background:#0f172a; border:1px solid rgba(148,163,184,.16); border-radius:12px; padding:12px; }
.kbd{ font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:12px; background:#0b1220; border:1px solid rgba(148,163,184,.25); padding:2px 6px; border-radius:6px; }

/* Utilities */
.hidden{ display:none !important; }
.center{ text-align:center; }
.max-w{ max-width: 980px; }