/* fonctions/listes/colonnes.css — listes à deux colonnes
   Extrait de styles.css à l'étape 8 du découpage. L'ordre de chargement (index.html) est celui
   de l'ancienne feuille : à spécificité égale, la dernière règle l'emporte (voir CARTE.md, CSS). */
/* ==== Listes à deux colonnes ==== */
.list-cols{flex:1;min-height:0;display:flex;align-items:stretch;padding-top:calc(3px * var(--ui-scale-factor));}
.list-col{flex:1 1 0;min-width:0;min-height:0;display:flex;flex-direction:column;}
.list-col + .list-col{border-left:calc(1px * var(--ui-scale-factor)) solid var(--border-soft);}
.list-col .list-cards{flex:1;}
.list-col-head{display:flex;align-items:center;gap:calc(4px * var(--ui-scale-factor));padding:0 calc(6px * var(--ui-scale-factor)) calc(3px * var(--ui-scale-factor)) calc(8px * var(--ui-scale-factor));flex-shrink:0;}
.list-col-title{flex:1;min-width:0;background:transparent;border:calc(1px * var(--ui-scale-factor)) solid transparent;border-radius:calc(4px * var(--ui-scale-factor));padding:calc(2px * var(--ui-scale-factor)) calc(3px * var(--ui-scale-factor));margin-left:calc(-3px * var(--ui-scale-factor));color:var(--text-dim);font:inherit;font-size:calc(9px * var(--ui-scale-factor));font-weight:700;letter-spacing:.06em;text-transform:uppercase;text-overflow:ellipsis;}
.list-col-title::placeholder{color:var(--text-faint);font-weight:600;}
.list-col-title:hover{border-color:var(--border-soft);}
.list-col-title:focus{outline:none;border-color:var(--accent);background:var(--surface-2);color:var(--text);text-transform:none;letter-spacing:0;}
.list-col-count{flex-shrink:0;min-width:calc(14px * var(--ui-scale-factor));padding:0 calc(4px * var(--ui-scale-factor));border-radius:calc(7px * var(--ui-scale-factor));background:var(--surface-3);color:var(--text-faint);font-size:calc(8px * var(--ui-scale-factor));font-weight:650;line-height:calc(14px * var(--ui-scale-factor));text-align:center;font-variant-numeric:tabular-nums;}
.list-col-add{flex-shrink:0;width:calc(16px * var(--ui-scale-factor));height:calc(16px * var(--ui-scale-factor));padding:0;border:0;border-radius:calc(4px * var(--ui-scale-factor));background:transparent;color:var(--text-faint);font:600 calc(12px * var(--ui-scale-factor))/1 system-ui,sans-serif;display:inline-flex;align-items:center;justify-content:center;opacity:0;transition:opacity .12s;}
.list-col:hover .list-col-add,.list-col-add:focus-visible{opacity:1;}
.list-col-add:hover{background:var(--surface-3);color:var(--text);}
/* Options de liste › Colonnes */
.list-options-modal .agenda-seg.list-cols-seg{display:inline-flex;width:max-content;max-width:100%;align-self:flex-start;vertical-align:top;}
/* .list-options-modal.list-options-modal : spécificité renforcée, pour l’emporter sur les styles génériques sans dépendre de l’ordre. */
.list-options-modal.list-options-modal .list-subtitle-field input{width:100%;min-width:0;box-sizing:border-box;background:var(--surface-2);border:calc(1px * var(--ui-scale-factor)) solid var(--border);border-radius:calc(5px * var(--ui-scale-factor));color:var(--text);font:inherit;font-size:calc(10px * var(--ui-scale-factor));padding:calc(5px * var(--ui-scale-factor)) calc(7px * var(--ui-scale-factor));}
.list-options-modal .list-subtitle-field input:focus{outline:none;border-color:var(--accent);}
.list-subtitles{display:grid;grid-template-columns:1fr 1fr;gap:calc(6px * var(--ui-scale-factor));margin-top:calc(6px * var(--ui-scale-factor));}
.list-subtitles[hidden]{display:none;}
.list-subtitle-field{display:flex;flex-direction:column;gap:calc(3px * var(--ui-scale-factor));min-width:0;}
.list-subtitle-field span{font-size:calc(8.5px * var(--ui-scale-factor));color:var(--text-faint);font-weight:600;}
.list-cols-note{margin:calc(5px * var(--ui-scale-factor)) 0 0;font-size:calc(8.5px * var(--ui-scale-factor));color:var(--text-faint);line-height:1.4;}
.list-cols-note:empty{display:none;}

/* ==== Listes à deux colonnes — suite (rapatriée de interface/surcharges.css à l’étape 8 : sans effet sur la cascade) ==== */
@media (hover:none){.list-col-add{opacity:.8;}}
