/**
 * custom-rmd.css — Charte Graphique MySongOriginal 3.0
 * Renouveler Mon Dressing — renouvelermondressing.com
 * Version 2 — corrections header + footer
 * Simple Agence Web & Community
 */

/* ═══════════════════════════════════════════════════
   FONTS
   ═══════════════════════════════════════════════════ */
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Outfit:wght@300;400;500;600;700&display=swap');

/* ═══════════════════════════════════════════════════
   VARIABLES
   ═══════════════════════════════════════════════════ */
:root {
    --rmd-sage:       #7d9a78;
    --rmd-sage-light: #a8c4a2;
    --rmd-forest:     #3d5a3d;
    --rmd-forest-deep:#2a402a;
    --rmd-terra:      #c67b5c;
    --rmd-terra-dark: #a85d3f;
    --rmd-cream:      #faf8f5;
    --rmd-sand:       #e8e2d9;
    --rmd-sand-dark:  #d4cec5;
    --rmd-charcoal:   #2d3029;
    --rmd-grad:       linear-gradient(135deg, #7d9a78 0%, #5a7a55 100%);
    --rmd-grad-deep:  linear-gradient(135deg, #5a7a55 0%, #3d5a3d 100%);
}

/* ═══════════════════════════════════════════════════
   BODY & FOND
   background-color volontairement absent du body :
   évite de rendre visibles les éléments hero
   rendus en double dans le hook displayHeader
   ═══════════════════════════════════════════════════ */
body {
    font-family: 'Outfit', sans-serif !important;
    color: var(--rmd-charcoal) !important;
}

/* Fond cream uniquement sur les zones de contenu */
#main,
#wrapper,
.page-wrapper,
.page-content,
#content-wrapper {
    background-color: var(--rmd-cream) !important;
}

/* ═══════════════════════════════════════════════════
   TYPOGRAPHIE GLOBALE
   ═══════════════════════════════════════════════════ */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Cormorant Garamond', serif !important;
    color: var(--rmd-forest) !important;
    font-weight: 500 !important;
}

p, label, span, li, td, th,
.form-control, input, select, textarea,
.btn, button {
    font-family: 'Outfit', sans-serif !important;
}

/* ═══════════════════════════════════════════════════
   LIENS — uniquement sur fond clair (body/content)
   On NE surcharge PAS les liens dans header/footer
   qui ont déjà leurs propres règles
   ═══════════════════════════════════════════════════ */

/* Liens dans le contenu des pages uniquement */
#content a,
.container a,
.page-content a,
.page-wrapper a,
main a,
article a,
.alert a,
.breadcrumb a {
    color: var(--rmd-sage) !important;
    transition: color 0.2s ease !important;
}

#content a:hover,
.container a:hover,
.page-content a:hover,
.page-wrapper a:hover,
main a:hover,
article a:hover,
.breadcrumb a:hover {
    color: var(--rmd-forest) !important;
    text-decoration: none !important;
}

/* Liens de navigation bas de page (Retour / Accueil) */
.page-footer a,
.footer-right a,
footer-container a {
    color: var(--rmd-sage) !important;
}

.page-footer a:hover {
    color: var(--rmd-forest) !important;
}

/* ═══════════════════════════════════════════════════
   BOUTONS — toutes les variantes
   ═══════════════════════════════════════════════════ */

/* Bouton primaire */
.btn-primary,
a.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary {
    background: var(--rmd-grad) !important;
    background-color: var(--rmd-sage) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
}

.btn-primary:focus,
a.btn-primary:focus {
    outline: 3px solid rgba(125,154,120,0.4) !important;
    outline-offset: 2px !important;
}

/* Bouton secondaire */
.btn-secondary,
a.btn-secondary,
button.btn-secondary {
    background-color: white !important;
    border: 1.5px solid var(--rmd-sand) !important;
    color: var(--rmd-charcoal) !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 500 !important;
    border-radius: 8px !important;
    transition: all 0.25s ease !important;
}

.btn-secondary:focus,
a.btn-secondary:focus {
    outline: 3px solid rgba(232,226,217,0.8) !important;
}

/* Bouton outline primaire */
.btn-outline-primary,
a.btn-outline-primary {
    border: 1.5px solid var(--rmd-sage) !important;
    color: var(--rmd-sage) !important;
    background: transparent !important;
    border-radius: 8px !important;
}

.btn-outline-primary:hover,
a.btn-outline-primary:hover {
    background: var(--rmd-grad) !important;
    color: white !important;
    border-color: transparent !important;
}

/* Bouton success */
.btn-success, a.btn-success {
    background: var(--rmd-grad) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
    border-radius: 8px !important;
}

.btn-success:focus, a.btn-success:focus {
    outline: 3px solid rgba(125,154,120,0.4) !important;
}

/* Bouton warning */
.btn-warning, a.btn-warning {
    background: linear-gradient(135deg, #c67b5c 0%, #a85d3f 100%) !important;
    border-color: var(--rmd-terra) !important;
    color: white !important;
    border-radius: 8px !important;
}

.btn-warning:focus, a.btn-warning:focus {
    outline: 3px solid rgba(198,123,92,0.4) !important;
}

/* Bouton outline primaire focus */
.btn-outline-primary:focus, a.btn-outline-primary:focus {
    outline: 3px solid rgba(125,154,120,0.4) !important;
}

/* Bouton danger */
.btn-danger, a.btn-danger {
    background: linear-gradient(135deg, #c67b6a 0%, #a85a4a 100%) !important;
    border-color: #c67b6a !important;
    color: white !important;
    border-radius: 8px !important;
}

/* Style général boutons */
.btn {
    border-radius: 8px !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;     /* annule les MAJUSCULES du Classic */
}

/* Hover boutons — légère opacité, pas de changement de couleur brutal */
.btn-primary:hover,
a.btn-primary:hover,
button.btn-primary:hover {
    background: var(--rmd-grad) !important;
    background-color: var(--rmd-sage) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
    opacity: 0.9 !important;
    transform: none !important;
    box-shadow: none !important;
}

.btn-secondary:hover,
a.btn-secondary:hover {
    background-color: rgba(232,226,217,0.4) !important;
    border-color: var(--rmd-sand) !important;
    color: var(--rmd-charcoal) !important;
    transform: none !important;
    box-shadow: none !important;
}

.btn-success:hover,
a.btn-success:hover {
    background: var(--rmd-grad) !important;
    background-color: var(--rmd-sage) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
    opacity: 0.9 !important;
    transform: none !important;
}

.btn-warning:hover,
a.btn-warning:hover {
    background-color: var(--rmd-terra) !important;
    border-color: var(--rmd-terra) !important;
    color: white !important;
    opacity: 0.9 !important;
    transform: none !important;
}

.btn-danger:hover,
a.btn-danger:hover {
    color: white !important;
    opacity: 0.9 !important;
    transform: none !important;
}

.btn-outline-primary:hover,
a.btn-outline-primary:hover {
    background: var(--rmd-grad) !important;
    color: white !important;
    border-color: transparent !important;
    transform: none !important;
}

/* ═══════════════════════════════════════════════════
   FORMULAIRES
   ═══════════════════════════════════════════════════ */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
input[type="search"],
select,
textarea {
    border: 1.5px solid var(--rmd-sand) !important;
    border-radius: 8px !important;
    font-family: 'Outfit', sans-serif !important;
    color: var(--rmd-charcoal) !important;
    background-color: var(--rmd-cream) !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease !important;
}

.form-control:focus,
input[type="text"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
select:focus,
textarea:focus {
    border-color: var(--rmd-sage) !important;
    background-color: white !important;
    box-shadow: 0 0 0 3px rgba(125,154,120,0.15) !important;
    outline: none !important;
}

label,
.form-control-label {
    font-family: 'Outfit', sans-serif !important;
    color: var(--rmd-forest) !important;
    font-weight: 600 !important;
}

/* Checkboxes */
.custom-checkbox input:checked ~ span,
.custom-radio input:checked ~ span {
    background-color: var(--rmd-sage) !important;
    border-color: var(--rmd-sage) !important;
}

/* ═══════════════════════════════════════════════════
   HEADER — on garde les liens EN BLANC
   On ne touche PAS la couleur de fond (déjà custom)
   ═══════════════════════════════════════════════════ */

/* Liens dans le header → blanc — pas de transform ni shadow */
#header a,
#header .top-menu a,
#header .header-nav a,
.header-nav .right-nav a,
#header .btn,
#header button {
    color: white !important;
    transform: none !important;
    box-shadow: none !important;
}

#header a:hover,
#header .top-menu a:hover,
#header .btn:hover,
#header button:hover {
    color: rgba(255,255,255,0.75) !important;
    background-color: transparent !important;
    transform: none !important;
    box-shadow: none !important;
    border-color: transparent !important;
}

/* Typographie menu */
#header .top-menu > li > a,
.top-menu > li > a {
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    text-transform: none !important;
    letter-spacing: 0.03em !important;
}

/* Sous-menus */
.popover,
.sub-menu ul,
.dropdown-menu {
    border: 1.5px solid var(--rmd-sand) !important;
    border-radius: 10px !important;
    box-shadow: 0 8px 24px rgba(61,90,61,0.12) !important;
}

/* Liens dans les sous-menus → sage (fond clair) */
.sub-menu a,
.dropdown-menu a,
.popover a {
    color: var(--rmd-charcoal) !important;
    font-family: 'Outfit', sans-serif !important;
}

.sub-menu a:hover,
.dropdown-menu a:hover {
    color: var(--rmd-forest) !important;
}

/* Compteur panier */
.blockcart .cart-products-count {
    background-color: var(--rmd-terra) !important;
}

/* ═══════════════════════════════════════════════════
   BREADCRUMB
   ═══════════════════════════════════════════════════ */
.breadcrumb {
    background: transparent !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.85rem !important;
}

.breadcrumb a {
    color: var(--rmd-sage) !important;
}

.breadcrumb li.current a,
.breadcrumb li.current span {
    color: var(--rmd-charcoal) !important;
}

/* ═══════════════════════════════════════════════════
   ALERTES
   ═══════════════════════════════════════════════════ */
.alert-success {
    background-color: rgba(125,154,120,0.12) !important;
    border-color: var(--rmd-sage-light) !important;
    color: var(--rmd-forest) !important;
    border-radius: 10px !important;
}

.alert-danger, .alert-error {
    background-color: rgba(198,123,92,0.08) !important;
    border-color: rgba(198,123,92,0.35) !important;
    color: var(--rmd-terra-dark) !important;
    border-radius: 10px !important;
}

.alert-warning {
    background-color: rgba(198,123,92,0.07) !important;
    border-color: rgba(198,123,92,0.3) !important;
    color: var(--rmd-terra-dark) !important;
    border-radius: 10px !important;
}

.alert-info {
    background-color: rgba(232,226,217,0.5) !important;
    border-color: var(--rmd-sand) !important;
    color: var(--rmd-charcoal) !important;
    border-radius: 10px !important;
}

/* ═══════════════════════════════════════════════════
   PAGINATION
   ═══════════════════════════════════════════════════ */
.pagination .page-item.active .page-link {
    background: var(--rmd-grad) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
}

.pagination .page-link {
    color: var(--rmd-sage) !important;
    font-family: 'Outfit', sans-serif !important;
    border-color: var(--rmd-sand) !important;
}

.pagination .page-link:hover {
    color: var(--rmd-forest) !important;
    border-color: var(--rmd-sage-light) !important;
    background-color: rgba(168,196,162,0.15) !important;
}

/* ═══════════════════════════════════════════════════
   PRODUITS & LISTING
   ═══════════════════════════════════════════════════ */
.product-miniature .product-title a,
.product-title a {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 500 !important;
    color: var(--rmd-forest) !important;
}

.product-miniature .product-title a:hover {
    color: var(--rmd-sage) !important;
}

.product-price-and-shipping .price {
    color: var(--rmd-forest) !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 700 !important;
}

.product-miniature {
    border-radius: 10px !important;
    transition: box-shadow 0.3s ease, transform 0.3s ease !important;
}

.product-miniature:hover {
    box-shadow: 0 8px 24px rgba(61,90,61,0.12) !important;
    transform: translateY(-3px) !important;
}

.btn-add-to-cart,
.add-to-cart,
.product-add-to-cart .btn {
    background: var(--rmd-grad) !important;
    border-color: var(--rmd-sage) !important;
    color: white !important;
    border-radius: 8px !important;
}

.btn-add-to-cart:hover,
.add-to-cart:hover {
    background: var(--rmd-grad-deep) !important;
}

.discount-percentage,
.discount-amount,
.product-flag.discount {
    background-color: var(--rmd-terra) !important;
}

.product-flag.new {
    background-color: var(--rmd-sage) !important;
}

/* ═══════════════════════════════════════════════════
   CHECKOUT
   ═══════════════════════════════════════════════════ */
.cart-total .value,
.cart-summary-line .value {
    color: var(--rmd-forest) !important;
    font-weight: 700 !important;
}

.checkout-step.-current .step-number,
.checkout-step.-complete .step-number {
    background-color: var(--rmd-sage) !important;
    border-color: var(--rmd-sage) !important;
}

/* ═══════════════════════════════════════════════════
   COMPTE CLIENT
   ═══════════════════════════════════════════════════ */
.links .link-item {
    border-radius: 14px !important;
    border: 1.5px solid var(--rmd-sand) !important;
    font-family: 'Outfit', sans-serif !important;
    text-transform: none !important;
    transition: all 0.3s ease !important;
}

.links a:hover .link-item {
    border-color: var(--rmd-sage) !important;
    box-shadow: 0 8px 24px rgba(61,90,61,0.12) !important;
}

/* ═══════════════════════════════════════════════════
   FOOTER — fond forest, texte blanc
   ═══════════════════════════════════════════════════ */
#footer {
    background-color: var(--rmd-forest) !important;
    font-family: 'Outfit', sans-serif !important;
}

/* Titres footer */
#footer h3,
#footer h4,
#footer .block-contact .title,
#footer .links .h3,
#footer .links h3 {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 500 !important;
    color: white !important;
    text-transform: none !important;
    letter-spacing: 0.02em !important;
    font-size: 1.2rem !important;
}

/* Liens footer → blanc semi-transparent */
#footer a,
#footer .links ul li a,
#footer .block-contact a {
    color: rgba(255,255,255,0.78) !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.9rem !important;
    transition: color 0.2s ease !important;
}

#footer a:hover,
#footer .links ul li a:hover,
#footer .block-contact a:hover {
    color: var(--rmd-sage-light) !important;
    text-decoration: none !important;
}

/* Texte simple footer */
#footer p,
#footer address,
#footer li {
    color: rgba(255,255,255,0.72) !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.9rem !important;
}

/* Barre copyright */
.footer-copyright,
#footer .footer-copyright,
.footer-container .footer-copyright {
    background-color: var(--rmd-forest-deep) !important;
    color: rgba(255,255,255,0.5) !important;
    font-family: 'Outfit', sans-serif !important;
    font-size: 0.82rem !important;
    text-align: center !important;
    padding: 12px 0 !important;
}

.footer-copyright a {
    color: var(--rmd-sage-light) !important;
}

/* Bloc SSL / sécurité */
.footer-container .block-reassurance,
.block-reassurance {
    background-color: rgba(255,255,255,0.06) !important;
    border-radius: 8px !important;
}

/* Séparateurs footer */
#footer hr {
    border-color: rgba(255,255,255,0.15) !important;
}

/* ═══════════════════════════════════════════════════
   TABLES
   ═══════════════════════════════════════════════════ */
.table thead tr {
    background-color: var(--rmd-sand) !important;
}

.table th {
    color: var(--rmd-forest) !important;
    font-family: 'Outfit', sans-serif !important;
    font-weight: 600 !important;
    font-size: 0.78rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    border-color: var(--rmd-sand-dark) !important;
}

.table td {
    font-family: 'Outfit', sans-serif !important;
    vertical-align: middle !important;
    border-color: rgba(232,226,217,0.6) !important;
}

.table-striped tbody tr:nth-of-type(odd) {
    background-color: rgba(232,226,217,0.2) !important;
}

/* ═══════════════════════════════════════════════════
   BADGES
   ═══════════════════════════════════════════════════ */
.badge-primary { background-color: var(--rmd-sage) !important; }
.badge-success { background-color: var(--rmd-forest) !important; }
.badge-warning { background-color: var(--rmd-terra) !important; }
.badge-danger  { background-color: #a85a4a !important; }
.badge-info    { background-color: #5a8fa8 !important; }

/* ═══════════════════════════════════════════════════
   MODALS
   ═══════════════════════════════════════════════════ */
.modal-header {
    background: linear-gradient(135deg, var(--rmd-sand) 0%, rgba(168,196,162,0.25) 100%) !important;
    border-bottom: 1px solid var(--rmd-sand) !important;
}

.modal-title {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 600 !important;
    color: var(--rmd-forest) !important;
}

.modal-content {
    border-radius: 14px !important;
    border: 1.5px solid var(--rmd-sand) !important;
    overflow: hidden !important;
    font-family: 'Outfit', sans-serif !important;
}

.modal-footer {
    border-top: 1px solid var(--rmd-sand) !important;
    background: rgba(250,248,245,0.5) !important;
}

/* ═══════════════════════════════════════════════════
   MOTEUR DE RECHERCHE
   ═══════════════════════════════════════════════════ */
.search-widget input[type="text"] {
    border-radius: 20px !important;
    font-family: 'Outfit', sans-serif !important;
}

/* ═══════════════════════════════════════════════════
   RESPONSIVE
   ═══════════════════════════════════════════════════ */
@media (max-width: 768px) {
    .btn { min-height: 44px !important; }
}