/* =============================================
   BIBLIOTHÈQUE DU TRÉSOR — FRONT CSS
   ============================================= */

/* Variables par défaut (overridées par PHP) */
.filio-library {
  --filio-gold:      #B8963E;
  --filio-gold-pale: rgba(184,150,62,0.12);
  --filio-navy:      #1A1C1E;
  --filio-font:      inherit;
  --filio-ft:        14px;
  --filio-fb:        13px;
  --filio-fm:        11px;
  --filio-fw:        500;
  --filio-border:    rgba(0,0,0,0.08);
  --filio-bg:        #ffffff;
  --filio-bg2:       #f8f8f8;
  --filio-text:      #333333;
  --filio-text2:     #666666;
  --filio-text3:     #999999;
  --filio-radius:    6px;
  font-family:    var(--filio-font);
  color:          var(--filio-text);
}

*, *::before, *::after { box-sizing: border-box; }

/* ── STATS ROW ── */
.filio-stats-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}
.filio-stat-pill {
  background: var(--filio-bg2);
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  padding: 12px 14px;
  text-align: center;
}
.filio-snum {
  display: block;
  font-size: 22px;
  font-weight: var(--filio-fw);
  color: var(--filio-gold);
  line-height: 1;
  margin-bottom: 4px;
}
.filio-slbl { font-size: var(--filio-fm); color: var(--filio-text3); }

/* ── TOPBAR ── */
.filio-topbar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 18px;
  flex-wrap: wrap;
}
.filio-search-wrap {
  flex: 1;
  min-width: 200px;
  position: relative;
}
.filio-search-ico {
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 16px;
  height: 16px;
  color: var(--filio-text3);
  pointer-events: none;
}
.filio-search-input {
  width: 100%;
  padding: 8px 12px 8px 34px;
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  font-size: var(--filio-fb);
  font-family: var(--filio-font);
  color: var(--filio-text);
  background: var(--filio-bg);
  outline: none;
  transition: border-color .15s;
}
.filio-search-input:focus { border-color: var(--filio-gold); }
.filio-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
}
.filio-filter-select {
  padding: 7px 28px 7px 10px;
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  font-size: var(--filio-fm);
  font-family: var(--filio-font);
  color: var(--filio-text2);
  background: var(--filio-bg);
  cursor: pointer;
  outline: none;
  min-width: 140px;
  max-width: 200px;
  white-space: nowrap;
  overflow: visible;
  text-overflow: ellipsis;
}
.filio-filter-select:focus { border-color: var(--filio-gold); }
.filio-view-toggle { display: flex; border: 0.5px solid var(--filio-border); border-radius: var(--filio-radius); overflow: hidden; }
.filio-view-btn {
  padding: 0 10px;
  background: var(--filio-bg);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--filio-text3);
  flex-shrink: 0;
  line-height: 1;
}
.filio-view-btn svg { width: 15px; height: 15px; display: block; }
.filio-view-btn.active { background: var(--filio-navy); color: #fff; }
.filio-view-btn.active svg { stroke: #fff; }

/* ── BODY LAYOUT ── */
.filio-body { display: block; }
.filio-body.has-sidebar {
  display: grid;
  grid-template-columns: 270px 1fr;
  gap: 20px;
  align-items: start;
}

/* ── SIDEBAR ── */
.filio-sidebar { position: sticky; top: 80px; }
.filio-sb-section {
  background: var(--filio-bg);
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  overflow: hidden;
  margin-bottom: 14px;
}
.filio-sb-head {
  background: var(--filio-navy);
  padding: 10px 14px;
  font-size: var(--filio-fm);
  font-weight: 600;
  color: rgba(255,255,255,0.6);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.filio-sb-nav { list-style: none; padding: 0; margin: 0; padding-left: 0; margin-left: 0; }
.filio-sb-nav li { border-bottom: 0.5px solid var(--filio-border); margin-left: 0 !important; padding-left: 0 !important; }
.filio-sidebar ul li { margin-left: 0 !important; padding-left: 0 !important; }
.filio-sb-nav li:last-child { border-bottom: none; }
.filio-sb-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  font-size: var(--filio-fb);
  color: var(--filio-text2);
  text-decoration: none;
  transition: background .15s;
}
.filio-sb-link svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--filio-gold); }
.filio-sb-link:hover { background: var(--filio-bg2); color: var(--filio-text); }
.filio-sb-link.active {
  background: var(--filio-gold-pale);
  color: var(--filio-gold);
  font-weight: var(--filio-fw);
  border-left: 2.5px solid var(--filio-gold);
  padding-left: 9.5px;
}
.filio-sb-link.active svg { color: var(--filio-gold); }
.filio-sb-count {
  margin-left: auto;
  font-size: 10px;
  padding: 1px 6px;
  background: var(--filio-bg2);
  border-radius: 20px;
  color: var(--filio-text3);
  flex-shrink: 0;
}
.filio-sb-link.active .filio-sb-count {
  background: rgba(184,150,62,0.15);
  color: var(--filio-gold);
}
.filio-sb-services { padding: 0; }
.filio-service-link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  background: var(--filio-navy);
  color: rgba(255,255,255,0.75);
  text-decoration: none;
  font-size: var(--filio-fm);
  border-bottom: 0.5px solid rgba(255,255,255,0.06);
  transition: background .15s;
}
.filio-service-link svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--filio-gold); }
.filio-service-link:hover { background: rgba(255,255,255,0.06); color: #fff; }

/* ── RESULTS HEADER ── */
.filio-results-header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 14px;
  min-height: 24px;
}
.filio-results-count { font-size: var(--filio-fm); color: var(--filio-text3); }
.filio-active-cat {
  font-size: var(--filio-fm);
  padding: 2px 10px;
  border-radius: 20px;
  background: var(--filio-gold-pale);
  color: var(--filio-gold);
  font-weight: 500;
  display: none;
}
.filio-active-cat.visible { display: inline-block; }

/* ── LOADING ── */
.filio-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px;
  gap: 12px;
  color: var(--filio-text3);
  font-size: var(--filio-fm);
}
.filio-spinner {
  width: 28px; height: 28px;
  border: 2.5px solid var(--filio-border);
  border-top-color: var(--filio-gold);
  border-radius: 50%;
  animation: filio-spin .8s linear infinite;
}
@keyframes filio-spin { to { transform: rotate(360deg); } }

/* ── VUE GRILLE ── */
.filio-view-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
  gap: 14px;
}
.filio-card {
  background: var(--filio-bg);
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  overflow: hidden;
  transition: border-color .15s, box-shadow .15s;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}
.filio-card:hover {
  border-color: var(--filio-gold);
  box-shadow: 0 4px 16px rgba(0,0,0,0.07);
}
.filio-card-cover {
  width: 100%;
  aspect-ratio: 1/1;
  background: var(--filio-bg2);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.filio-card-cover img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.filio-card-cover-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%; height: 100%;
}
.filio-card-cover-placeholder svg { width: 32px; height: 32px; color: var(--filio-text3); }
.filio-type-badge {
  position: absolute;
  top: 7px; left: 7px;
  font-size: 9px;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 3px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.filio-featured-star {
  position: absolute;
  top: 7px; right: 7px;
  font-size: 13px;
}
.filio-card-body {
  padding: 10px 11px 6px;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 72px;
}
.filio-card-title {
  font-size: var(--filio-ft);
  font-weight: var(--filio-fw);
  color: var(--filio-text);
  line-height: 1.4;
  margin-bottom: 5px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  flex: 1;
}
.filio-card-meta {
  display: flex;
  align-items: center;
  gap: 5px;
  flex-wrap: wrap;
  font-size: var(--filio-fm);
  color: var(--filio-text3);
}
.filio-card-meta svg { width: 12px; height: 12px; flex-shrink: 0; }
.filio-card-footer {
  padding: 0 11px;
  height: 36px;
  border-top: 0.5px solid var(--filio-border);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  margin-top: 6px;
}
.filio-dl-btn {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: var(--filio-fm);
  font-weight: 500;
  color: var(--filio-gold);
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
  font-family: var(--filio-font);
}
.filio-dl-btn svg { width: 14px; height: 14px; }
.filio-dl-btn:hover { opacity: 0.75; }
.filio-file-info { font-size: 10px; color: var(--filio-text3); }
.filio-dl-count { font-size: 10px; color: var(--filio-text3); }

/* ── VUE LISTE ── */
.filio-view-list { display: flex; flex-direction: column; gap: 8px; }
.filio-list-item {
  background: var(--filio-bg);
  border: 0.5px solid var(--filio-border);
  border-radius: var(--filio-radius);
  padding: 12px 14px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
  transition: border-color .15s;
}
.filio-list-item:hover { border-color: var(--filio-gold); }
.filio-list-thumb {
  width: 44px; height: 56px;
  border-radius: 4px;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--filio-bg2);
  display: flex;
  align-items: center;
  justify-content: center;
}
.filio-list-thumb img { width: 100%; height: 100%; object-fit: cover; }
.filio-list-thumb svg { width: 20px; height: 20px; color: var(--filio-text3); }
.filio-list-info { flex: 1; min-width: 0; }
.filio-list-title {
  font-size: var(--filio-ft);
  font-weight: var(--filio-fw);
  color: var(--filio-text);
  line-height: 1.4;
  margin-bottom: 5px;
}
.filio-list-meta {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-size: var(--filio-fm);
  color: var(--filio-text3);
}
.filio-list-actions {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}
.filio-icon-btn {
  width: 30px; height: 30px;
  border-radius: 4px;
  border: 0.5px solid var(--filio-border);
  background: var(--filio-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: var(--filio-text2);
}
.filio-icon-btn svg { width: 14px; height: 14px; }
.filio-icon-btn:hover {
  border-color: var(--filio-gold);
  color: var(--filio-gold);
  background: var(--filio-gold-pale);
}

/* ── TYPE BADGES COULEURS ── */
.filio-badge-rapport     { background: #FAC775; color: #633806; }
.filio-badge-bulletin    { background: #B5D4F4; color: #0C447C; }
.filio-badge-decret      { background: #1A1C1E; color: #B8963E; }
.filio-badge-directive   { background: #FAEEDA; color: #854F0B; }
.filio-badge-instruction { background: #FAEEDA; color: #854F0B; }
.filio-badge-code        { background: #EEEDFE; color: #534AB7; }
.filio-badge-strategie   { background: #EAF3DE; color: #3B6D11; }
.filio-badge-loi         { background: #F1EFE8; color: #5F5E5A; }
.filio-badge-autre       { background: #f0f0f0; color: #666; }

/* ── VIDE ── */
.filio-empty {
  text-align: center;
  padding: 48px 24px;
  color: var(--filio-text3);
}
.filio-empty svg { width: 40px; height: 40px; margin: 0 auto 12px; display: block; opacity: 0.4; }
.filio-empty p { font-size: var(--filio-fb); }

/* ── PAGINATION ── */
.filio-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 20px;
  flex-wrap: wrap;
}
.filio-page-btn {
  min-width: 32px; height: 32px;
  padding: 0 8px;
  border-radius: var(--filio-radius);
  border: 0.5px solid var(--filio-border);
  background: var(--filio-bg);
  font-size: var(--filio-fm);
  font-weight: 500;
  color: var(--filio-text2);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, border-color .15s;
  font-family: var(--filio-font);
}
.filio-page-btn.active { background: var(--filio-navy); border-color: var(--filio-navy); color: #fff; }
.filio-page-btn:hover:not(.active) { border-color: var(--filio-gold); color: var(--filio-gold); }
.filio-page-btn svg { width: 13px; height: 13px; }

/* ── TOAST ── */
.filio-toast {
  position: fixed;
  bottom: 20px;
  right: 20px;
  background: var(--filio-navy);
  color: #fff;
  padding: 12px 20px;
  border-radius: var(--filio-radius);
  font-size: var(--filio-fb);
  box-shadow: 0 4px 16px rgba(0,0,0,0.2);
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 8px;
  animation: filio-slidein .3s ease;
  border-left: 3px solid var(--filio-gold);
}
@keyframes filio-slidein { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }

/* ── RESPONSIVE ── */
@media (max-width: 768px) {
  .filio-body.has-sidebar { grid-template-columns: 1fr; }
  .filio-sidebar { position: static; }
  .filio-stats-row { grid-template-columns: repeat(2,1fr); }
  .filio-view-grid { grid-template-columns: repeat(auto-fill, minmax(140px,1fr)); }
  .filio-topbar { flex-direction: column; align-items: stretch; }
  .filio-toolbar { justify-content: flex-end; }
}
@media (max-width: 480px) {
  .filio-view-grid { grid-template-columns: 1fr 1fr; }
}

/* ══════════════════════════════════════════════
   MISES À JOUR v1.1
   ══════════════════════════════════════════════ */

/* ── GRILLE : colonnes dynamiques (backend) ── */
.filio-view-grid {
  grid-template-columns: repeat(var(--filio-grid-cols, 4), 1fr);
}

/* ── TOPBAR — reset complet contre les interférences du thème ── */

/* Hauteur uniforme 36px sur tous les contrôles de la topbar */
.filio-topbar .filio-search-input,
.filio-topbar .filio-filter-select,
.filio-topbar .filio-view-btn,
.filio-topbar .filio-view-toggle {
  height:      36px !important;
  min-height:  36px !important;
  max-height:  36px !important;
  box-sizing:  border-box !important;
  vertical-align: middle !important;
}

/* Search input */
.filio-topbar .filio-search-input {
  padding-top:    0 !important;
  padding-bottom: 0 !important;
  line-height:    36px !important;
  margin:         0 !important;
}

/* Selects — reset tout ce que le thème peut injecter */
.filio-topbar .filio-filter-select {
  padding-top:    0 !important;
  padding-bottom: 0 !important;
  line-height:    1 !important;
  margin:         0 !important;
  appearance:     auto !important;
  -webkit-appearance: menulist !important;
}

/* Boutons vue grille/liste — reset padding/margin du thème */
.filio-topbar .filio-view-btn {
  padding:     0 10px !important;
  margin:      0 !important;
  line-height: 1 !important;
  display:     inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  outline:     none !important;
}

/* Le conteneur toggle garde overflow:hidden pour les coins arrondis */
.filio-topbar .filio-view-toggle {
  display:    inline-flex !important;
  align-items: stretch !important;
  flex-shrink: 0 !important;
  overflow:   hidden !important;
  padding:    0 !important;
  margin:     0 !important;
}

/* SVG dans les boutons vue — taille fixe */
.filio-topbar .filio-view-btn svg {
  width:       15px !important;
  height:      15px !important;
  flex-shrink: 0 !important;
  display:     block !important;
}

/* Toolbar flex — alignement forcé */
.filio-toolbar {
  display:     flex !important;
  align-items: center !important;
  gap:         8px !important;
  flex-wrap:   nowrap !important;
}

/* Topbar globale */
.filio-topbar {
  display:     flex !important;
  align-items: center !important;
  gap:         10px !important;
}

.filio-search-ico {
  top: 50%;
}

/* ── SIDEBAR — typographie & espacement via CSS vars ── */
.filio-sb-link {
  font-family:     var(--filio-sb-font, inherit);
  font-size:       var(--filio-sb-fsize, 13px);
  font-weight:     var(--filio-sb-fw, 400);
  color:           var(--filio-sb-color, #444);
  padding:         var(--filio-sb-pad-v, 9px) var(--filio-sb-pad-h, 12px);
  line-height:     var(--filio-sb-lh, 1.4);
  letter-spacing:  var(--filio-sb-ls, 0em);
}
.filio-sb-nav li {
  margin-bottom: var(--filio-sb-gap, 0px);
}

/* ── ICÔNE DE CATÉGORIE dans la sidebar ── */
.filio-cat-icon-wrap {
  display:         inline-flex;
  align-items:     center;
  width:           var(--filio-icon-size, 18px);
  height:          var(--filio-icon-size, 18px);
  flex-shrink:     0;
  color:           var(--filio-icon-color, var(--filio-gold));
  position:        relative;
  top:             var(--filio-icon-valign, 0px);
}
.filio-cat-icon-wrap svg {
  width:  100%;
  height: 100%;
}
/* Appliquer gap icône → texte sur tous les liens sidebar */
.filio-sb-link {
  gap: var(--filio-icon-gap, 8px);
}
.filio-sb-link svg {
  width:      var(--filio-icon-size, 18px);
  height:     var(--filio-icon-size, 18px);
  flex-shrink: 0;
  color:       var(--filio-icon-color, var(--filio-gold));
  position:    relative;
  top:         var(--filio-icon-valign, 0px);
}

/* ── SIDEBAR — look moderne, plus aéré ── */
.filio-sb-section {
  border-radius: 10px;
  border:        1px solid var(--filio-border);
  box-shadow:    0 1px 4px rgba(0,0,0,0.04);
  overflow:      hidden;
}
.filio-sb-head {
  background:     var(--filio-navy);
  padding:        12px 16px 11px;
  font-size:      10px;
  font-weight:    700;
  color:          rgba(255,255,255,0.55);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  display:        flex;
  align-items:    center;
  gap:            7px;
}
.filio-sb-head::before {
  content:    '';
  display:    inline-block;
  width:      14px;
  height:     2px;
  background: var(--filio-gold);
  border-radius: 2px;
  flex-shrink: 0;
}
.filio-sb-nav li {
  border-bottom: 1px solid var(--filio-border);
}
.filio-sb-nav li:last-child {
  border-bottom: none;
}
.filio-sb-link {
  gap:        10px;
  transition: background .15s, color .15s, padding-left .1s;
}
.filio-sb-link:hover {
  background:  var(--filio-bg2);
  color:       var(--filio-text);
  padding-left: calc(var(--filio-sb-pad-h, 12px) + 4px);
}
.filio-sb-link.active {
  border-left:  3px solid var(--filio-gold);
  padding-left: calc(var(--filio-sb-pad-h, 12px) - 3px);
}
.filio-sb-count {
  border-radius: 20px;
  padding:       2px 7px;
  font-size:     10px;
  font-weight:   500;
}

/* Responsive — réduire les colonnes sur mobile */
@media (max-width: 768px) {
  .filio-view-grid {
    grid-template-columns: repeat(min(var(--filio-grid-cols, 4), 2), 1fr) !important;
  }
}
@media (max-width: 480px) {
  .filio-view-grid {
    grid-template-columns: 1fr 1fr !important;
  }
}

/* ══════════════════════════════════════════════
   RESET ANTI-THÈME — protection maximale
   Neutralise les styles injectés par n'importe
   quel thème WordPress sur les éléments critiques
   ══════════════════════════════════════════════ */

/* Tous les SVG dans Filio — empêcher les thèmes de les casser */
.filio-library svg,
.filio-pdf-modal svg {
  display:        inline-block !important;
  vertical-align: middle !important;
  max-width:      none !important;
  max-height:     none !important;
  width:          auto;
  height:         auto;
  overflow:       visible;
  fill:           none;
  stroke:         currentColor;
}

/* Boutons — reset complet contre les thèmes */
.filio-library button,
.filio-pdf-modal button {
  all:             unset !important;
  box-sizing:      border-box !important;
  cursor:          pointer !important;
  font-family:     inherit !important;
  line-height:     1 !important;
  -webkit-appearance: none !important;
  appearance:      none !important;
}

/* Liens dans la sidebar et partout dans filio */
.filio-library a,
.filio-library a:visited {
  text-decoration: none !important;
}

/* ──────────────────────────────────────────────
   BOUTON FERMER LA VISIONNEUSE
   reset + styles forcés pour être visible quel
   que soit le thème actif
────────────────────────────────────────────── */
.filio-pdf-modal-close {
  all:             unset !important;
  box-sizing:      border-box !important;
  cursor:          pointer !important;
  width:           34px !important;
  height:          34px !important;
  min-width:       34px !important;
  min-height:      34px !important;
  border-radius:   6px !important;
  background:      rgba(255,255,255,0.15) !important;
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
  color:           #ffffff !important;
  flex-shrink:     0 !important;
  transition:      background .15s !important;
  border:          1px solid rgba(255,255,255,0.2) !important;
  outline:         none !important;
  -webkit-appearance: none !important;
  appearance:      none !important;
}
.filio-pdf-modal-close:hover,
.filio-pdf-modal-close:focus {
  background: rgba(255,255,255,0.28) !important;
}
.filio-pdf-modal-close svg {
  display:  block !important;
  width:    16px !important;
  height:   16px !important;
  color:    #ffffff !important;
  stroke:   #ffffff !important;
  fill:     none !important;
  flex-shrink: 0 !important;
  pointer-events: none !important;
}

/* ──────────────────────────────────────────────
   ICÔNES DANS LES BOUTONS — vue liste & grille
────────────────────────────────────────────── */
.filio-icon-btn {
  all:             unset !important;
  box-sizing:      border-box !important;
  cursor:          pointer !important;
  width:           32px !important;
  height:          32px !important;
  min-width:       32px !important;
  min-height:      32px !important;
  border-radius:   5px !important;
  border:          1px solid var(--filio-border) !important;
  background:      var(--filio-bg) !important;
  display:         inline-flex !important;
  align-items:     center !important;
  justify-content: center !important;
  color:           var(--filio-text2) !important;
  transition:      border-color .15s, color .15s, background .15s !important;
  -webkit-appearance: none !important;
  appearance:      none !important;
}
.filio-icon-btn:hover,
.filio-icon-btn:focus {
  border-color: var(--filio-gold) !important;
  color:        var(--filio-gold) !important;
  background:   var(--filio-gold-pale) !important;
}
.filio-icon-btn svg {
  display:  block !important;
  width:    15px !important;
  height:   15px !important;
  stroke:   currentColor !important;
  fill:     none !important;
  flex-shrink: 0 !important;
  pointer-events: none !important;
  max-width:  none !important;
  max-height: none !important;
}

/* ──────────────────────────────────────────────
   BOUTON VOIR — vue grille (card footer)
────────────────────────────────────────────── */
.filio-view-btn-card {
  all:         unset !important;
  box-sizing:  border-box !important;
  cursor:      pointer !important;
  display:     inline-flex !important;
  align-items: center !important;
  gap:         4px !important;
  font-size:   var(--filio-fm) !important;
  font-weight: 500 !important;
  color:       var(--filio-text2) !important;
  font-family: var(--filio-font) !important;
  transition:  color .15s !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}
.filio-view-btn-card:hover { color: var(--filio-gold) !important; }
.filio-view-btn-card svg {
  display:  inline-block !important;
  width:    14px !important;
  height:   14px !important;
  stroke:   currentColor !important;
  fill:     none !important;
  flex-shrink: 0 !important;
  max-width:   none !important;
  max-height:  none !important;
}

/* ──────────────────────────────────────────────
   BOUTON TÉLÉCHARGER — vue grille
────────────────────────────────────────────── */
.filio-dl-btn {
  all:         unset !important;
  box-sizing:  border-box !important;
  cursor:      pointer !important;
  display:     inline-flex !important;
  align-items: center !important;
  gap:         4px !important;
  font-size:   var(--filio-fm) !important;
  font-weight: 500 !important;
  color:       var(--filio-gold) !important;
  font-family: var(--filio-font) !important;
  line-height: 1 !important;
}
.filio-dl-btn:hover { opacity: .75 !important; }
.filio-dl-btn svg {
  display:  inline-block !important;
  width:    14px !important;
  height:   14px !important;
  stroke:   currentColor !important;
  fill:     none !important;
  flex-shrink: 0 !important;
  max-width:   none !important;
}

/* ──────────────────────────────────────────────
   BOUTON TÉLÉCHARGER dans la visionneuse
────────────────────────────────────────────── */
.filio-pdf-dl-link {
  display:         inline-flex !important;
  align-items:     center !important;
  gap:             5px !important;
  font-size:       12px !important;
  padding:         0 14px !important;
  height:          32px !important;
  background:      #B8963E !important;
  border:          none !important;
  outline:         none !important;
  color:           #fff !important;
  border-radius:   5px !important;
  text-decoration: none !important;
  line-height:     1 !important;
  font-weight:     600 !important;
  cursor:          pointer !important;
  flex-shrink:     0 !important;
  white-space:     nowrap !important;
}
.filio-pdf-dl-link:hover,
.filio-pdf-dl-link:focus,
.filio-pdf-dl-link:visited {
  color:   #fff !important;
  opacity: .88 !important;
}
.filio-pdf-dl-link svg {
  display: inline-block !important;
  width:   13px !important;
  height:  13px !important;
  stroke:  #fff !important;
  fill:    none !important;
  flex-shrink: 0 !important;
}

/* ──────────────────────────────────────────────
   MODAL — protection z-index et positionnement
────────────────────────────────────────────── */
.filio-pdf-modal {
  position:   fixed !important;
  inset:      0 !important;
  z-index:    999999 !important; /* au-dessus des headers sticky des thèmes */
  display:    none;
}
.filio-pdf-modal.filio-modal-open {
  display:         flex !important;
  align-items:     center !important;
  justify-content: center !important;
}
.filio-pdf-modal-overlay {
  position:   absolute !important;
  inset:      0 !important;
  background: rgba(10,10,20,0.75) !important;
  backdrop-filter: blur(3px) !important;
  cursor:     pointer !important;
  z-index:    0 !important;
}
.filio-pdf-modal-box {
  position:      relative !important;
  z-index:       1 !important;
  width:         90vw !important;
  max-width:     1100px !important;
  height:        90vh !important;
  background:    #fff !important;
  border-radius: 10px !important;
  box-shadow:    0 24px 80px rgba(0,0,0,0.4) !important;
  display:       flex !important;
  flex-direction: column !important;
  overflow:      hidden !important;
}
.filio-pdf-modal-header {
  display:         flex !important;
  align-items:     center !important;
  justify-content: space-between !important;
  padding:         10px 14px !important;
  background:      #1A1C1E !important;
  gap:             12px !important;
  flex-shrink:     0 !important;
  min-height:      52px !important;
}
.filio-pdf-modal-title {
  font-size:     14px !important;
  font-weight:   600 !important;
  color:         #ffffff !important;
  flex:          1 !important;
  overflow:      hidden !important;
  text-overflow: ellipsis !important;
  white-space:   nowrap !important;
  margin:        0 !important;
  padding:       0 !important;
}
.filio-pdf-modal-actions {
  display:    flex !important;
  align-items: center !important;
  gap:        8px !important;
  flex-shrink: 0 !important;
}

@media (max-width: 600px) {
  .filio-pdf-modal-box {
    width:         100vw !important;
    height:        100dvh !important;
    border-radius: 0 !important;
    max-width:     none !important;
  }
}
.filio-pdf-modal {
  display:    none;
  position:   fixed;
  inset:      0;
  z-index:    99999;
}
.filio-pdf-modal.filio-modal-open { display: flex; align-items: center; justify-content: center; }

.filio-pdf-modal-overlay {
  position:   absolute;
  inset:      0;
  background: rgba(10,10,20,0.72);
  backdrop-filter: blur(3px);
  cursor:     pointer;
}
.filio-pdf-modal-box {
  position:     relative;
  z-index:      1;
  width:        90vw;
  max-width:    1100px;
  height:       90vh;
  background:   #fff;
  border-radius: 10px;
  box-shadow:   0 24px 80px rgba(0,0,0,0.35);
  display:      flex;
  flex-direction: column;
  overflow:     hidden;
  animation: filio-modal-in .22s cubic-bezier(.4,0,.2,1);
}
@keyframes filio-modal-in {
  from { opacity:0; transform: scale(.96) translateY(12px); }
  to   { opacity:1; transform: scale(1)   translateY(0); }
}
.filio-pdf-modal-header {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  padding:         12px 16px;
  background:      #1A1C1E;
  gap:             12px;
  flex-shrink:     0;
}
.filio-pdf-modal-title {
  font-size:   14px;
  font-weight: 600;
  color:       #fff;
  flex:        1;
  overflow:    hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.filio-pdf-modal-actions {
  display:    flex;
  align-items: center;
  gap:        8px;
  flex-shrink: 0;
}
.filio-pdf-dl-link {
  display:    inline-flex;
  align-items: center;
  gap:        5px;
  font-size:  12px !important;
  padding:    5px 12px !important;
  background: #B8963E !important;
  border:     none !important;
  color:      #fff !important;
  border-radius: 5px !important;
  text-decoration: none;
  line-height: 1 !important;
  height:     30px;
}
.filio-pdf-dl-link:hover { opacity: .88; color: #fff !important; }
.filio-pdf-modal-close {
  width:      32px;
  height:     32px;
  border:     none;
  background: rgba(255,255,255,0.12);
  border-radius: 6px;
  cursor:     pointer;
  display:    flex;
  align-items: center;
  justify-content: center;
  color:      #fff;
  flex-shrink: 0;
  transition: background .15s;
}
.filio-pdf-modal-close:hover { background: rgba(255,255,255,0.22); }
.filio-pdf-modal-body {
  flex:     1;
  position: relative;
  min-height: 0;
}
.filio-pdf-iframe {
  width:  100%;
  height: 100%;
  border: none;
  display: block;
}
.filio-pdf-modal-loading {
  position:        absolute;
  inset:           0;
  display:         flex;
  flex-direction:  column;
  align-items:     center;
  justify-content: center;
  gap:             12px;
  background:      #f8f8f8;
  color:           #888;
  font-size:       13px;
  pointer-events:  none;
  transition:      opacity .3s;
}
.filio-pdf-modal-loading.filio-loaded { opacity: 0; }

/* Bouton "Voir" dans les cards */
.filio-view-btn-card {
  display:    inline-flex;
  align-items: center;
  gap:        4px;
  font-size:  var(--filio-fm);
  font-weight: 500;
  color:      var(--filio-text2);
  cursor:     pointer;
  background: none;
  border:     none;
  padding:    0;
  font-family: var(--filio-font);
  transition: color .15s;
}
.filio-view-btn-card svg { width: 13px; height: 13px; }
.filio-view-btn-card:hover { color: var(--filio-gold); }

@media (max-width: 600px) {
  .filio-pdf-modal-box {
    width: 100vw;
    height: 100dvh;
    border-radius: 0;
    max-width: none;
  }
}

/* Bloquer le scroll quand le modal est ouvert */
body.filio-modal-active { overflow: hidden; }

/* Bouton Voir dans la card */
.filio-view-btn-card {
  flex-shrink: 0;
}