/*
 * Wishes Admin — adaptations minimales sur Dashtrans.
 *
 * RÈGLE : Dashtrans (assets/vendor/dashtrans/app.css) + Bootstrap restent la base.
 * Ce fichier ne redéfinit PAS .card, .modal, .table, .form-control,
 * .dropdown-menu, .page-wrapper ni les DataTables.
 *
 * Seules exceptions justifiées :
 *  - le template fourni est la variante sombre à image de fond (chrome translucide,
 *    sidebar/topbar translucides, textes blancs). Wishes n'utilise pas
 *    d'image de fond : on pose donc un fond clair et des fonds PLEINS
 *    pour la sidebar (anthracite) et la topbar (blanc), avec la couleur
 *    de texte adaptée pour la topbar. Rien d'autre n'est écrasé.
 */

:root {
    --w-gold:    #C9A96E;
    --w-gold-dk: #A8894E;
    --w-ivory:   #FAF7F2;
    --w-beige:   #F5F0E8;
    --w-border:  #E5DDD0;
    --w-text:    #3A3530;
    --w-muted:   #8A8078;
}

/* ── Substrat : remplace l'image de fond sombre par un fond clair Wishes ── */
body { background-color: var(--w-ivory); }

/* ── Sidebar : fond plein anthracite (app.css la prévoit translucide
      sur image sombre ; les textes du menu sont blancs et le restent) ── */
.sidebar-wrapper { background: #2A2A2A; }
.sidebar-wrapper .sidebar-header { background: #2A2A2A; }

/* ── Topbar : fond plein blanc, textes passés en anthracite
      (ils sont blancs dans la variante sombre du template) ── */
.topbar { background: #FFFFFF; border-bottom: 1px solid var(--w-border); }
.topbar .mobile-toggle-menu,
.topbar .user-info .user-name { color: var(--w-text); }
.topbar .user-info .designattion { color: var(--w-muted); }

/* ── Touches de marque Wishes ── */
.sidebar-header .logo-text {
    color: var(--w-gold);
    font-family: Georgia, serif;
    letter-spacing: 2px;
}
.sidebar-wrapper .metismenu .mm-active > a,
.sidebar-wrapper .metismenu a:hover { color: var(--w-gold); }

.btn-primary {
    background-color: var(--w-gold);
    border-color: var(--w-gold-dk);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background-color: var(--w-gold-dk);
    border-color: var(--w-gold-dk);
}

/* ── Badges métier Wishes ── */
.badge-active   { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(74,124,89,.13);  color:#3a7c50; }
.badge-inactive { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(138,128,120,.13); color:#8A8078; }
.badge-new      { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(58,102,128,.13);  color:#3A6680; }
.badge-quoted   { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(176,140,58,.13);  color:#B08C3A; }
.badge-accepted { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(74,124,89,.13);   color:#3a7c50; }
.badge-rejected { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; background:rgba(155,58,58,.13);   color:#9B3A3A; }

/* ── Utilitaires vues ── */
.table-actions { display:flex; gap:5px; align-items:center; }
#wishes-flash > .alert { margin-bottom:0; }

/* ── Composant upload (modal buffet) ── */
.upload-zone {
    border:2px dashed var(--w-border); border-radius:8px; padding:24px 18px;
    text-align:center; cursor:pointer; background:var(--w-ivory);
    transition:border-color .2s, background .2s; display:block;
}
.upload-zone:hover { border-color:var(--w-gold); background:var(--w-beige); }
.upload-zone-icon { font-size:32px; color:var(--w-gold); }
.upload-zone-text { font-size:13px; font-weight:500; color:var(--w-text); margin-top:4px; }
.upload-zone-hint { font-size:11px; color:var(--w-muted); margin-top:2px; }

/* ── Galerie (modal buffet) ── */
.gallery-grid { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.gallery-item { position:relative; width:90px; height:90px; border-radius:6px; overflow:hidden; border:1px solid var(--w-border); }
.gallery-item img { width:100%; height:100%; object-fit:cover; }
.gallery-item-del {
    position:absolute; top:3px; right:3px; width:20px; height:20px; border-radius:50%;
    background:rgba(0,0,0,.55); color:#fff; border:none; cursor:pointer; font-size:10px;
    display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .2s;
}
.gallery-item:hover .gallery-item-del { opacity:1; }
.gallery-item.pending-delete { opacity:.35; border-color:#dc3545; }

/* ── Image principale (modal buffet) ── */
.main-image-wrap { position:relative; display:inline-block; border-radius:8px; overflow:hidden; border:1px solid var(--w-border); }
.main-image-wrap img { max-width:220px; max-height:150px; display:block; object-fit:cover; }
.main-image-del {
    position:absolute; top:5px; right:5px; width:24px; height:24px; border-radius:50%;
    background:rgba(0,0,0,.55); color:#fff; border:none; cursor:pointer; font-size:12px;
    display:flex; align-items:center; justify-content:center;
}

/* ── Pastilles couleur (palettes) ── */
.color-swatch { display:inline-block; width:22px; height:22px; border-radius:50%; border:2px solid rgba(0,0,0,.1); vertical-align:middle; flex-shrink:0; }

/* ── Bibliothèque médias : grille ── */
.media-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:14px; }
.media-card { background:#fff; border:1px solid var(--w-border); border-radius:8px; overflow:hidden; transition:box-shadow .2s; }
.media-card:hover { box-shadow:0 4px 16px rgba(42,35,25,.10); }
.media-card-thumb { width:100%; height:120px; background:var(--w-beige); display:flex; align-items:center; justify-content:center; }
.media-card-thumb img { width:100%; height:100%; object-fit:cover; }
.media-card-thumb .no-preview { font-size:36px; color:var(--w-border); }
.media-card-body { padding:8px 10px 10px; }
.media-card-name { font-size:11px; font-weight:500; color:var(--w-text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.media-card-meta { font-size:10px; color:var(--w-muted); margin-top:2px; }

/* Boutons médias compacts (spécification client) */
.media-card-actions {
    display: flex;
    gap: .35rem;
    flex-wrap: wrap;
    margin-top: 7px;
}
.media-card-actions .btn {
    padding: .25rem .45rem;
    font-size: .75rem;
    line-height: 1.2;
}

/* Aperçu média contenu dans l'écran (spécification client) */
#mediaPreviewImage {
    max-width: 100%;
    max-height: calc(100vh - 230px);
    object-fit: contain;
}

/* ── Login ── */
.wishes-auth-logo {
    font-family: Georgia, serif; font-size: 36px; font-weight: 700;
    color: var(--w-gold); letter-spacing: 4px; display: block; margin-bottom: 4px;
}