/**
 * davidzinc — Base UI partagée
 *
 * SOURCE UNIQUE des variables et des éléments d'interface de base
 * (boutons, champs), consommée par :
 *  - le site (enqueue avant style.css, qui utilise ces variables)
 *  - l'espace client du plugin dz-crm (portail + composant catalogue)
 *
 * C'est ici que le thème définit son identité : modifier une variable
 * rethème le site ET le portail. Voir dz-crm/docs/modules/INTEGRATION-THEME.md
 */

:root {
    --color-primary:   #a4151b;   /* Rouge David Zinc */
    --color-primary-dark: #7d1015;
    --color-dark:      #1c1c1e;   /* Texte sombre / fond header */
    --color-accent:    #a4151b;
    --color-text:      #2d2d2d;
    --color-muted:     #6b7280;
    --color-bg:        #f8f9fa;
    --color-white:     #ffffff;
    --color-border:    #e5e7eb;

    --font-base:  'Inter', system-ui, -apple-system, sans-serif;
    --font-head:  'Inter', system-ui, -apple-system, sans-serif;

    --radius:    4px;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.08);
    --shadow-md: 0 4px 12px rgba(0,0,0,.12);

    --container: 1200px;
    --gap:       1.5rem;
}

/* ============================================================
   BOUTONS
============================================================ */
.btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .65rem 1.4rem;
    border-radius: var(--radius);
    font-weight: 600;
    font-size: .95rem;
    font-family: inherit;
    cursor: pointer;
    border: 2px solid transparent;
    transition: all .2s;
    text-align: center;
    text-decoration: none;
}
.btn-primary {
    background: var(--color-primary);
    color: var(--color-white);
    border-color: var(--color-primary);
}
.btn-primary:hover { background: var(--color-primary-dark); border-color: var(--color-primary-dark); color: var(--color-white); }

.btn-outline {
    background: transparent;
    color: var(--color-primary);
    border-color: var(--color-primary);
}
.btn-outline:hover { background: var(--color-primary); color: var(--color-white); }

.btn-white {
    background: var(--color-white);
    color: var(--color-primary);
}
.btn-white:hover { background: var(--color-bg); color: var(--color-primary); }

/* ============================================================
   CHAMPS DE FORMULAIRE
============================================================ */
.form-control {
    width: 100%;
    padding: .6rem .9rem;
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    font-size: .95rem;
    font-family: inherit;
    color: var(--color-text);
    background: var(--color-white);
    transition: border-color .2s;
}
.form-control:focus { outline: none; border-color: var(--color-primary); box-shadow: 0 0 0 3px rgba(164,21,27,.12); }
textarea.form-control { resize: vertical; min-height: 100px; }