/* ═══════════════════════════════════════════════════════════
   Affiliate Dashboard — Front-end (Mon Compte WooCommerce)
   ═══════════════════════════════════════════════════════════ */

.sp-aff-dashboard { max-width: 900px; }

/* ── KPIs ── */
.sp-aff-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 24px; }
.sp-aff-kpi { background: #f9f9f9; border: 1px solid #eee; border-radius: 10px; padding: 16px; text-align: center; }
.sp-aff-kpi-value { display: block; font-size: 24px; font-weight: 700; color: #1a1a1a; }
.sp-aff-kpi-label { font-size: 12px; color: #888; text-transform: uppercase; letter-spacing: 0.5px; }
.sp-aff-kpi-highlight { background: #fff8e1; border-color: #d4a017; }
.sp-aff-kpi-highlight .sp-aff-kpi-value { color: #d4a017; }

/* ── Lien affiliation ── */
/* @since 9.6.85 — Mode sombre cohérent avec le reste du dashboard front
   (le design admin clair d'origine était illisible sur fond noir WoodMart) */
.sp-aff-link-box { background: #fff; border: 1px solid #eee; border-radius: 10px; padding: 20px; margin-bottom: 24px; color: #333; }
.sp-aff-link-box h3 { margin: 0 0 12px; font-size: 16px; color: #1a1a1a; }
.sp-aff-link-row { display: flex; gap: 8px; }
.sp-aff-link-input { flex: 1; padding: 10px 14px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; background: #fff; color: #333; }
.sp-aff-copy-btn { padding: 10px 16px; background: #fbbf24; color: #0f0f0f; border: none; border-radius: 6px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background 0.15s; }
.sp-aff-copy-btn:hover { background: #f59e0b; }
.sp-aff-copy-btn.copied { background: #22c55e; color: #fff; }
.sp-aff-link-note { margin: 10px 0 0; font-size: 13px; color: #9ca3af; }

/* ── Graphique ── */
.sp-aff-chart-box { background: #fff; border: 1px solid #eee; border-radius: 10px; padding: 20px; margin-bottom: 24px; }
.sp-aff-chart-box h3 { margin: 0 0 12px; font-size: 16px; }
.sp-aff-chart-controls { display: flex; gap: 6px; margin-bottom: 16px; }
.sp-aff-period-btn { padding: 6px 14px; border: 1px solid #ddd; border-radius: 20px; background: #fff; color: #666; font-size: 13px; cursor: pointer; transition: all 0.15s; }
.sp-aff-period-btn.active, .sp-aff-period-btn:hover { background: #d4a017; color: #fff; border-color: #d4a017; }

/* ── Tableau commissions ── */
.sp-aff-history { background: #fff; border: 1px solid #eee; border-radius: 10px; padding: 20px; margin-bottom: 24px; }
.sp-aff-history h3 { font-size: 16px; margin-bottom: 12px; }
.sp-aff-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.sp-aff-table th { background: #1a1a1a; padding: 10px 12px; text-align: left; font-size: 12px; text-transform: uppercase; color: #fbbf24; border-bottom: 2px solid rgba(251,191,36,0.3); }
.sp-aff-table td { padding: 10px 12px; border-bottom: 1px solid rgba(255,255,255,0.06); color: #e5e7eb; }
.sp-aff-table tr:hover td { background: rgba(251,191,36,0.04); }
.sp-aff-status-pending { color: #f59e0b; }
.sp-aff-status-approved { color: #22c55e; }
.sp-aff-status-paid { color: #3b82f6; }
.sp-aff-status-cancelled { color: #ef4444; text-decoration: line-through; }
.sp-aff-empty { color: #888; font-style: italic; padding: 20px 0; }

/* ── Paiement ── */
.sp-aff-payment-box { background: #f9f9f9; border-radius: 10px; padding: 20px; margin-bottom: 24px; }
.sp-aff-payment-box h3 { margin: 0 0 12px; font-size: 16px; }
.sp-aff-stripe-ok { color: #22c55e; font-weight: 600; }
.sp-aff-stripe-setup-btn { padding: 12px 24px; background: #635bff; color: #fff; border: none; border-radius: 8px; font-size: 15px; font-weight: 600; cursor: pointer; transition: background 0.15s; }
.sp-aff-stripe-setup-btn:hover { background: #4f46e5; }
.sp-aff-iban-alt { margin-top: 12px; font-size: 13px; color: #888; }
.sp-aff-payout-note { font-size: 13px; color: #888; }

/* ── Promo ── */
.sp-aff-promo-box { background: #fff; border: 1px solid #eee; border-radius: 10px; padding: 20px; }
.sp-aff-promo-box h3 { margin: 0 0 12px; font-size: 16px; }
.sp-aff-promo-items { display: flex; flex-direction: column; gap: 16px; }
.sp-aff-promo-item { background: #f9f9f9; border-radius: 8px; padding: 14px; }
.sp-aff-promo-item strong { display: block; margin-bottom: 6px; }
.sp-aff-promo-item code { display: block; padding: 8px; background: #eee; border-radius: 4px; word-break: break-all; font-size: 13px; }
.sp-aff-promo-text { width: 100%; min-height: 80px; padding: 10px; border: 1px solid #ddd; border-radius: 6px; font-size: 13px; resize: vertical; background: #fff; }
.sp-aff-promo-item ul { margin: 0; padding-left: 0; list-style: none; }
.sp-aff-promo-item li { padding: 4px 0; font-size: 14px; }

/* ── Notices ── */
.sp-aff-notice { padding: 20px; border-radius: 10px; margin-bottom: 24px; }
.sp-aff-notice h3 { margin: 0 0 8px; }
.sp-aff-notice-warning { background: #fff8e1; border: 1px solid #f59e0b; color: #92400e; }
.sp-aff-notice-error { background: #fef2f2; border: 1px solid #ef4444; color: #991b1b; }

/* ── Formulaire inscription ── */
.sp-aff-register-hero { text-align: center; padding: 24px 0 20px; }
.sp-aff-register-hero h2 { font-size: 22px; margin-bottom: 8px; }
.sp-aff-register-perks { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 16px; }
.sp-aff-perk { background: #fff8e1; border: 1px solid #d4a017; border-radius: 20px; padding: 6px 14px; font-size: 13px; font-weight: 500; color: #8b6914; }
.sp-aff-form { background: #f9f9f9; border-radius: 12px; padding: 24px; margin-top: 20px; }
.sp-aff-form h3 { margin: 0 0 16px; font-size: 18px; }
.sp-aff-form h4 { margin: 20px 0 10px; font-size: 15px; color: #666; }
.sp-aff-form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sp-aff-form-field { margin-bottom: 12px; }
.sp-aff-form-field label { display: block; font-size: 13px; font-weight: 600; margin-bottom: 4px; color: #555; }
.sp-aff-form-field input { width: 100%; padding: 10px 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; box-sizing: border-box; }
.sp-aff-form-field input:focus { border-color: #d4a017; outline: none; box-shadow: 0 0 0 2px rgba(212,160,23,0.15); }
.sp-aff-form-submit { text-align: center; margin-top: 20px; }
.sp-aff-submit-btn { padding: 14px 32px; background: #d4a017; color: #fff; border: none; border-radius: 8px; font-size: 16px; font-weight: 700; cursor: pointer; transition: background 0.15s; }
.sp-aff-submit-btn:hover { background: #b8900f; }
.sp-aff-form-message { margin-top: 12px; text-align: center; padding: 10px; border-radius: 6px; }
.sp-aff-form-message.success { background: #ecfdf5; color: #065f46; }
.sp-aff-form-message.error { background: #fef2f2; color: #991b1b; }

/* ── Ref code edit ── */
.sp-aff-ref-edit { display: flex; align-items: center; gap: 0; margin-top: 10px; flex-wrap: wrap; }
.sp-aff-ref-label { background: #eee; color: #888; padding: 8px 10px; font-size: 13px; border: 1px solid #ccc; border-right: none; border-radius: 6px 0 0 6px; white-space: nowrap; }
.sp-aff-ref-input { flex: 0 0 140px; padding: 8px 10px; border: 1px solid #ccc; font-size: 14px; font-weight: 600; color: #333; outline: none; box-sizing: border-box; }
.sp-aff-ref-input:focus { border-color: #d4a017; box-shadow: 0 0 0 2px rgba(212,160,23,0.15); }
.sp-aff-ref-save-btn { padding: 8px 14px; background: #d4a017; color: #fff; border: 1px solid #d4a017; border-radius: 0 6px 6px 0; font-size: 13px; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background 0.15s; }
.sp-aff-ref-save-btn:hover { background: #b8900f; }
.sp-aff-ref-msg { margin-left: 10px; font-size: 13px; }
.sp-aff-ref-msg.success { color: #16a34a; }
.sp-aff-ref-msg.error { color: #dc2626; }

/* ── Fix thème WoodMart dark sur page affiliation ──
   WoodMart force color: var(--qr-text-primary/secondary) !important
   sur .woocommerce-MyAccount-content h2/h3 et le body content.
   On doit utiliser une spécificité plus haute + !important pour gagner.
   ────────────────────────────────────────────────────────────────── */

/* Base text color */
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-notice {
    color: #333 !important;
}

/* Titres — écraser le var(--qr-text-primary) !important de WoodMart */
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard h2,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard h3,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard h2,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard h3,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register h2,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register h3,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register h4,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-notice h3 {
    color: #1a1a1a !important;
}

/* Paragraphes, labels, listes */
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard p,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard label,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard li,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-dashboard small,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard p,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard label,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-reseller-dashboard small,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register p,
.woocommerce-account .woocommerce-MyAccount-content .sp-aff-register label {
    color: #555 !important;
}

/* Boxes */
.sp-aff-link-box, .sp-aff-chart-box, .sp-aff-payment-box, .sp-aff-promo-box,
.sp-aff-history, .sp-aff-promo-item, .sp-aff-form { color: #333 !important; }
.sp-aff-promo-item strong { color: #1a1a1a !important; }
/* Tableau de commissions dans le bloc historique (fond blanc) : cellules lisibles */
.sp-aff-history .sp-aff-table td { color: #333 !important; }

/* KPIs */
.sp-aff-kpi-value { color: #1a1a1a !important; }
.sp-aff-kpi-highlight .sp-aff-kpi-value { color: #d4a017 !important; }
.sp-aff-kpi-label { color: #888 !important; }

/* Tableau — héritage admin clair, désormais surchargé par le bloc front
   (lignes 191+). On garde uniquement les règles compatibles avec le fond sombre. */
.sp-aff-table th { color: #fbbf24 !important; }
.sp-aff-table td { color: #e5e7eb !important; }

/* Inputs, textarea, code — fond clair + texte foncé */
.sp-aff-link-input,
.sp-aff-ref-input,
.sp-aff-promo-text,
.sp-aff-form-field input,
.sp-aff-form-field select,
.sp-aff-promo-item code {
    background: #fff !important;
    color: #333 !important;
    border-color: #ccc !important;
}

@media (max-width: 600px) {
    .sp-aff-kpis { grid-template-columns: repeat(2, 1fr); }
    .sp-aff-form-row { grid-template-columns: 1fr; }
    .sp-aff-link-row { flex-direction: column; }
    .sp-aff-table { font-size: 12px; }
    .sp-aff-table th, .sp-aff-table td { padding: 8px 6px; }
}

/* ── Filtres transactions ── */
.sp-aff-filters { background:rgba(255,255,255,.04); border-radius:8px; padding:14px 16px; border:1px solid rgba(255,255,255,.08); }
.sp-aff-filter-label { display:block; font-size:11px; color:#9ca3af; margin-bottom:4px; text-transform:uppercase; letter-spacing:.5px; }
.sp-aff-filter-select { background:#1a1a1a; color:#fff; border:1px solid rgba(255,255,255,.15); border-radius:6px; padding:7px 10px; font-size:13px; min-width:140px; cursor:pointer; }
.sp-aff-filter-select:focus { outline:none; border-color:#fbbf24; }
.sp-aff-filter-btn { background:#fbbf24; color:#0f0f0f; border:none; border-radius:6px; padding:8px 16px; font-size:13px; font-weight:700; cursor:pointer; align-self:flex-end; transition:background .15s; }
.sp-aff-filter-btn:hover { background:#f59e0b; }
.sp-aff-filter-reset { align-self:flex-end; color:#9ca3af; font-size:12px; text-decoration:none; padding:8px 4px; }
.sp-aff-filter-reset:hover { color:#ef4444; }
.sp-aff-filter-count { align-self:flex-end; color:#6b7280; font-size:12px; padding:8px 0; margin-left:auto; }

/* ── Page ventes / transactions ── */
.sp-aff-ventes-page { max-width:900px; margin:0 auto; padding:0 8px; }
.sp-aff-ventes-header { margin-bottom:24px; }
.sp-aff-ventes-header h2 { font-size:20px; font-weight:700; color:var(--qr-text,#fff); margin:0 0 4px; }

.sp-aff-table { width:100%; border-collapse:collapse; margin-bottom:20px; font-size:13px; }
.sp-aff-table thead th { background:#1a1a1a; color:#fbbf24; padding:10px 12px; text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.5px; border-bottom:2px solid #fbbf24; }
.sp-aff-table tbody tr:nth-child(even) { background:rgba(255,255,255,.03); }
.sp-aff-table tbody td { padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.06); vertical-align:middle; }

.sp-aff-status-approved { background:#1e3a1e; color:#4ade80; padding:2px 8px; border-radius:99px; font-size:11px; white-space:nowrap; }
.sp-aff-status-paid     { background:#1a2e1a; color:#86efac; padding:2px 8px; border-radius:99px; font-size:11px; white-space:nowrap; }
.sp-aff-status-pending  { background:#2d2000; color:#fbbf24; padding:2px 8px; border-radius:99px; font-size:11px; white-space:nowrap; }
.sp-aff-status-cancelled{ background:#2d1010; color:#f87171; padding:2px 8px; border-radius:99px; font-size:11px; white-space:nowrap; }

.sp-aff-notice { border-radius:8px; padding:14px 16px; margin-bottom:20px; }
.sp-aff-notice-warning { background:#2d2000; border:1px solid #fbbf24; }
.sp-aff-notice-warning h3 { color:#fbbf24; font-size:14px; margin:0 0 6px; }
.sp-aff-notice-warning p { color:#d1a535; font-size:12px; line-height:1.7; margin:0; }
.sp-aff-notice-warning a { color:#fbbf24; }

.sp-aff-empty { text-align:center; color:#6b7280; padding:40px 20px; font-size:14px; }

/* ── Pagination ── */
.sp-aff-pagination { display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-top:16px; }
.sp-aff-page-btn { display:inline-block; padding:6px 12px; background:#f3f4f6; color:#374151; border-radius:6px; font-size:13px; font-weight:500; text-decoration:none; border:1px solid #e5e7eb; transition:all 0.15s; }
.sp-aff-page-btn:hover { background:#e5e7eb; color:#111; }
.sp-aff-page-btn.active { background:#d4a017; color:#fff; border-color:#d4a017; }

/* ── Classes communes affilié / revendeur ── */
.sp-aff-kpi-sub { display:block; font-size:10px; color:#9ca3af; margin-top:2px; }
.sp-aff-btn-disabled { opacity:0.5; cursor:not-allowed; }
.sp-aff-note-error { color:#dc2626 !important; }
.sp-aff-msg { font-size:12px; display:block; margin-top:6px; }
.sp-aff-badge-bonus { font-size:11px; padding:2px 8px; border-radius:99px; background:#E6F1FB; color:#185FA5; }
.sp-aff-iban-section { margin-top:16px; padding-top:16px; border-top:1px solid #e5e7eb; }
.sp-aff-iban-label { font-size:13px; font-weight:600; display:block; margin-bottom:6px; }

/* ── Revendeur — QR Code section ── */
.sp-aff-qr-section { margin-top:16px; padding-top:16px; border-top:1px solid #e5e7eb; }
.sp-aff-qr-title { font-size:13px; font-weight:600; margin-bottom:10px; }
.sp-aff-qr-wrap { margin-bottom:10px; }

/* ── Revendeur — Historique header ── */
.sp-aff-history-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:12px; }
.sp-aff-history-header h3 { margin:0; }

/* ── Revendeur — Promos ── */
.sp-aff-promo-row { display:flex; align-items:center; justify-content:space-between; padding:12px; background:#f9f9f9; border-radius:8px; margin:12px 0; }
.sp-aff-promo-label { font-size:14px; font-weight:500; display:block; margin-bottom:8px; }
.sp-aff-promo-slider-wrap { padding:12px; background:#f9f9f9; border-radius:8px; margin:12px 0; }
.sp-aff-promo-slider-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.sp-aff-promo-slider-row input[type=range] { flex:1; min-width:150px; accent-color:#d4a017; }
.sp-aff-discount-value { font-size:20px; font-weight:700; min-width:52px; text-align:center; color:#d4a017; }
.sp-aff-toggle { width:44px; height:24px; border-radius:99px; position:relative; cursor:pointer; transition:background 0.2s; flex-shrink:0; }
.sp-aff-toggle-dot { position:absolute; top:2px; width:20px; height:20px; border-radius:99px; background:#fff; transition:all 0.2s; }

/* ── Classes revendeur manquantes ── */
.sp-aff-history-box { margin-bottom: 24px; }
.sp-aff-history-box h3 { font-size: 16px; margin-bottom: 12px; }
.sp-aff-empty { color: #888; font-style: italic; padding: 16px 0; }
.sp-aff-status-pending   { color: #d97706; font-size: 12px; font-weight: 600; }
.sp-aff-status-approved  { color: #2563eb; font-size: 12px; font-weight: 600; }
.sp-aff-status-paid      { color: #16a34a; font-size: 12px; font-weight: 600; }
.sp-aff-status-cancelled { color: #dc2626; font-size: 12px; font-weight: 600; }
.sp-aff-toggle { transition: background 0.2s; }

/* ── Paliers de commission (v8.9.31) ── */
.sp-aff-tier-box { background: #fff; border: 1px solid #e5e7eb; border-radius: 10px; padding: 18px 22px; margin-bottom: 20px; }
.sp-aff-tier-current { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.sp-aff-tier-badge { background: #fbbf24; color: #0f0f0f; font-weight: 700; font-size: 13px; padding: 4px 12px; border-radius: 20px; }
.sp-aff-tier-rate { color: #374151; font-size: 14px; }
.sp-aff-tier-next { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: #6b7280; }
.sp-aff-tier-bar { height: 8px; background: #f3f4f6; border-radius: 4px; overflow: hidden; }
.sp-aff-tier-bar-fill { height: 100%; background: linear-gradient(90deg, #fbbf24, #f59e0b); border-radius: 4px; transition: width .4s ease; }
.sp-aff-tier-bar-label { font-size: 11px; color: #9ca3af; }

/* ── Parrainage partenaire (v8.9.31) ── */
.sp-aff-referral-box { background: #f9fafb; border: 1px solid #e5e7eb; border-left: 3px solid #fbbf24; border-radius: 10px; padding: 18px 22px; margin-bottom: 20px; }
.sp-aff-referral-box h3 { margin: 0 0 8px; font-size: 15px; color: #1a1a1a; }
.sp-aff-referral-box p { margin: 0 0 12px; color: #6b7280; font-size: 13px; }
.sp-aff-referral-list { margin-top: 12px; font-size: 12px; color: #374151; }
.sp-aff-referral-list ul { margin: 6px 0 0 16px; padding: 0; list-style: disc; }
.sp-aff-referral-list li { margin-bottom: 3px; }