/*
******************************************************************************************************
 *  Fichier : custom-deco-styles-communs.css
 *  👉 Styles communs applicables à l'ensemble du site
 *  🔁 Mofification du fichier custom-deco-styles-communs.css pour la version 6.3.0 horodatée 20260527-1605
 *      ✅ Intégration des styles des boutons refus de prise-instrument
 *****************************************************************************************************
 */

/* Variables globales */
:root{
    --cd-primary: #1a5191;
    --cd-primary-light: #2f70b4;

    --cd-secondary: #744E15;
    --cd-brown-dark: #422A01;
    --cd-brown-mid: #5C3A00;

    --cd-sand: #FCD393;
    --cd-sand-soft: #fff7ea;
    --cd-sand-light: #fffaf2;
    --cd-sand-border: rgba(116, 78, 21, 0.18);

    --cd-gray: #dddde3;
    --cd-shadow: 0 1px 2px rgba(0,0,0,.08), 0 4px 12px rgba(0,0,0,.06);
    --cd-shadow-warm: 0 10px 26px rgba(116,78,21,.14);
}


/* =====================================================================================
   Utilitaires globaux
   ===================================================================================== */

.cdsc-honeypot{
    position: absolute;
    left: -20000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* Texte uniquement pour lecteurs d'écran */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,1px,1px);
    white-space: nowrap;
    border: 0;
}

/* =====================================================================================
   Ligne inline formulaire
   ===================================================================================== */

.cdsc-inline{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin: 10px 0;
}

/* =====================================================================================
   Titres génériques de blocs / formulaires
   ===================================================================================== */

.cdsc-title{
    margin: 0 0 14px 0;

    font-family: var(--cd-headings-font, 'Amarante', serif);
    font-size: 1.35rem;
    line-height: 1.2;
    font-weight: 600;
    letter-spacing: 0.5px;

    color: var(--cd-secondary);
    text-shadow: 0 1px 1px rgba(0,0,0,0.06);
}


/* =====================================================================================
   Notices génériques
   ===================================================================================== */

.cdsc-notice{
    margin: 12px 0;
    padding: 10px 12px;

    border-radius: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.cdsc-notice--success{
    background: #f0fff4;
    border: 1px solid #b7e0c2;
    color: #0c5132;
}

.cdsc-notice--error{
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
}

.cdsc-notice--info{
    background: #f7fbff;
    border: 1px solid rgba(26,81,145,0.22);
    color: var(--cd-primary);
}

.cdsc-notice--warning{
    background: #fffaf2;
    border: 1px solid rgba(116,78,21,0.24);
    color: var(--cd-secondary);
}


/* =====================================================================================
   Boutons premium – famille cdsc-btn et types 
   ===================================================================================== */

/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
/*	⚠️ Utilisé dans custom-deco-client-commande-deco.php */
.cdsc-btn{
    appearance: none;
    border: 0;
    border-radius: 14px;
    padding: 12px 20px;

    font-weight: 700;
    font-size: 0.95rem;
    line-height: 1.1;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;

    cursor: pointer;
    user-select: none;
    text-decoration: none;

    transition:
        transform .12s ease,
        box-shadow .12s ease,
        background-color .12s ease,
        opacity .12s ease;
}

/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn:disabled,
.cdsc-btn[aria-disabled="true"]{
    opacity: .45;
    cursor: default;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}


/* Action locale – neutre premium */
/*	⚠️ Utilisé dans custom-deco-client-commande-deco.php */
.cdsc-btn--action{
    background: rgba(255,255,255,0.78);
    color: var(--cd-secondary);
    border: 1px solid rgba(116,78,21,0.35);

    box-shadow: 0 10px 26px rgba(0,0,0,.18);
    backdrop-filter: blur(6px);
}

/*	⚠️ Utilisé dans custom-deco-client-commande-deco.php */
.cdsc-btn--action:hover{
    transform: translateY(-1px);
    box-shadow: 0 14px 32px rgba(0,0,0,.22);
}


/* Annulation / retour */
/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn--cancel{
    background: rgba(255,255,255,0.55);
    color: #6b7280; /* gris chaud lisible */
    border: 1px solid rgba(0,0,0,0.12);

    box-shadow: 0 6px 16px rgba(0,0,0,.10);
}

/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn--cancel:hover{
    background: rgba(255,255,255,0.75);
    box-shadow: 0 10px 22px rgba(0,0,0,.14);
    transform: translateY(-1px);
}

/* Action sensible / dangereuse */
.cdsc-btn--danger{
    background: linear-gradient(
        135deg,
        var(--cd-sand),
        #f7c978
    );
    color: var(--cd-brown-dark);

    border: 1px solid rgba(116,78,21,0.28);
    box-shadow: 0 10px 22px rgba(116,78,21,.18);
}

.cdsc-btn--danger:hover{
    transform: translateY(-1px);
    box-shadow: 0 14px 28px rgba(116,78,21,.24);
}

.cdsc-btn--refuse{
    color:#fff;
    background:linear-gradient(
        180deg,
        #c84a3f 0%,
        #a93b32 100%
    );
    border:1px solid #8e2f28;
    box-shadow:
        inset 0 1px 0 rgba(255,255,255,.15),
        0 2px 6px rgba(0,0,0,.15);
}

.cdsc-btn--refuse:hover{
    background:linear-gradient(
        180deg,
        #d4574c 0%,
        #b14037 100%
    );
}

.cdsc-btn--refuse:focus-visible{
    outline:none;
    box-shadow:
        0 0 0 3px rgba(200,74,63,.25),
        inset 0 1px 0 rgba(255,255,255,.15);
}

/* Validation / progression */
/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn--progress{
    background: linear-gradient(
        135deg,
        var(--cd-primary),
        var(--cd-primary-light)
    );
    color: #ffffff;

    box-shadow: 0 14px 34px rgba(28,78,128,.35);
}

/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn--progress:hover{
    transform: translateY(-1px);
    box-shadow: 0 18px 42px rgba(28,78,128,.45);
}

/*	⚠️ Utilisé dans custom-deco-client-creation-commande.php */
.cdsc-btn--block{
    width: 100%;
}

/* =====================================================================================
   Bouton custom premium — action interne de flux
   ===================================================================================== */

.cdsc-btn--custom{
    white-space: nowrap;
    border-color: rgba(26,81,145,0.62) !important;

    background:
        linear-gradient(
            90deg,
            rgba(232,242,255,0.98),
            rgba(255,255,255,0.92)
        ) !important;

    color: rgba(26,81,145,0.95) !important;
    font-weight: 900 !important;

    box-shadow:
        0 0 0 1px rgba(26,81,145,0.20),
        0 10px 24px rgba(26,81,145,0.20) !important;
}

.cdsc-btn--custom:hover{
    border-color: rgba(26,81,145,0.72) !important;

    background:
        linear-gradient(
            90deg,
            rgba(218,235,255,1),
            rgba(255,255,255,0.94)
        ) !important;

    box-shadow:
        0 0 0 1px rgba(26,81,145,0.28),
        0 12px 28px rgba(26,81,145,0.26) !important;
}

/* =====================================================================================
   Liens textuels – famille de base
   ===================================================================================== */

/*	Lien textuel générique */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-decos.php */
.cdsc-link {
    display: inline-block;
    text-decoration: none;
	color: var(--cd-primary);
	font-weight:600;
}

/*  Effet au survol pour le lien générique */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-decos.php */
.cdsc-link:hover {
    text-decoration: underline;
	color: var(--cd-secondary);
}


/* =====================================================================================
   Boutons d'icône – famille et types
   ===================================================================================== */

/*	Famille générique : boutons d’icône*/
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.js */
.cdsc-btn-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    flex-shrink: 0;
	width: 34px;
    height: 34px;
	
	border: 1px solid var(--cd-sand-border);
	background: linear-gradient(180deg, #ffffff, var(--cd-sand-light));
	color: var(--cd-secondary);
	box-shadow: 0 6px 16px rgba(116,78,21,.14);
	
    font-size: 16px;
	text-decoration: none;
	
    cursor: pointer;
	box-sizing: border-box;   /* on compte bien la bordure dans les dimensions */
    padding: 0;               /* on annule le padding par défaut des <button> */
}

/* 	Composant : icône de verrou */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
.cdsc-btn-icon-lock {
    width: 26px;
    height: 26px;
	font-size: 14px;
    background: var(--cd-primary);
    color: #fff;
}

/*	Composant : icônes de contact*/
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
.cdsc-btn-icon-contact {
}

/*	Composant : bouton rond "OPEN" */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
.cdsc-btn-icon-open {

}

/*	Composant : bouton rond "CLOSE" */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-btn-icon-close {
    background-color: var(--cd-gray); /* en remplacement de #e9e9ed */
    border: 1px solid #d0d0d5;
    color: var(--cd-primary); /* en remplacement de #1a518f */
}

/*	État désactivé pour un bouton d’icône */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-btn-icon[disabled],
.cdsc-btn-icon.is-disabled,
.cdsc-btn-icon-disabled {
    opacity: 0.35;
    pointer-events: none;
}

/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-btn-icon:hover {
    background: #ffffff;
    color: var(--cd-primary);
    border-color: rgba(116,78,21,0.30);
    transform: translateY(-1px);
    box-shadow: 0 9px 22px rgba(116,78,21,.18);
    filter: none;
}

.cdsc-btn-icon {
    transition:
        transform .14s ease,
        box-shadow .14s ease,
        background-color .14s ease,
        border-color .14s ease,
        opacity .14s ease;
}

.cdsc-btn-icon:hover {
    transform: translateY(-1px);
    border-color: rgba(28,78,128,0.28);
    box-shadow: 0 8px 20px rgba(28,78,128,.20);
}

.cdsc-btn-icon img {
    display: block;
    width: 24px;
    height: 24px;
    object-fit: contain;
    pointer-events: none;
}

.cdsc-btn-icon--danger {
    background: #fff7f8;
    color: #9f1239;
    border-color: rgba(159,18,57,0.22);
}

.cdsc-btn-icon--danger:hover {
    background: #fff1f2;
    color: #881337;
    border-color: rgba(159,18,57,0.34);
    box-shadow: 0 8px 20px rgba(159,18,57,.16);
}

.cdsc-btn-icon--favorite {
    color: var(--cd-secondary);
    border-color: rgba(116,78,21,0.22);
}

.cdsc-btn-icon--favorite:hover {
    border-color: rgba(116,78,21,0.34);
    box-shadow: 0 8px 20px rgba(116,78,21,.16);
}

/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-btn-icon-close:hover {
    background-color: #ffffff;
}

/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-btn-icon .dashicons {
    font-size: 16px;
    line-height: 1;
}

.cdsc-btn-icon--primary-soft {
    color: var(--cd-primary);
    border-color: rgba(26,81,145,0.18);
    background: linear-gradient(180deg, #ffffff, #f8fbff);
    box-shadow: 0 6px 16px rgba(26,81,145,.12);
}

.cdsc-btn-icon--primary-soft:hover {
    color: var(--cd-primary);
    border-color: rgba(26,81,145,0.30);
    box-shadow: 0 9px 22px rgba(26,81,145,.18);
}

.cdsc-btn-icon--danger {
    background: linear-gradient(180deg, #ffffff, #fff5f5);
    color: #9f1239;
    border-color: rgba(159,18,57,0.20);
    box-shadow: 0 6px 16px rgba(159,18,57,.10);
}

.cdsc-btn-icon--danger:hover {
    background: #fff8f8;
    color: #881337;
    border-color: rgba(159,18,57,0.34);
    box-shadow: 0 9px 22px rgba(159,18,57,.15);
}


/* =====================================================================================
   Boutons compacts – actions de barre / navigation / mini-commandes
   ===================================================================================== */

.cdsc-btn-compact {
    appearance: none;
    width: 36px;
    height: 36px;
    min-width: 36px;
    padding: 0;
    border-radius: 10px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid rgba(28,78,128,0.18);
    background: rgba(255,255,255,0.72);
    color: var(--cd-primary);

    font-size: 1rem;
    font-weight: 800;
    line-height: 1;

    text-decoration: none;
    cursor: pointer;
    user-select: none;

    box-shadow: 0 6px 16px rgba(0,0,0,.10);

    transition:
        transform .12s ease,
        box-shadow .12s ease,
        background-color .12s ease,
        color .12s ease,
        opacity .12s ease;
}

.cdsc-btn-compact:hover {
    background: rgba(255,255,255,0.92);
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(0,0,0,.14);
}

.cdsc-btn-compact--primary {
    background: linear-gradient(135deg, var(--cd-primary), var(--cd-primary-light));
    color: #ffffff;
    border-color: rgba(255,255,255,0.22);
    box-shadow: 0 10px 24px rgba(28,78,128,.28);
}

.cdsc-btn-compact--primary:hover {
    background: linear-gradient(135deg, var(--cd-primary-light), var(--cd-primary));
    color: #ffffff;
    box-shadow: 0 14px 30px rgba(28,78,128,.36);
}

.cdsc-btn-compact--muted {
    background: rgba(28,78,128,0.45);
    color: #ffffff;
    border-color: rgba(28,78,128,0.12);
}

.cdsc-btn-compact.is-disabled,
.cdsc-btn-compact[aria-disabled="true"],
.cdsc-btn-compact:disabled {
    opacity: .80;
    cursor: default;
    pointer-events: none;
    transform: none;
    box-shadow: none;
}

.cdsc-btn-compact--primary,
.cdsc-btn-compact--nav {
    box-shadow: 0 8px 18px rgba(28,78,128,.24);
}

.cdsc-btn-compact--primary:hover,
.cdsc-btn-compact--nav:hover {
    box-shadow: 0 10px 22px rgba(28,78,128,.32);
}

/* =====================================================================================
   Boutons de tri
   ===================================================================================== */

.cdsc-btn-sort__icon {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
    line-height: 1;
    font-size: 0.72rem;
}

.cdsc-btn-sort__up,
.cdsc-btn-sort__down {
    display: block;
    height: 9px;
    opacity: .45;
}

.cdsc-btn-sort.is-sort-asc .cdsc-btn-sort__up,
.cdsc-btn-sort.is-sort-desc .cdsc-btn-sort__down {
    opacity: 1;
}

.cdsc-btn-sort:hover .cdsc-btn-sort__up,
.cdsc-btn-sort:hover .cdsc-btn-sort__down {
    color: #ffffff;
}

/* =====================================================================================
   Boutons de navigation / pagination
   ===================================================================================== */
   
.cdsc-btn-compact--nav {
    background: linear-gradient(135deg, var(--cd-primary), var(--cd-primary-light));
    color: #ffffff;
    border-color: rgba(255,255,255,0.22);
    box-shadow: 0 10px 24px rgba(28,78,128,.28);
}

.cdsc-btn-compact--nav:hover {
    background: linear-gradient(135deg, var(--cd-primary-light), var(--cd-primary));
    color: #ffffff;
    box-shadow: 0 14px 30px rgba(28,78,128,.36);
}

.cdsc-btn-compact--nav.is-disabled,
.cdsc-btn-compact--nav[aria-disabled="true"] {
    background: rgba(28,78,128,0.30);
    color: rgba(255,255,255,0.78);
    opacity: .80;
}

.cdsc-pagination-current {
    min-width: 54px;
    height: 36px;
    padding: 0 12px;
    border-radius: 10px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    background: rgba(255,255,255,0.82);
    color: var(--cd-primary);
    border: 1px solid rgba(28,78,128,0.55);

    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1;

    box-shadow: 0 6px 16px rgba(0,0,0,.08);
}

/* =====================================================================================
   Boutons de navigation type slider / mini-lightbox
   ===================================================================================== */

/*  Boutons de navigation circulaires (Précédent / Suivant)
 *	⚠️ Utilisé dans custom-deco-home-section-decos.php
 *	⚠️ Sera utilisé dans custom-deco-home-section-artistes.php
 */
.cdsc-btn-slider-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;

    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.4);
    background: radial-gradient(
        circle at 30% 30%,
        rgba(255, 255, 255, 0.22),
        rgba(0, 0, 0, 0.82)
    );
    color: #ffffff;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.7);

    display: flex;
    align-items: center;
    justify-content: center;

    transition:
        background-color 0.2s ease,
        transform 0.2s ease,
        opacity 0.2s ease;
}

/* Taille de l’icône interne (Swiper utilise ::after) */
/*	⚠️ Utilisé dans custom-deco-home-section-decos.php */
.cdsc-btn-slider-nav::after {
    font-size: 18px;
}

/* Survol : léger zoom et éclaircissement */
/*	⚠️ Utilisé dans custom-deco-home-section-decos.php */
.cdsc-btn-slider-nav:hover {
    transform: translateY(-50%) scale(1.06);
    background: radial-gradient(
        circle at 30% 30%,
        rgba(255, 255, 255, 0.30),
        rgba(0, 0, 0, 0.9)
    );
}


/* =====================================================================================
   Popup générique – modèle basé sur la popup luthier
   ===================================================================================== */

/*	Conteneur global de popup (plein écran, centré) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup {
    position: fixed;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    padding: 12px;
    box-sizing: border-box;
	z-index: 100;
}

/* Gestion d’affichage via [hidden] + .is-open  */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup[hidden] {
    display: none;
}

/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup.is-open {
    pointer-events: auto;
}

/* Fond assombri (backdrop)*/
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(8, 12, 26, 0.55);
}

/* Panel principal */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-panel {
    position: relative;
    z-index: 1;
    width: min(720px, 100%);
    max-height: 100%;
    background: #fffdf8;
    border-radius: 18px;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.45);
    padding: 18px 20px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow: hidden;
}

/* Lock de scroll générique pour tous les popups */
/*body.cdsc-popup-opened,*/
html.cdsc-popup-opened {
    height: 100%;
    overflow: hidden;
}

/* =====================================================================================
   Protection du header quand un popup est ouvert (mobile)
   ===================================================================================== */

@media (max-width: 960px) {
	/*body.cdsc-popup-opened .cd-theme-header, */
    html.cdsc-popup-opened .cd-theme-header {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 3000;                /* Au-dessus des popups */
    }

	/*body.cdsc-popup-opened.cd-theme, */
    html.cdsc-popup-opened body.cd-theme {
        padding-top: var(--cd-theme-header-h);
    }
}

@media (max-width: 960px) and (orientation: landscape) {

    .cdsc-popup {
        align-items: flex-start;
        justify-content: center;
        padding-top: calc(var(--cd-theme-header-h, 64px) + env(safe-area-inset-top, 0px) + 8px);
        padding-right: 10px;
        padding-bottom: 10px;
        padding-left: 10px;
    }

    .cdsc-popup-panel {
        max-height: calc(100dvh - var(--cd-theme-header-h, 64px) - env(safe-area-inset-top, 0px) - 18px);
        padding: 12px 14px 14px 14px;
        gap: 8px;
        border-radius: 16px;
    }
}

/* =====================================================================================
   Popups page d'accueil – famille cdsc-popup-hp-*
   ===================================================================================== */

/* En-tête générique des popups home (titre à gauche, actions à droite) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 4px;
}

/* Bloc identifiant = avatar + pile de titres */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-id {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Avatar rond (portrait luthier / artiste) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.28);
    background: #f4f4f4;
}

/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Pile de titres (nom + devise / sous-titre) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-titles {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

/* Titre principal (nom, titre d’œuvre, etc.) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-title {
    margin: 0;
    font-size: 1.25rem;
    line-height: 1.2;
    font-weight: 600;
    color: #1f3550;
}

/* Sous-titre (devise, tagline…) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-subtitle {
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.35;
    color: #3b4d60;
    font-style: italic;
}

/* Bloc d’actions en en-tête (boutons à droite) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}

/* Corps générique des popups home (colonne, avec possibilité de scroll interne) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-body {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

/* Variante corps “2 colonnes” (luthier / œuvre) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-body--cols {
    flex-direction: row;
    align-items: stretch;
    gap: 14px;
}

/* Colonne générique dans un popup de home */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-col {
    flex: 1 1 0;
    min-width: 0;
    min-height: 0;
    display: flex;
    align-items: stretch;
}

/* Carte interne générique (bloc blanc avec ombre) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-card {
    width: 100%;
    height: 100%;
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.10);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

/* Paragraphe de résumé (texte principal) */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-resume {
    margin: 0;
    font-size: 0.92rem;
    line-height: 1.45;
    color: #27384a;
}

/* =====================================================================================
   Appliquer la police Amarante aux titres des popups 
   ===================================================================================== */
/*@import url('https://fonts.googleapis.com/css2?family=Amarante&display=swap');*/

/* Appliquer la police Amarante aux titres premium */
/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-title {
    font-family: 'Amarante', serif;
    color: rgb(116, 78, 21);
    font-weight: 600;       /* Pour un look élégant & visible */
    letter-spacing: 0.5px;  /* Légère aération pour un rendu premium */
}

/*	⚠️ Utilisé dans custom-deco-home-section-luthiers.php */
/*	⚠️ Utilisé dans custom-deco-home-section-artistes.php */
.cdsc-popup-hp-title {
    text-shadow: 0 1px 1px rgba(0,0,0,0.06);
}

/* ============================================================================
   Custom Deco - Styles centralisés pour formulaires
   ============================================================================ */

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-form{
    width: 100%;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-field{
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-bottom: 12px;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-label{
    font-weight: 800;
    font-size: 0.95rem;
    color: rgba(0,0,0,0.82);
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-input{
    width: 100%;
    border-radius: 12px;
    padding: 10px 12px;
    border: 1px solid rgba(0,0,0,0.14);
    background: rgba(255,255,255,0.85);
    box-shadow: 0 10px 22px rgba(0,0,0,.08);
    outline: none;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-input:focus{
    border-color: rgba(28,78,128,0.55);
    box-shadow: 0 12px 26px rgba(0,0,0,.10);
}

/* Variante compacte pour champs courts numériques */
.cdsc-input--compact{
    width: auto;
    max-width: 88px;
    min-height: 34px;
    height: 34px;

    padding: 6px 8px;
    border-radius: 8px;

    font-size: 0.9rem;
    line-height: 1;
    font-weight: 700;
}

/* Ligne formulaire compacte : label + champ + aide */
.cdsc-field-inline{
    display: grid;
    grid-template-columns: minmax(120px, auto) auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.cdsc-field-inline .cdsc-label{
    margin: 0;
    white-space: nowrap;
}

.cdsc-field-inline .cdsc-hint{
    margin: 0;
}

/* Champ avec action intégrée */
.cdsc-input-wrap{
    position: relative;
    width: 100%;
}

.cdsc-input-wrap .cdsc-input{
    padding-right: 92px;
}

.cdsc-password-toggle{
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);

    border: 0;
    background: transparent;
    color: var(--cd-primary);

    font-size: 0.85rem;
    font-weight: 800;
    line-height: 1;

    cursor: pointer;
    padding: 6px 4px;
}

.cdsc-password-toggle:hover{
    color: var(--cd-secondary);
    text-decoration: underline;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-hint{
    margin: 0;
    font-size: 0.85rem;
    opacity: 0.75;
    font-style: italic;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-grid-2{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-grid-3{
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
@media (max-width: 720px){
    .cdsc-grid-2,
    .cdsc-grid-3{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 720px){
    .cdsc-field-inline{
        grid-template-columns: 1fr;
        align-items: stretch;
        gap: 6px;
    }

    .cdsc-field-inline .cdsc-input--compact{
        width: 100%;
        max-width: none;
    }
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-actions{
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-actions__spacer{
    flex: 1 1 auto;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-alert{
    margin-top: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    background: #fff1f2;
    border: 1px solid #fecdd3;
    color: #9f1239;
    font-weight: 700;
}

/*	⚠️ Utilisé dans custom-deco-client-commande-facturation.php */
.cdsc-alert.is-hidden{
    display: none !important;
}

/* =====================================================================================
   Custom Deco – formulaires génériques (compatibilité avec anciens formulaires)
   ===================================================================================== */

/* Bloc formulaire générique */
.cdsc-form-block{
    width: 100%;
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
    box-sizing: border-box;

    background: var(--cd-surface);
    border: 1px solid var(--cd-border);
    border-radius: 10px;
    padding: 16px;
}

/* Label de formulaire */
.cdsc-label{
    font-weight: 600;
    display:block;
    margin-bottom:6px;
}

/* Texte d'aide */
.cdsc-help{
    color: var(--cd-muted);
    font-size: .9rem;
    margin: 4px 0 8px 0;
}

/* Champ input standard */
.cdsc-input{
    width:100%;
    box-sizing:border-box;

    padding: .65rem .75rem;
    font-size: var(--cd-font-size);

    border:1px solid #cbd5e1;
    border-radius:5px;

    min-height:40px;
    outline:none;
}

.cdsc-input:focus{
    border-color: var(--cd-primary);
    box-shadow:0 0 0 3px rgba(28,78,128,.15);
}

/* Champ lecture seule */
.cdsc-input.is-readonly{
    background:#eeeeee;
    color:#111;
    font-weight:500;
}

/* Required */
.cdsc-required{
    color:#b91c1c;
    margin-left:.25rem;
    font-weight:700;
}

/* Checkbox alignée */
.cdsc-checkbox{
    display:flex;
    align-items:center;
    gap:8px;
}

/* Ligne formulaire */
.cdsc-row{
    margin-top:.75rem;
}


/* =====================================================================================
   WYSIWYG premium – TinyMCE / wp_editor
   ===================================================================================== */

.cdsc-wysiwyg {
    width: 100%;
    min-width: 0;
}

.cdsc-wysiwyg .wp-editor-wrap {
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid rgba(0,0,0,.10);
    background: rgba(255,255,255,.88);
    box-shadow: 0 10px 22px rgba(0,0,0,.08);
}

.cdsc-wysiwyg .wp-editor-container {
    border: 0;
}

.cdsc-wysiwyg .mce-toolbar-grp,
.cdsc-wysiwyg .quicktags-toolbar {
    background: linear-gradient(180deg, rgba(255,255,255,.96), rgba(255,250,242,.92));
    border-bottom: 1px solid rgba(0,0,0,.08);
}

.cdsc-wysiwyg textarea.wp-editor-area {
    width: 100%;
    border: 0;
    padding: 12px;
    background: #ffffff;
    font-size: .95rem;
    line-height: 1.45;
	resize: none;
}

.cdsc-wysiwyg iframe {
    background: #ffffff;
}

.cdsc-wysiwyg .mce-resizehandle {
    display: none !important;
}


/* ============================================================================
	Bloc actions géolocalisation (édition profil)
   ============================================================================*/

.cdsc-actions--geo {
    display: flex;
    gap: .75rem;
    align-items: flex-end;
    flex-wrap: wrap;
}

@media (min-width: 768px) {
    .cdsc-actions--geo {
        flex-wrap: nowrap;
    }
}

.cdsc-actions--geo > .cdsc-geo-field {
    flex: 1 1 35%;
    min-width: 150px;
}

.cdsc-actions--geo > .cdsc-geo-btn {
    flex: 0 0 auto;
    margin-left: auto;
}

.cdsc-actions--geo label {
    display: block;
    margin-bottom: .25rem;
    line-height: 1.2;
}

.cdsc-actions--geo .cdsc-input {
    width: 100%;
}