.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* Appliquer le style au selects de variation WooCommerce */
.variations_form .variations select,
.woocommerce div.product form.cart .variations select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    width: 100%;
    padding: 14px 18px;
    font-size: 16px;
    font-weight: 600;
    color: #f1f1f1;
    background: #1a1a1a;
    border: 2px solid #444;
    border-radius: 10px;
    cursor: pointer;
    transition: all 0.25s ease;
}

/* Hover / focus */
.variations_form .variations select:hover { border-color: #ffcc00; background: #222; }
.variations_form .variations select:focus { outline: none; border-color: #ffcc00; box-shadow: 0 0 8px rgba(255,204,0,0.45); }

/* Custom arrow for the native select */
.variations_form .variations {
  position: relative;
}
.variations_form .variations::after {
  content: "▼";
  position: absolute;
  right: 22px;
  top: 18px;
  pointer-events: none;
  color: #ffcc00;
  font-size: 12px;
}
/* Champ quantité (millions) */
.quantity input.qty {
    width: 120px;
    padding: 12px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;

    background: #1c1c1c;
    color: #fff;

    border: 2px solid #444;
    border-radius: 8px;
}

/* Hover / focus */
.quantity input.qty:focus {
    border-color: #ffcc00;
    box-shadow: 0 0 8px rgba(255, 204, 0, 0.6);
    outline: none;
}
/* FORCER l'affichage du champ quantité WooCommerce */
.woocommerce div.product form.cart .quantity,
.woocommerce div.product form.cart .quantity input.qty {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    width: auto !important;
}
/* Design champ quantité (Millions de kamas) */
.quantity input.qty {
    background: #1c1c1c;
    color: #ffffff;
    border: 2px solid #444;
    border-radius: 8px;
    padding: 12px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    width: 120px;
}

/* Focus */
.quantity input.qty:focus {
    border-color: #d1cd32;
    box-shadow: 0 0 6px rgba(209, 205, 50, 0.7);
    outline: none;
}
.kamas-qty-wrapper {
    margin: 15px 0;
}

.kamas-qty-wrapper label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    color: #fff;
}

.kamas-qty-wrapper input {
    width: 140px;
    padding: 12px;
    font-size: 18px;
    font-weight: bold;
    text-align: center;

    background: #1c1c1c;
    color: #fff;

    border: 2px solid #444;
    border-radius: 8px;
}

.kamas-qty-wrapper input:focus {
    border-color: #d1cd32;
    box-shadow: 0 0 6px rgba(209, 205, 50, 0.6);
    outline: none;
}
.kamas-char-wrapper {
    margin: 15px 0;
}

.kamas-char-wrapper label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    color: #fff;
}

.kamas-char-wrapper input {
    width: 100%;
    max-width: 280px;
    padding: 12px;
    font-size: 16px;

    background: #1c1c1c;
    color: #fff;

    border: 2px solid #444;
    border-radius: 8px;
}

.kamas-char-wrapper input:focus {
    border-color: #d1cd32;
    box-shadow: 0 0 6px rgba(209, 205, 50, 0.6);
    outline: none;
}
.kamas-table-wrapper {
    overflow-x: auto;
    margin: 30px 0;
}

.kamas-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.kamas-table thead th {
    background: #dfeaea;
    color: #000;
    padding: 10px;
    text-align: left;
}

.kamas-table td {
    padding: 9px 10px;
    background: #e7f1f1;
}

.kamas-table tr:nth-child(even) td {
    background: #ddeaea;
}

.kamas-table .section td {
    background: #000000CF;
    font-weight: bold;
    text-align: center;
    padding: 12px;
}

.kamas-table .stock {
    color: red;
    font-weight: bold;
}

.kamas-table .incomplete {
    color: #333;
}
/* Par défaut : lignes foncées → texte blanc */
.kamas-table tbody tr td {
    color: #fff;
}

/* Lignes de section (Dofus Kamas / Dofus Touch Kamas) */
.kamas-table tbody tr.section td {
    color: #fff;
    font-weight: bold;
}

/* Lignes à fond blanc (alternance) → texte noir */
.kamas-table tbody tr:nth-child(even):not(.section) td {
    color: #000;
}

/* Statuts */
.kamas-table .stock {
    color: red;
    font-weight: bold;
}

.kamas-table .incomplete {
    color: inherit;
}

.kamas-table td.stock,
.kamas-table .stock,
.kamas-table td[class*="stock"] {
    color: #e60000 !important;
    font-weight: 700;
}

/* formulaire vendre kamas */
#kamasForm {
  background-color: #121212; /* Fond sombre global */
  padding: 20px;
  border-radius: 10px;
  
  margin: 0 auto;
  font-family: Roboto;
  color: #e0e0e0;
}

#kamasForm label {
  display: block;
  margin-top: 20px;
  margin-bottom: 8px;
  font-size: 14px;
  color: #ffffff;
}

#kamasForm input[type="number"],
#kamasForm input[type="text"],
#kamasForm input[type="email"],
#kamasForm select {
  width: 100%;
  padding: 12px 15px;
  background-color: #1e1e1e; /* Fond des champs */
  border: 1px solid #444444; /* Bordure grise */
  border-radius: 8px;
  color: #ffffff;
  font-size: 16px;
  box-sizing: border-box;
}

#kamasForm input[type="number"] {
  text-align: center;
  font-size: 24px;
  font-weight: bold;
}

/* Spécifique pour le champ quantité (comme la boîte 0,1) */
#quantity {
  background-color: #000000;
  border: 2px solid #333333;
  font-size: 28px;
  padding: 15px;
}

/* Style du select avec flèche jaune */
#kamasForm select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23FFD700' d='M2 4l4 4 4-4z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 15px center;
  background-size: 12px;
  padding-right: 40px; /* Espace pour la flèche */
}

/* Focus sur les champs */
#kamasForm input:focus,
#kamasForm select:focus {
  outline: none;
  border-color: #666666;
  box-shadow: 0 0 5px rgba(100, 100, 100, 0.5);
}

/* Boîte du prix */
.price-box {
  margin: 30px 0;
  text-align: center;
  font-size: 18px;
}

.price-box strong {
  font-size: 24px;
  color: #ffffff;
}

/* Bouton de validation */
#kamasForm button[type="submit"] {
  width: 100%;
  padding: 15px;
  background-color: #fbb130; /* Bleu comme le lien "Effacer" */
  color: white;
  border: none;
  border-radius: 8px;
  font-size: 18px;
  cursor: pointer;
  margin-top: 20px;
}

#kamasForm button[type="submit"]:hover {
  background-color: #0056b3;
}

/* Note supplémentaire pour le texte gris clair (ex: "Minimum de commande : 100k" et "Ex : JoloLegend") */
#kamasForm label::after {
  content: attr(data-hint); /* Tu peux ajouter data-hint sur les labels si besoin */
  display: block;
  font-size: 12px;
  color: #aaaaaa;
  margin-top: 4px;
}

/* Exemple d'ajout dans HTML pour les hints (optionnel) */
/*css mon compte*/
/* ====================================
   1. Conteneur principal (Cadre général)
   ==================================== */
.woocommerce-account .woocommerce {
    max-width: 1200px;
    margin: 40px auto;
    padding: 30px;
    background-color: #0f0f0f; /* Fond Noir */
    border-radius: 18px;
    box-shadow: 0 0 40px rgba(255, 215, 0, 0.15); /* Ombre dorée légère */
}

/* ====================================
   2. Navigation (Les Onglets Latéraux)
   ==================================== */

/* Style du conteneur des onglets */
.woocommerce-MyAccount-navigation {
    background-color: #1a1a1a; /* Fond des onglets légèrement plus clair que le fond général */
    padding: 15px;
    border-radius: 12px;
}

/* Style de la liste des liens */
.woocommerce-MyAccount-navigation ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Style de chaque élément de la liste */
.woocommerce-MyAccount-navigation li {
    border-bottom: 1px solid #282828; /* Séparateur gris foncé */
    margin: 0;
}
.woocommerce-MyAccount-navigation li:last-child {
    border-bottom: none;
}

/* Style des liens d'onglets (texte) */
.woocommerce-MyAccount-navigation a {
    display: block;
    padding: 12px 10px;
    color: #cccccc; /* Texte gris clair */
    font-weight: 500;
    text-decoration: none;
    transition: all 0.3s ease;
}

/* Style de l'onglet actif et au survol */
.woocommerce-MyAccount-navigation li.is-active a,
.woocommerce-MyAccount-navigation a:hover {
    color: #ffd700; /* Or Vif */
    background-color: #282828; /* Fond légèrement plus foncé au survol/actif */
    border-radius: 8px;
    padding-left: 15px; /* Petit décalage pour effet visuel */
}

/* ====================================
   3. Contenu de la zone active
   ==================================== */

.woocommerce-MyAccount-content {
    color: #fff; /* Texte blanc */
}

/* Titres de section */
.woocommerce-MyAccount-content h3, 
.woocommerce-MyAccount-content h2 {
    color: #ffd700; /* Titres en Or */
    border-bottom: 1px solid #282828;
    padding-bottom: 10px;
    margin-bottom: 20px;
}

/* Lignes et messages d'information */
.woocommerce-MyAccount-content p, 
.woocommerce-MyAccount-content address {
    color: #cccccc;
}

/* ====================================
   4. Boutons & Actions
   ==================================== */

.woocommerce button,
.woocommerce a.button,
.woocommerce input.button {
    /* Reprise du style du bouton de connexion */
    padding: 12px 25px !important;
    background: #ffd700 !important;
    color: #000 !important;
    font-weight: bold !important;
    border: none !important;
    border-radius: 12px !important;
    cursor: pointer !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
    text-shadow: none !important;
    line-height: 1 !important;
}

.woocommerce button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 0 15px rgba(255, 215, 0, 0.6) !important;
}

/* ====================================
   5. Tables (Commandes, Adresses)
   ==================================== */

.woocommerce-MyAccount-content table {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-MyAccount-content th {
    background-color: #282828; /* En-têtes de tableau en gris foncé */
    color: #ffd700;
    padding: 10px;
    border: 1px solid #1c1c1c;
}

.woocommerce-MyAccount-content td {
    background-color: #1a1a1a; /* Fond des cellules en gris très foncé */
    color: #fff;
    padding: 10px;
    border: 1px solid #1c1c1c;
}
/* Style des messages de WooCommerce (Erreur/Succès) */
.woocommerce-error,
.woocommerce-message,
.woocommerce-info {
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 20px !important;
    font-weight: bold !important;
    list-style: none !important; /* Retire les puces si c'est une liste */
    text-align: center;
}

/* Style des messages d'ERREUR */
.woocommerce-error {
    background-color: #330000 !important; /* Fond Rouge très foncé */
    color: #ff4d4d !important; /* Texte rouge vif */
    border-top-color: #ff4d4d !important;
}

/* Style des messages de SUCCÈS */
.woocommerce-message {
    background-color: #0f1a0f !important; /* Fond Vert très foncé */
    color: #88ff88 !important; /* Texte vert clair */
    border-top-color: #88ff88 !important;
}/* End custom CSS */