/* ============================================================
   PANEL ADMIN — refonte dans la direction du site (noir + vert #d4ff00)
   Objectif : meilleure lisibilite / accessibilite (espacements,
   regroupement, champs plus grands, contrastes), pas juste la couleur.
   ============================================================ */

/* ---------- Conteneur + header ---------- */
html.mc #admin-panel{width:min(660px,100vw) !important;background:#0a0a0a !important;border-left:1px solid rgba(212,255,0,.22) !important;color:#f6f6f1 !important;box-shadow:-24px 0 60px rgba(0,0,0,.6) !important}
html.mc #admin-panel *{font-family:'Inter Tight',system-ui,sans-serif}
/* Mode plein ecran (bouton agrandir) : prioritaire sur la largeur par defaut */
html.mc #admin-panel.ap-fullscreen{width:100vw !important;max-width:100vw !important;border-left:none !important}
@media(min-width:900px){
  html.mc #admin-panel.ap-fullscreen .ap-grid,
  html.mc #admin-panel.ap-fullscreen #ap-promo-fields{grid-template-columns:repeat(3,1fr) !important}
}
html.mc #ap-header{padding:16px 22px !important;background:linear-gradient(180deg,#141414,#0a0a0a) !important;border-bottom:1px solid rgba(255,255,255,.07) !important}
html.mc #ap-header-title{font-family:'Anton',sans-serif !important;font-weight:400 !important;font-size:1.2rem !important;letter-spacing:.09em !important;color:#fff !important;text-transform:uppercase}
html.mc #admin-logout-btn{background:rgba(231,76,60,.12) !important;border:1px solid rgba(231,76,60,.4) !important;color:#ff6b5e !important;border-radius:8px !important;font-weight:700 !important;font-size:.72rem !important;padding:8px 14px !important}
html.mc #admin-logout-btn:hover{background:rgba(231,76,60,.2) !important}
html.mc #ap-close-btn,html.mc #ap-header-actions button{background:rgba(255,255,255,.05) !important;border:1px solid rgba(255,255,255,.12) !important;color:#d6d6cf !important;border-radius:8px !important}
html.mc #ap-close-btn:hover,html.mc #ap-header-actions button:hover{background:rgba(255,255,255,.1) !important;color:#fff !important}

/* ---------- Barre d'onglets ---------- */
html.mc #ap-tabs{background:#0a0a0a !important;border-bottom:1px solid rgba(255,255,255,.07) !important;padding:10px 12px !important;gap:6px !important}
html.mc #admin-panel .ap-tab{min-width:72px !important;flex:1 0 auto !important;border-radius:10px !important;border:1px solid transparent !important;color:#8a8a82 !important;font-size:.64rem !important;font-weight:700 !important;letter-spacing:.02em !important;gap:5px !important;padding:10px 8px !important}
html.mc #admin-panel .ap-tab svg{width:20px !important;height:20px !important}
html.mc #admin-panel .ap-tab:hover{background:rgba(255,255,255,.05) !important;color:#d6d6cf !important}
html.mc #admin-panel .ap-tab.active{background:rgba(212,255,0,.14) !important;border-color:rgba(212,255,0,.55) !important;color:#d4ff00 !important}
html.mc #admin-panel #ap-tab-btn-pending.has-pending{color:#ff6b5e !important;border-color:rgba(231,76,60,.5) !important;background:rgba(231,76,60,.12) !important}
html.mc #admin-panel .ap-badge{background:#e74c3c !important}

/* ---------- Contenu : respiration ---------- */
html.mc .ap-tab-content{padding:20px 22px !important}

/* ---------- Formulaire Ajouter : grille claire ---------- */
html.mc #admin-panel .ap-grid{display:grid !important;grid-template-columns:1fr 1fr !important;gap:18px 18px !important;align-items:end !important}
html.mc #admin-panel .ap-full{grid-column:1 / -1 !important}
html.mc #admin-panel .af{display:flex !important;flex-direction:column !important;gap:7px !important;min-width:0 !important}
html.mc #admin-panel .af label,
html.mc #admin-panel label{font-size:.66rem !important;font-weight:800 !important;letter-spacing:.07em !important;text-transform:uppercase !important;color:#9a9a90 !important}
html.mc #admin-panel input:not([type=checkbox]):not([type=radio]):not([type=file]),
html.mc #admin-panel select,
html.mc #admin-panel textarea{width:100% !important;background:#141414 !important;border:1px solid rgba(255,255,255,.12) !important;border-radius:10px !important;color:#f6f6f1 !important;font-size:.92rem !important;padding:12px 14px !important;box-sizing:border-box !important;transition:border-color .15s,box-shadow .15s}
html.mc #admin-panel input::placeholder,html.mc #admin-panel textarea::placeholder{color:#6f6f68 !important}
html.mc #admin-panel input:focus,
html.mc #admin-panel select:focus,
html.mc #admin-panel textarea:focus{outline:none !important;border-color:rgba(212,255,0,.65) !important;box-shadow:0 0 0 3px rgba(212,255,0,.14) !important}
html.mc #admin-panel textarea{min-height:96px !important;resize:vertical !important;line-height:1.5}
html.mc #admin-panel select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#9a9a90 50%),linear-gradient(135deg,#9a9a90 50%,transparent 50%);background-position:calc(100% - 18px) 55%,calc(100% - 13px) 55%;background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:34px !important}
html.mc #admin-panel .promo-toggle-row{display:flex !important;align-items:center !important;gap:9px !important;background:#141414 !important;border:1px solid rgba(255,255,255,.1) !important;border-radius:10px !important;padding:11px 14px !important}
html.mc #admin-panel .promo-toggle-row label{text-transform:none !important;font-size:.85rem !important;font-weight:700 !important;color:#e6e6df !important;letter-spacing:0 !important}
html.mc #admin-panel .promo-toggle-row input[type=checkbox]{width:18px !important;height:18px !important;accent-color:#d4ff00 !important}
html.mc #ap-promo-fields.visible{display:grid !important;grid-template-columns:1fr 1fr !important;gap:18px !important;padding:16px !important;border:1px dashed rgba(212,255,0,.3) !important;border-radius:12px !important;background:rgba(212,255,0,.04) !important}

/* ---------- Tags ---------- */
html.mc #admin-panel #ap-tags-zone,html.mc #admin-panel #ap-pd-tags-zone{gap:8px !important;padding:4px 0 !important}
html.mc #admin-panel .ap-tag-btn{background:#141414 !important;border:1px solid rgba(255,255,255,.12) !important;color:#c9c9c2 !important;border-radius:20px !important;font-size:.74rem !important;font-weight:600 !important;padding:8px 13px !important;transition:all .12s}
html.mc #admin-panel .ap-tag-btn:hover{border-color:rgba(212,255,0,.45) !important;color:#fff !important}
html.mc #admin-panel .ap-tag-btn.selected{background:rgba(212,255,0,.16) !important;border-color:#d4ff00 !important;color:#d4ff00 !important;font-weight:700 !important}

/* ---------- Libelles de section ---------- */
html.mc #admin-panel .ap-photos-label,
html.mc #admin-panel [style*="letter-spacing:1.5px"],
html.mc #admin-panel [style*="letter-spacing: 1.5px"]{color:#d4ff00 !important;font-weight:800 !important;letter-spacing:.14em !important;text-transform:uppercase}

/* ---------- Zone photos ---------- */
html.mc #admin-panel .ap-photo-slot,html.mc #admin-panel #ap-photos-zone>*{border-radius:10px !important}
html.mc #admin-panel .ap-photo-slot{border:1px dashed rgba(255,255,255,.18) !important;background:#141414 !important}
html.mc #admin-panel .ap-photo-slot:hover{border-color:rgba(212,255,0,.5) !important}

/* ---------- Boutons d'action ---------- */
html.mc #admin-add-btn,
html.mc #admin-panel .ap-submit-row button,
html.mc #admin-panel #ap-pd-publish-btn,
html.mc #admin-panel button[onclick*="save"],
html.mc #admin-panel button[onclick*="Save"]{background:#d4ff00 !important;color:#0a0a0a !important;border:none !important;border-radius:10px !important;font-family:'Anton',sans-serif !important;font-weight:400 !important;letter-spacing:.04em !important;text-transform:uppercase !important;font-size:.95rem !important;padding:14px 20px !important;cursor:pointer}
html.mc #admin-add-btn:hover,html.mc #admin-panel .ap-submit-row button:hover,html.mc #admin-panel #ap-pd-publish-btn:hover{background:#e8ff66 !important}
html.mc #admin-panel .ap-submit-row{margin-top:10px !important}

/* ---------- Filtres jeu (Gerer) ---------- */
html.mc #admin-panel .apg-chip{background:#141414 !important;border:1px solid rgba(255,255,255,.1) !important;color:#9a9a90 !important;border-radius:20px !important;padding:7px 13px !important}
html.mc #admin-panel .apg-chip .apg-count{background:rgba(255,255,255,.08) !important;color:inherit !important}
html.mc #admin-panel .apg-chip:hover{color:#e6e6df !important;border-color:rgba(255,255,255,.2) !important}
html.mc #admin-panel .apg-chip.active{color:#0a0a0a !important;font-weight:800 !important}
html.mc #admin-panel .apg-chip[data-g="all"].active{background:#e8e8e2 !important;border-color:#e8e8e2 !important}
html.mc #admin-panel .apg-chip[data-g="cod"].active{background:#d4ff00 !important;border-color:#d4ff00 !important}

/* ---------- Sous-onglets Dispo/Vendu ---------- */
html.mc #admin-panel .ap-manage-tab{background:#141414 !important;border:1px solid rgba(255,255,255,.1) !important;color:#b9b9b2 !important;border-radius:9px !important;font-weight:700 !important;padding:8px 16px !important}
html.mc #admin-panel .ap-manage-tab.active{background:rgba(212,255,0,.14) !important;border-color:rgba(212,255,0,.5) !important;color:#d4ff00 !important}
html.mc #admin-panel .ap-manage-tab.vendu-tab.active{background:rgba(231,76,60,.14) !important;border-color:rgba(231,76,60,.5) !important;color:#ff6b5e !important}

/* ---------- Cartes de gestion ---------- */
html.mc #admin-panel #ap-manage-list,html.mc #admin-panel #ap-manage-list-vendu{grid-template-columns:repeat(auto-fill,minmax(200px,1fr)) !important;gap:14px !important}
html.mc #admin-panel .amc{background:#141414 !important;border:1px solid rgba(255,255,255,.08) !important;border-radius:12px !important}
html.mc #admin-panel .amc:hover{border-color:rgba(212,255,0,.4) !important;transform:translateY(-2px)}
html.mc #admin-panel .amc-title{color:#f0f0ea !important;font-size:.85rem !important}
html.mc #admin-panel .amc-price{color:#d4ff00 !important;font-family:'Anton',sans-serif !important;font-weight:400 !important}
html.mc #admin-panel .amc-game-tag.g-cod{background:#d4ff00 !important;color:#0a0a0a !important}
html.mc #admin-panel .amc-thumb-placeholder{background:#0d0d0d !important}
html.mc #admin-panel .amc-btn{color:#9a9a90 !important;border-right-color:rgba(255,255,255,.07) !important;font-size:.62rem !important;padding:9px 4px !important}
html.mc #admin-panel .amc-btn.edit:hover{background:rgba(212,255,0,.14) !important;color:#d4ff00 !important}
html.mc #admin-panel .amc-btn.rep:hover{background:rgba(74,222,128,.14) !important;color:#4ade80 !important}

/* ---------- Comptes en attente (liste + detail) ---------- */
html.mc #admin-panel .pending-card{background:#141414 !important;border:1px solid rgba(255,255,255,.08) !important;border-radius:12px !important;padding:12px 14px !important}
html.mc #admin-panel .pending-card:hover{border-color:rgba(212,255,0,.35) !important}
html.mc #admin-panel .pc-game{background:rgba(212,255,0,.12) !important;color:#d4ff00 !important}
html.mc #admin-panel .pc-status.pending{color:#f1c40f !important}
html.mc #admin-panel #ap-pd-fields>div{background:#141414 !important;border:1px solid rgba(255,255,255,.06) !important;border-radius:10px !important;padding:12px 14px !important}
html.mc #admin-panel #ap-pd-title{font-family:'Anton',sans-serif !important;font-weight:400 !important;letter-spacing:.04em !important}

/* ---------- Messages (inbox) ---------- */
html.mc #admin-panel #ap-inbox-sub-num{color:#d4ff00 !important}
html.mc #admin-panel #ap-inbox-game{background:rgba(212,255,0,.12) !important;color:#d4ff00 !important}

/* ---------- Modal de connexion admin ---------- */
html.mc #admin-modal{background:#0d0d0d !important;border:1px solid rgba(212,255,0,.2) !important}
html.mc #admin-modal h4{font-family:'Anton',sans-serif !important;font-weight:400 !important;color:#fff !important}
html.mc #discord-login-btn{background:#5865f2 !important}

/* ---------- Centre de notifications admin (clochette) ---------- */
html.mc #wz-adm-bell .na-item.unread{background:rgba(212,255,0,.08) !important}
html.mc #wz-adm-bell .na-tt{color:#f6f6f1 !important}

/* ---------- Responsive ---------- */
@media(max-width:600px){
  html.mc #admin-panel{width:100vw !important}
  html.mc #admin-panel .ap-grid,html.mc #ap-promo-fields{grid-template-columns:1fr !important}
  html.mc .ap-tab-content{padding:16px 14px !important}
}