/*
Theme Name: Yadel Tracker
Theme URI: https://yadeltracker.com
Author: Yadel
Author URI: https://yadeltracker.com
Description: Thème premium sombre & vert pour l'espace client Yadel Tracker (compte.yadeltracker.com). Optimisé WooCommerce : compte, commandes, abonnements, paiement. Reprend la charte officielle (fond #0E1512, vert #72C11A).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 8.0
License: GNU General Public License v2 or later
Text Domain: yadel-tracker
*/

:root{
  --green:#72C11A; --green-d:#5ea015;
  --bg:#0E1512; --bg2:#060A08; --surface:#17201B; --surface2:#1c2721;
  --line:rgba(255,255,255,.10); --line2:rgba(255,255,255,.16);
  --text:#EAF1EA; --muted:#9BB0A2; --danger:#ff7a6b;
  --radius:14px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.6; -webkit-font-smoothing:antialiased;
}
a{color:var(--green); text-decoration:none}
a:hover{color:var(--green-d)}
h1,h2,h3,h4,h5,h6{color:#fff; line-height:1.2; margin:0 0 .5em}
img{max-width:100%; height:auto}
hr{border:none; border-top:1px solid var(--line); margin:24px 0}

.yt-container{width:100%; max-width:1080px; margin:0 auto; padding:0 22px}
.yt-content{padding:34px 22px 60px}
.yt-content .yt-container, .yt-content{max-width:1080px; margin:0 auto}

/* ---------- Boutons ---------- */
.yt-btn,
.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,
.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt,
.woocommerce input.button.alt,.wp-element-button,button,input[type=submit],input[type=button]{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  background:var(--green); color:#07120A; font-weight:800;
  border:none; border-radius:999px; padding:12px 26px; font-size:15px;
  cursor:pointer; transition:transform .15s ease,background .15s ease; box-shadow:none;
}
.yt-btn:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,
.wp-element-button:hover,button:hover{background:var(--green-d); color:#07120A; transform:translateY(-1px)}
.yt-btn.ghost{background:transparent; color:var(--text); border:1.5px solid var(--line2)}
.yt-btn.ghost:hover{border-color:var(--green); color:var(--green); background:transparent}

/* ---------- Header ---------- */
.yt-header{
  position:sticky; top:0; z-index:50;
  background:rgba(14,21,18,.85); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.yt-nav{display:flex; align-items:center; justify-content:space-between; height:66px; gap:16px}
.yt-brand{display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:.3px; font-size:19px; color:#fff}
.yt-brand:hover{color:#fff}
.yt-brand b{color:var(--green)}
.yt-brand img,.yt-brand .custom-logo{height:38px; width:auto}
.yt-menu{display:flex; align-items:center; gap:8px}
.yt-menu-list{display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0}
.yt-menu-list a{color:var(--muted); padding:8px 14px; font-size:15px; border-radius:8px}
.yt-menu-list a:hover,.yt-menu-list .current-menu-item>a{color:var(--text)}
.yt-burger{display:none; background:transparent; color:var(--text); border:1px solid var(--line2); border-radius:10px; padding:6px 12px; font-size:18px}
.yt-fav-link,.yt-cart-link{color:var(--text); font-size:17px; padding:6px 8px; white-space:nowrap}
.yt-fav-link:hover,.yt-cart-link:hover{color:var(--green)}
.yt-cart-n{font-size:13px; background:var(--green); color:#07120A; border-radius:999px; padding:0 7px; font-weight:800; margin-left:-4px}

@media(max-width:820px){
  .yt-burger{display:inline-flex}
  .yt-menu{position:fixed; inset:66px 0 auto 0; flex-direction:column; align-items:stretch;
    background:var(--bg2); border-bottom:1px solid var(--line); padding:14px 22px; gap:10px;
    transform:translateY(-140%); transition:transform .25s ease}
  body.yt-menu-open .yt-menu{transform:translateY(0)}
  .yt-menu-list{flex-direction:column; align-items:stretch}
}

/* ---------- Hero (front-page) ---------- */
.yt-hero{background:radial-gradient(1000px 420px at 50% -10%,rgba(114,193,26,.14),transparent 60%),linear-gradient(180deg,var(--bg),var(--bg2)); text-align:center}
.yt-hero .yt-container{padding:64px 22px 40px}
.yt-hero h1{font-size:clamp(28px,5vw,44px); font-weight:900; letter-spacing:-.5px}
.yt-hero h1 span{color:var(--green)}
.yt-hero p{color:var(--muted); font-size:clamp(15px,2.4vw,19px); max-width:620px; margin:8px auto 26px}

.yt-cards{display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:18px; margin:10px 0 50px}
.yt-card{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:24px; transition:border-color .15s ease,transform .15s ease}
.yt-card:hover{border-color:var(--green); transform:translateY(-2px)}
.yt-card .ico{width:46px; height:46px; border-radius:12px; display:flex; align-items:center; justify-content:center; background:rgba(114,193,26,.14); margin-bottom:14px; font-size:22px}
.yt-card h3{font-size:18px}
.yt-card p{color:var(--muted); font-size:15px; margin:0 0 14px}

/* ---------- Formulaires ---------- */
input:not([type=submit]):not([type=button]):not([type=checkbox]):not([type=radio]),
textarea,select,.select2-container .select2-selection{
  background:var(--surface)!important; color:var(--text)!important;
  border:1px solid var(--line2)!important; border-radius:10px!important; padding:10px 12px;
}
input:focus,textarea:focus,select:focus{outline:none; border-color:var(--green)!important}
::placeholder{color:var(--muted)}
label{color:var(--text)}

/* ---------- Contenu / cartes / tables ---------- */
.yt-content p,.yt-content li{color:var(--text)}
.entry-title{margin-bottom:18px}
table{border-collapse:collapse; width:100%}
.woocommerce table.shop_table,.woocommerce table.cart,.woocommerce .cart_totals table,
table.woocommerce-orders-table,.woocommerce table.shop_table td,.woocommerce table.shop_table th,
table.woocommerce-orders-table td,table.woocommerce-orders-table th{
  background:var(--surface); border:1px solid var(--line); color:var(--text)
}
.woocommerce table.shop_table thead th{background:var(--surface2)}

/* ---------- WooCommerce : Mon compte ---------- */
.woocommerce-account .woocommerce{display:flex; flex-wrap:wrap; gap:26px}
.woocommerce-MyAccount-navigation{flex:1 1 220px}
.woocommerce-MyAccount-content{flex:3 1 480px; min-width:0}
.woocommerce-MyAccount-navigation ul{list-style:none; margin:0; padding:0}
.woocommerce-MyAccount-navigation li{background:var(--surface); border:1px solid var(--line); border-radius:10px; margin:0 0 8px}
.woocommerce-MyAccount-navigation li a{display:block; padding:11px 15px; color:var(--text); font-weight:600}
.woocommerce-MyAccount-navigation li.is-active{border-color:var(--green)}
.woocommerce-MyAccount-navigation li.is-active a{color:var(--green)}

/* ---------- WooCommerce : notices, prix, produits ---------- */
.woocommerce-message,.woocommerce-info,.woocommerce-noreviews{
  background:var(--surface); color:var(--text); border-top:3px solid var(--green); border-radius:8px}
.woocommerce-error{background:var(--surface); color:var(--text); border-top:3px solid var(--danger); border-radius:8px; list-style:none}
.woocommerce-message::before,.woocommerce-info::before{color:var(--green)}
.woocommerce .price,.woocommerce-Price-amount,.amount{color:var(--green); font-weight:700}
.woocommerce ul.products li.product{background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); padding:16px}
.woocommerce ul.products li.product a img{border-radius:10px}

/* ---------- Cartes plugin (Mes véhicules / suivi) ---------- */
.yt-vehicles>div,.yt-suivi{background:var(--surface)!important; border:1px solid var(--line)!important; border-radius:var(--radius)!important}
.yt-suivi h2,.yt-suivi h3{color:#fff}

/* ---------- Footer ---------- */
.yt-footer{border-top:1px solid var(--line); background:var(--bg2); padding:40px 0 30px; text-align:center; color:var(--muted); font-size:14px}
.yt-footer .yt-brand{justify-content:center; margin-bottom:12px}
.yt-footer a{color:var(--muted); margin:0 8px}
.yt-footer a:hover{color:var(--green)}
.yt-footer .legal{margin:12px 0}
.yt-footer .copy{color:#5c6c62; margin-top:8px}