/* ============================================
   SOUVIMAGE — Theme Override CSS
   Harmonise le thème PS Classic avec la landing
   Palette: ivoire, or mat, pierre chaude
   Typo: Cormorant Garamond + DM Sans
   ============================================ */

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

/* ---- VARIABLES ---- */
:root {
    --sv-ivory: #F7F3EE;
    --sv-ivory-deep: #EDE7DE;
    --sv-cream: #FAF8F5;
    --sv-stone: #8A7B6B;
    --sv-stone-light: #A89F93;
    --sv-stone-dark: #6B5E50;
    --sv-gold: #C4A86B;
    --sv-gold-light: #D4BE8A;
    --sv-gold-muted: #B09858;
    --sv-charcoal: #2D2420;
    --sv-charcoal-soft: #3D3430;
    --sv-warm-white: #FDFCFA;
    --sv-sage: #9BA88C;
    --sv-font-display: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
    --sv-font-body: 'DM Sans', -apple-system, sans-serif;
}

/* ============================================
   MASQUER ÉLÉMENTS PS INUTILES
   ============================================ */

/* Newsletter */
.block_newsletter { display: none !important; }

/* Bloc social vide */
.block-social { display: none !important; }

/* Barre de recherche */
#search_widget { display: none !important; }

/* Header banner vide */
.header-banner { display: none !important; }

/* Lien PrestaShop copyright */
footer .text-sm-center a[href*="prestashop.com"] { display: none !important; }
footer .text-sm-center { display: none !important; }

/* Slider accueil */
.homeslider-container,
#homeslider { display: none !important; }

/* ============================================
   BASE & TYPOGRAPHY
   ============================================ */

body {
    font-family: var(--sv-font-body) !important;
    background-color: var(--sv-ivory) !important;
    color: var(--sv-charcoal) !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: var(--sv-font-display) !important;
    color: var(--sv-charcoal) !important;
    font-weight: 400;
}

h1, .h1 { font-size: 2.2rem; font-weight: 300; }
h2, .h2 { font-size: 1.8rem; }
h3, .h3 { font-size: 1.4rem; }

p, li, td, th, span, label, input, select, textarea {
    font-family: var(--sv-font-body);
}

a {
    color: var(--sv-gold-muted);
    transition: color 0.3s ease;
}

a:hover {
    color: var(--sv-charcoal);
    text-decoration: none;
}

/* ============================================
   HEADER PS — Simplifié Souvimage
   ============================================ */

header#header {
    background: var(--sv-cream) !important;
    border-bottom: 1px solid rgba(138,123,107,0.12) !important;
    box-shadow: none !important;
}

.header-nav {
    background: var(--sv-charcoal) !important;
    border: none !important;
    max-height: none;
}

.header-nav .right-nav .user-info,
.header-nav .right-nav .user-info a,
.header-nav a,
.header-nav span {
    color: var(--sv-ivory-deep) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.82rem !important;
}

.header-nav a:hover {
    color: var(--sv-gold-light) !important;
}

/* Lien contact header */
#contact-link a {
    color: var(--sv-ivory-deep) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.82rem !important;
}

#contact-link a:hover {
    color: var(--sv-gold-light) !important;
}

/* ── Sticky header : header#header + header-top + svn-bar ── */
header#header {
    position: sticky !important;
    top: 0;
    z-index: 1100;
    overflow: visible !important;
}

.header-top {
    background: var(--sv-cream) !important;
    padding: 12px 0 !important;
    overflow: visible !important;
}

/* Barre nav Souvimage collée juste sous le header */
#svn-bar {
    position: sticky !important;
    top: var(--sv-header-height, 70px);
    z-index: 1050 !important;
}

/* Logo — remplacer image par texte Souvimage */
#_desktop_logo a {
    display: flex;
    align-items: center;
    text-decoration: none !important;
}

#_desktop_logo .logo {
    display: none !important;
}

#_desktop_logo a::before {
    content: 'Souvimage';
    font-family: var(--sv-font-display) !important;
    font-size: 1.6rem;
    font-weight: 500;
    color: var(--sv-charcoal) !important;
    letter-spacing: -0.02em;
}

/* Mobile logo */
.top-logo a::before {
    content: 'Souvimage';
    font-family: var(--sv-font-display) !important;
    font-size: 1.4rem;
    font-weight: 500;
    color: var(--sv-charcoal) !important;
}

.top-logo img { display: none !important; }

/* ── Masquer le breadcrumb PS natif sur toutes les pages ── */
nav.breadcrumb {
    display: none !important;
}

/* ── Masquer page-footer PS (Retour à votre compte / Accueil) ── */
footer.page-footer { display: none !important; }

/* ── Fil d'Ariane Souvimage ── */
.sv-breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size: 0.75rem;
    font-weight: 400;
    color: #8A7B6B;
    padding: 10px 0 8px;
    margin-bottom: 16px;
    border-bottom: 1px solid rgba(196,168,107,0.12);
}
.sv-breadcrumb a {
    color: #8A7B6B;
    text-decoration: none;
    font-family: inherit;
    font-size: inherit;
    transition: color 0.15s;
    display: inline-flex;
    align-items: center;
    gap: 3px;
}
.sv-breadcrumb a:hover { color: #C4A86B; text-decoration: none; }
.sv-breadcrumb .sv-bc-sep { color: #C4A86B; font-size: 0.7rem; opacity: 0.7; margin: 0 2px; }
.sv-breadcrumb .sv-bc-cur { color: #2D2420; font-weight: 500; font-family: inherit; font-size: inherit; }
.sv-breadcrumb .material-icons { font-size: 14px !important; vertical-align: middle; color: #8A7B6B; }

/* ── Force logo visible on mobile ── */
@media(max-width:768px){
    header#header,
    .header-top,
    #_mobile_logo,
    #_desktop_logo,
    .top-logo,
    .logo-container { display:block !important; visibility:visible !important; }
}

/* Cart icon */
.blockcart .header {
    color: var(--sv-charcoal) !important;
}

.blockcart .cart-products-count {
    color: var(--sv-charcoal) !important;
}

/* Material icons dans header */
.header-nav .material-icons {
    color: var(--sv-ivory-deep) !important;
}

/* Menu top — vide mais au cas où */
.top-menu a,
.top-menu .sub-menu a {
    color: var(--sv-charcoal) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.85rem !important;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    font-weight: 400 !important;
}

.top-menu a:hover,
.top-menu .sub-menu a:hover {
    color: var(--sv-gold-muted) !important;
}

/* ============================================
   BREADCRUMBS
   ============================================ */

.breadcrumb {
    background: transparent !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.8rem !important;
    padding: 12px 0 !important;
}

.breadcrumb li,
.breadcrumb li a {
    color: var(--sv-stone) !important;
}

.breadcrumb li a:hover {
    color: var(--sv-gold-muted) !important;
}

/* ============================================
   BUTTONS
   ============================================ */

.btn-primary,
.btn-primary:active,
.btn-primary:focus {
    background-color: var(--sv-charcoal) !important;
    border-color: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.82rem !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 2px !important;
    transition: all 0.3s ease !important;
    padding: 10px 24px !important;
    box-shadow: none !important;
}

.btn-primary:hover {
    background-color: var(--sv-gold-muted) !important;
    border-color: var(--sv-gold-muted) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 16px rgba(45,36,32,0.12) !important;
}

.btn-secondary,
.btn-outline-secondary {
    background: transparent !important;
    border: 1px solid var(--sv-stone-light) !important;
    color: var(--sv-charcoal) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.82rem !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 2px !important;
    transition: all 0.3s ease !important;
}

.btn-secondary:hover,
.btn-outline-secondary:hover {
    border-color: var(--sv-gold) !important;
    color: var(--sv-gold-muted) !important;
    background: transparent !important;
}

.btn-outline-primary {
    background: transparent !important;
    border: 1px solid var(--sv-charcoal) !important;
    color: var(--sv-charcoal) !important;
    font-family: var(--sv-font-body) !important;
    font-size: 0.82rem !important;
    border-radius: 2px !important;
    transition: all 0.3s ease !important;
}

.btn-outline-primary:hover {
    background: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
}

.btn-outline-dark {
    border-color: var(--sv-stone-light) !important;
    color: var(--sv-stone-dark) !important;
    border-radius: 2px !important;
    font-family: var(--sv-font-body) !important;
}

.btn-outline-dark:hover {
    background: var(--sv-charcoal) !important;
    border-color: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
}

/* ============================================
   FORMS & INPUTS
   ============================================ */

.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="number"],
textarea,
select {
    background: var(--sv-warm-white) !important;
    border: 1px solid rgba(138,123,107,0.2) !important;
    border-radius: 2px !important;
    font-family: var(--sv-font-body) !important;
    color: var(--sv-charcoal) !important;
    font-size: 0.9rem !important;
    padding: 10px 14px !important;
    transition: border-color 0.3s, box-shadow 0.3s !important;
}

.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: var(--sv-gold) !important;
    box-shadow: 0 0 0 3px rgba(196,168,107,0.1) !important;
    outline: none !important;
}

label {
    font-family: var(--sv-font-body) !important;
    font-size: 0.85rem !important;
    color: var(--sv-stone-dark) !important;
    font-weight: 400 !important;
    letter-spacing: 0.02em;
}

.form-group {
    margin-bottom: 20px !important;
}

/* Custom checkbox/radio */
.custom-checkbox input[type="checkbox"] + span {
    border-color: var(--sv-stone-light) !important;
    border-radius: 2px !important;
}

.custom-checkbox input[type="checkbox"]:checked + span {
    background-color: var(--sv-charcoal) !important;
    border-color: var(--sv-charcoal) !important;
}

/* ============================================
   PAGES CONTENU (wrapper)
   ============================================ */

#wrapper {
    background: var(--sv-ivory) !important;
    padding-top: 20px !important;
}


#content-wrapper,
#main {
    background: transparent !important;
}

/* ============================================
   CARDS & PANELS
   ============================================ */

.card,
.card-block,
.page-content,
.cart-grid-body .card-block {
    background: var(--sv-warm-white) !important;
    border: 1px solid rgba(138,123,107,0.1) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ============================================
   ESPACE CLIENT / MY ACCOUNT
   ============================================ */

/* Supprimer le cadre sur la page mon-compte */
#my-account .page-content,
#my-account #main,
#my-account #content-wrapper,
#my-account .page-wrapper {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}

#my-account .links a {
    font-family: var(--sv-font-body) !important;
    color: var(--sv-charcoal) !important;
    border: 1px solid rgba(138,123,107,0.1) !important;
    background: var(--sv-warm-white) !important;
    transition: all 0.3s ease !important;
}

#my-account .links a:hover {
    border-color: var(--sv-gold) !important;
    box-shadow: 0 4px 16px rgba(196,168,107,0.08) !important;
    transform: translateY(-2px);
}

#my-account .links a i {
    color: var(--sv-gold-muted) !important;
}

/* Page titles */
.page-header h1,
h1.page-heading,
.page-my-account h1,
.page-customer-account h1 {
    font-family: var(--sv-font-display) !important;
    font-weight: 300 !important;
    font-size: 2rem !important;
    color: var(--sv-charcoal) !important;
}

/* Account links retour */
.page-footer .account-link {
    font-family: var(--sv-font-body) !important;
    color: var(--sv-stone-dark) !important;
    transition: color 0.3s !important;
}

.page-footer .account-link:hover {
    color: var(--sv-gold-muted) !important;
}

.page-footer .account-link .material-icons {
    color: var(--sv-stone) !important;
}

/* ============================================
   PANIER / CART
   ============================================ */

.cart-grid-body {
    background: var(--sv-ivory) !important;
}

.cart-summary-line .label,
.cart-summary-line .value {
    font-family: var(--sv-font-body) !important;
}

.cart-total .label,
.cart-total .value {
    font-family: var(--sv-font-display) !important;
    font-size: 1.2rem !important;
    font-weight: 500 !important;
}

/* ============================================
   CHECKOUT
   ============================================ */

.checkout-step .step-title {
    font-family: var(--sv-font-display) !important;
    font-weight: 400 !important;
    color: var(--sv-charcoal) !important;
    border-bottom: 1px solid rgba(138,123,107,0.1) !important;
}

.checkout-step.-current .step-title {
    border-color: var(--sv-gold) !important;
}

.checkout-step .step-number {
    background: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
}

.checkout-step.-current .step-number {
    background: var(--sv-gold-muted) !important;
}

/* ============================================
   ALERTS & NOTIFICATIONS
   ============================================ */

.alert-info {
    background: rgba(196,168,107,0.08) !important;
    border: 1px solid rgba(196,168,107,0.2) !important;
    color: var(--sv-stone-dark) !important;
    border-radius: 2px !important;
}

.alert-success {
    background: rgba(155,168,140,0.12) !important;
    border: 1px solid rgba(155,168,140,0.25) !important;
    color: #4a6741 !important;
    border-radius: 2px !important;
}

.alert-warning {
    background: rgba(196,168,107,0.12) !important;
    border: 1px solid rgba(196,168,107,0.3) !important;
    color: var(--sv-stone-dark) !important;
    border-radius: 2px !important;
}

.alert-danger {
    background: rgba(180,80,60,0.08) !important;
    border: 1px solid rgba(180,80,60,0.2) !important;
    color: #8b3a2a !important;
    border-radius: 2px !important;
}

/* ============================================
   TABLES
   ============================================ */

.table,
table {
    font-family: var(--sv-font-body) !important;
}

.table thead th {
    background: var(--sv-ivory-deep) !important;
    border-bottom: 1px solid var(--sv-gold-light) !important;
    font-size: 0.75rem !important;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--sv-stone) !important;
    font-weight: 500 !important;
}

.table tbody td {
    border-bottom: 1px solid rgba(138,123,107,0.08) !important;
    font-size: 0.88rem !important;
    color: var(--sv-charcoal) !important;
}

.table tbody tr:hover {
    background: rgba(196,168,107,0.03) !important;
}

/* ============================================
   BADGES
   ============================================ */

.badge {
    font-family: var(--sv-font-body) !important;
    font-weight: 500 !important;
    letter-spacing: 0.02em;
    border-radius: 2px !important;
}

.badge-success { background: rgba(155,168,140,0.25) !important; color: #4a6741 !important; }
.badge-info { background: rgba(196,168,107,0.2) !important; color: var(--sv-stone-dark) !important; }
.badge-warning { background: rgba(196,168,107,0.25) !important; color: #8b6914 !important; }
.badge-primary { background: rgba(45,36,32,0.15) !important; color: var(--sv-charcoal) !important; }
.badge-secondary { background: rgba(138,123,107,0.15) !important; color: var(--sv-stone-dark) !important; }

/* ============================================
   PAGINATION
   ============================================ */

.pagination .page-item .page-link {
    color: var(--sv-charcoal) !important;
    border: 1px solid rgba(138,123,107,0.15) !important;
    font-family: var(--sv-font-body) !important;
    border-radius: 2px !important;
}

.pagination .page-item.active .page-link {
    background: var(--sv-charcoal) !important;
    border-color: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
}

.pagination .page-item .page-link:hover {
    background: var(--sv-ivory-deep) !important;
    border-color: var(--sv-gold) !important;
}

/* ============================================
   FOOTER PS — Remplacé par footer custom Souvimage (hookDisplayFooter + JS)
   ============================================ */

#footer { display: none !important; }

/* ============================================
   PRODUCT PAGES (packs crédits)
   ============================================ */

.product-price,
.current-price .current-price-value {
    font-family: var(--sv-font-display) !important;
    color: var(--sv-charcoal) !important;
    font-weight: 400 !important;
}

.product-add-to-cart .add-to-cart,
.add-to-cart {
    background: var(--sv-charcoal) !important;
    border-color: var(--sv-charcoal) !important;
    color: var(--sv-ivory) !important;
    border-radius: 2px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
}

.add-to-cart:hover {
    background: var(--sv-gold-muted) !important;
    border-color: var(--sv-gold-muted) !important;
}

.product-title h1 {
    font-family: var(--sv-font-display) !important;
    font-weight: 400 !important;
}

/* Tabs produit */
.product-tabs .nav-tabs .nav-link {
    font-family: var(--sv-font-body) !important;
    color: var(--sv-stone) !important;
    font-size: 0.85rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.04em !important;
}

.product-tabs .nav-tabs .nav-link.active {
    color: var(--sv-charcoal) !important;
    border-bottom-color: var(--sv-gold) !important;
}

/* ============================================
   SOUVIMAGE MODULE PAGES ENHANCEMENT
   ============================================ */

.souvi-credits-bar {
    background: var(--sv-warm-white) !important;
    border: 1px solid rgba(196,168,107,0.2) !important;
    border-radius: 0 !important;
}

.souvi-card {
    background: var(--sv-warm-white) !important;
    border: 1px solid rgba(138,123,107,0.1) !important;
    border-radius: 0 !important;
    transition: border-color 0.3s, box-shadow 0.3s, transform 0.3s !important;
}

.souvi-card:hover {
    border-color: rgba(196,168,107,0.3) !important;
    box-shadow: 0 4px 20px rgba(45,36,32,0.06) !important;
    transform: translateY(-2px);
}

.souvi-card-title {
    font-family: var(--sv-font-display) !important;
    font-size: 1.2rem !important;
    font-weight: 500 !important;
}

.souvi-card-subtitle {
    font-family: var(--sv-font-display) !important;
    font-style: italic !important;
}

.souvi-section {
    background: var(--sv-warm-white) !important;
    border: 1px solid rgba(138,123,107,0.1) !important;
    border-radius: 0 !important;
}

.souvi-section h3 {
    font-family: var(--sv-font-display) !important;
    font-weight: 500 !important;
}

.souvi-badge--active {
    background: rgba(155,168,140,0.2) !important;
    color: #4a6741 !important;
    border-radius: 2px !important;
}

.souvi-badge--draft {
    background: rgba(138,123,107,0.1) !important;
    color: var(--sv-stone) !important;
    border-radius: 2px !important;
}

.souvi-badge--expired {
    background: rgba(180,80,60,0.1) !important;
    color: #8b3a2a !important;
    border-radius: 2px !important;
}

.souvi-badge--archived {
    background: rgba(138,123,107,0.08) !important;
    color: var(--sv-stone) !important;
    border-radius: 2px !important;
}

.souvi-photo-item {
    border-radius: 0 !important;
}

.souvi-pack-card {
    border-radius: 0 !important;
    border-color: rgba(138,123,107,0.15) !important;
    transition: border-color 0.3s !important;
}

.souvi-pack-card:hover {
    border-color: var(--sv-gold) !important;
}

.souvi-qr-frame {
    background: var(--sv-warm-white) !important;
    border-radius: 0 !important;
    border: 1px solid rgba(196,168,107,0.15) !important;
}

/* Material icons dans module */
.souvi-card .material-icons,
.souvi-actions-bar .material-icons,
.souvi-credits-bar .material-icons {
    font-size: 18px !important;
    vertical-align: middle;
}

/* ============================================
   LOGIN / REGISTER PAGES
   ============================================ */

#login-form,
#customer-form {
    background: var(--sv-warm-white);
    padding: 30px;
    border: 1px solid rgba(138,123,107,0.1);
}

.no-account a,
.forgot-password a {
    color: var(--sv-gold-muted) !important;
}

.no-account a:hover,
.forgot-password a:hover {
    color: var(--sv-charcoal) !important;
}

/* ============================================
   SCROLLBAR CUSTOM
   ============================================ */

::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--sv-ivory); }
::-webkit-scrollbar-thumb { background: var(--sv-stone-light); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--sv-stone); }

/* ============================================
   SELECTION TEXT
   ============================================ */

::selection {
    background: rgba(196,168,107,0.25);
    color: var(--sv-charcoal);
}

/* ============================================
   PAGE PRODUIT SIMPLIFIÉE (packs crédits)
   ============================================ */

/* Masquer éléments inutiles sur page produit */
.product-page #product-description-short { display: none !important; }
.product-page .product-variants,
.product-page .product-discounts,
.product-page .product-pack,
.product-page .social-sharing,
.product-page #product-availability,
.product-page .product-flags,
.product-page .product-reference,
.product-page .product-quantities,
.product-page .product-minimal-quantity {
    display: none !important;
}

/* Simplifier le bloc quantité — on achète 1 pack */
.product-page .product-quantity .qty {
    display: none !important;
}

/* Tabs produit : masquer tout sauf description */
.product-page .product-tabs .nav-tabs .nav-item:not(:first-child) {
    display: none !important;
}

/* Bouton achat stylé */
.product-page .add-to-cart {
    width: 100%;
    padding: 14px 24px !important;
    font-size: 0.95rem !important;
}

/* Images produit — plus sobre */
.product-page .product-cover img {
    border-radius: 0;
}

/* Masquer les produits similaires */
.product-page .featured-products,
.product-page .product-accessories,
.product-page .crossseling-products,
.product-page #content-hook_payment_return {
    display: none !important;
}
