/* Consolidation et préparation CT Zero (CtZeroConsolidationPage, CtPrepPage / CtPrepPanel) : partagé par les deux pages. */
.ct-set-header { display:flex; align-items:center; gap:12px; margin:16px 0 8px; padding:8px 16px; background:linear-gradient(135deg,#2563eb,#1e40af); color:white; border-radius:8px; font-weight:600; }
.ct-set-date { opacity:.8; font-weight:400; }
.ct-set-count { margin-left:auto; background:rgba(255,255,255,.2); border-radius:12px; padding:2px 12px; font-size:.85rem; }
.ct-grid { display:flex; flex-wrap:wrap; gap:12px; }
.ct-tile { position:relative; width:150px; border:3px solid var(--pile-border, transparent); border-radius:8px; background:var(--pile-bg, var(--mud-palette-surface)); padding:4px; }
.ct-tile.buried { border-color:#ef4444; box-shadow:0 0 0 2px rgba(239,68,68,.3); }
.ct-tile.unpicked { border-style:dashed; border-color:#f59e0b; }
.ct-tile img { width:100%; border-radius:6px; display:block; }
.ct-tile-qty { position:absolute; top:8px; right:8px; background:#111827; color:white; border-radius:12px; padding:2px 8px; font-weight:700; }
.ct-tile-name { font-size:.8rem; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:4px; }
.ct-tile-badges { display:flex; align-items:center; gap:4px; flex-wrap:wrap; margin-top:3px; }
.ct-tile-badges .fi { width:18px; height:13px; border-radius:2px; flex:none; }
.ct-tile-shares { display:flex; flex-wrap:wrap; gap:4px; margin-top:4px; }
.ct-share { font-size:.72rem; background:#e5e7eb; color:#111827; border-radius:10px; padding:1px 8px; }
.ct-share.buried { background:#ef4444; color:white; }
.ct-share.unpicked { background:#f59e0b; color:white; }

/* ─── Mode « Comparer au Print List » ─── */
.ctc-panes { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:start; }
.ctc-pane { max-height:calc(100vh - 220px); overflow:auto; padding:0 6px 24px; }
.ctc-ct-title { position:sticky; top:0; z-index:2; margin:16px 0 8px; padding:8px 16px; background:linear-gradient(135deg,#0b2a4a,#123c6b); color:white; border-radius:8px; font-weight:600; }
.ct-tile { cursor:pointer; }
/* Focus = celui de la mosaïque de picking (.compact-card-wrapper.focused) : agrandissement, ombre primaire, pulsation lente. */
.ct-tile { transition:transform .2s ease; }
.ct-tile.ctc-sel { z-index:10; border-color:var(--mud-palette-primary); box-shadow:0 0 0 3px var(--mud-palette-primary), 0 8px 24px rgba(0,0,0,.6); animation:ctc-focus-pulse 2.4s ease-in-out infinite; }
@keyframes ctc-focus-pulse { 0%,100% { transform:scale(1.06); } 50% { transform:scale(1.1); } }
.ct-tile.ctc-sel.ctc-pulse { border-color:#2b6de8; animation:ctc-focus-pulse 2.4s ease-in-out infinite, ctc-tpulse 1.1s ease-in-out infinite; }
.ct-tile .ac-img-zone img { height:100%; object-fit:contain; }
.ct-tile.ctc-sel .ac-count-overlay, .ct-tile.ctc-sel .ac-extra-overlay, .ct-tile.ctc-sel .ac-flag-overlay { opacity:1; animation:ac-count-pulse 1.1s ease-in-out infinite; }
@keyframes ctc-tpulse { 0%,100% { box-shadow:0 0 0 2px rgba(43,109,232,.35); } 50% { box-shadow:0 0 0 6px rgba(43,109,232,.55), 0 0 18px rgba(43,109,232,.6); } }
/* Rendu approchant la page CT (police, vignette bandeau, badges) */
.ctc-tbl { width:100%; border-collapse:collapse; background:#fff; color:#212529; font-family:Poppins,Roboto,sans-serif; font-size:14px; border-radius:6px; overflow:hidden; }
.ctc-tbl td { padding:7px 8px; vertical-align:middle; border-top:1px solid #e6e8ec; }
.ctc-tbl tr { cursor:pointer; }
.ctc-thumb { width:1%; white-space:nowrap; } .ctc-thumb img { width:150px; height:46px; object-fit:cover; object-position:50% 12%; border-radius:3px; background:#222; display:block; }
.ctc-qty { width:1%; white-space:nowrap; } .ctc-name u { color:#0b2a4a; } .ctc-name small { color:#6c757d; font-size:85%; }
.ctc-props { white-space:nowrap; display:flex; align-items:center; gap:6px; } .ctc-props .ss { font-size:1.5em; color:#333; }
.ctc-rarity, .ctc-cond { display:inline-block; padding:3px 6px; font-size:11px; font-weight:700; line-height:1; border-radius:3px; color:#fff; min-width:24px; text-align:center; }
.ctc-rarity { background:#0b2a4a; }
.ctc-cond-mt, .ctc-cond-nm { background:#7cb342; } .ctc-cond-sp { background:#c0ca33; } .ctc-cond-mp { background:#f9a825; } .ctc-cond-pl { background:#ef6c00; } .ctc-cond-hp { background:#d84315; } .ctc-cond-po { background:#c62828; }
.ctc-props .fi { width:20px; height:15px; border-radius:2px; } .ctc-foil { color:#f9b000; }
.ctc-num { white-space:nowrap; color:#212529; } .ctc-pill { display:inline-block; background:#adadad; color:#fff; border-radius:10px; padding:3px 8px; font-size:11px; font-weight:700; }
.ctc-price { text-align:right; white-space:nowrap; }
.ctc-tbl tr.ctc-unmatched td { background:#fff4e5; }
.ctc-tbl tr.ctc-sel td { background:#fff7db; box-shadow:inset 4px 0 0 #b9900b; }
.ctc-tbl tr.ctc-sel.ctc-pulse td { box-shadow:inset 4px 0 0 #2b6de8; animation:ctc-rpulse 1.1s ease-in-out infinite; }
@keyframes ctc-rpulse { 0%,100% { background:#eaf1ff; } 50% { background:#c7dbff; } }
@media (prefers-reduced-motion: reduce) { .ct-tile.ctc-sel, .ct-tile.ctc-sel.ctc-pulse, .ct-tile.ctc-sel .ac-count-overlay, .ct-tile.ctc-sel .ac-extra-overlay, .ct-tile.ctc-sel .ac-flag-overlay, .ctc-tbl tr.ctc-sel.ctc-pulse td { animation:none; } .ct-tile.ctc-sel { transform:scale(1.08); } }
@media (max-width: 900px) { .ctc-panes { grid-template-columns:1fr; } .ctc-pane { max-height:none; } }

/* ─── Séparation (phase 0) ─── */
.ctc-sep-pile { margin-top:10px; padding:8px 10px; border-radius:8px; background:rgba(0,0,0,.03); }
.ctc-sep-summary { margin-left:8px; color:#4b5563; }
.ctc-runs { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.ctc-run { display:inline-block; max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; padding:2px 8px; border-radius:6px; border:2px solid #9ca3af; background:#e5e7eb; color:#111827; font-size:.8rem; cursor:pointer; }
.ctc-run.ctc-sel { outline:3px solid #2b6de8; outline-offset:1px; transform:scale(1.04); }
/* ─── Préparation / consolidation ─── */
.ctc-instructions { margin:8px 0 0; padding-left:20px; display:flex; flex-direction:column; gap:6px; }
.ctc-ins { padding:6px 10px; border-radius:6px; cursor:pointer; border-left:5px solid transparent; }
.ctc-ins-move { background:#efe9ff; border-left-color:#7c5cd6; } .ctc-ins-resort { background:#fff1de; border-left-color:#e08a00; }
.ctc-ins.ctc-sel { outline:2px solid #2b6de8; }
.ctc-ins-pile { display:inline-block; padding:1px 8px; border-radius:10px; border:2px solid; font-weight:600; margin-right:6px; }
.ctc-packet { display:inline-block; margin:2px 6px 0 0; padding:1px 6px; background:rgba(0,0,0,.06); border-radius:6px; }
.phase-prep .ct-tile.ctc-cluster-move { --pile-bg:#e4d9ff; --pile-border:#7c5cd6; }
.phase-prep .ct-tile.ctc-cluster-resort { --pile-bg:#ffe0b3; --pile-border:#e08a00; }
.ct-dig { position:absolute; top:40px; left:8px; background:#111827; color:#fbbf24; font-weight:800; font-size:1.1rem; padding:4px 10px; border-radius:8px; box-shadow:0 2px 8px rgba(0,0,0,.4); }
.ct-subpile { position:absolute; bottom:64px; left:8px; background:#374151; color:#fff; font-size:.68rem; font-weight:700; padding:1px 8px; border-radius:10px; text-transform:uppercase; letter-spacing:.04em; }
.ctc-pile-tab { border:3px solid; border-radius:8px; padding:6px 12px; font:inherit; font-weight:600; cursor:pointer; opacity:.7; color:#111827; }
.ctc-pile-tab.sel { opacity:1; box-shadow:0 0 0 2px #111827; }
.ctc-pile-tab-n { margin-left:8px; background:#111827; color:#fff; border-radius:10px; padding:0 8px; font-size:.75rem; }
.ctc-ins-pos { display:inline-block; min-width:64px; font-family:ui-monospace,Menlo,monospace; font-size:.8rem; color:#374151; margin-right:8px; }
.ctc-pile-grid { margin-top:12px; }
.ctc-prep-layout { display:grid; grid-template-rows:auto minmax(0,1fr); height:calc(100vh - 230px); margin-top:8px; }
.ctc-prep-ins { max-height:25vh; overflow:auto; background:#fff; border:2px solid #7c5cd6; border-radius:8px; padding:10px 14px; margin-bottom:8px; transition:max-height .25s ease, padding .25s ease, opacity .25s ease; }
.ctc-prep-ins.collapsed { max-height:0; padding:0 14px; border-width:0; margin-bottom:0; opacity:0; overflow:hidden; }
.ctc-prep-progress { font-size:.8rem; color:#6b7280; margin-bottom:4px; }
.ctc-prep-step { font-size:1.05rem; line-height:1.5; }
.ctc-prep-step .ctc-packet { font-size:.95rem; }
#ctc-pile { overflow:auto; align-content:start; padding:4px; }
.ctc-pile-ok { width:100%; padding:10px 14px; background:#dcfce7; color:#14532d; border-radius:6px; }
.ctc-pile-mosaic .ct-tile { transition:opacity .3s ease, filter .3s ease, transform .3s ease; }
.ctc-pile-mosaic .ct-tile.dim { opacity:.22; filter:grayscale(1); }
.ctc-pile-mosaic .ct-tile.red { --pile-bg:#fecaca; --pile-border:#dc2626; }
.ctc-pile-mosaic .ct-tile.green { --pile-bg:#bbf7d0; --pile-border:#16a34a; }
.ctc-pile-mosaic .ct-tile.bounce { animation:ctc-bounce .7s ease-in-out infinite; }
.ctc-pile-mosaic .ct-tile.done { opacity:.4; filter:grayscale(1); outline:2px dashed #9ca3af; outline-offset:-2px; }
.ctc-pile-mosaic .ct-tile.ctx { --pile-bg:#fff; --pile-border:#111827; }
@keyframes ctc-bounce { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-10px); } }
@media (prefers-reduced-motion: reduce) { .ctc-pile-mosaic .ct-tile.bounce { animation:none; outline:3px solid #111827; } }
.ct-tile-pos { position:absolute; top:8px; left:8px; background:rgba(17,24,39,.85); color:#fff; font-family:ui-monospace,Menlo,monospace; font-size:.75rem; padding:1px 6px; border-radius:6px; }
.ct-tile-set { font-size:.7rem; color:#4b5563; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Mention Extra!! / Promo!! du picking (.promo-label), posée sur le haut de la carte : fond sombre pour rester lisible sur l'image. */
.ct-tile .promo-label { top:8px; left:0; right:0; width:max-content; margin:0 auto; transform:none; height:20px; line-height:20px; padding:0 8px; background:rgba(17,24,39,.85); border-radius:6px; z-index:2; }
.ct-tile.ctc-sel .promo-label { color:#ff4444; animation:quantity-pop .9s ease-in-out infinite; }
/* Pulsations (tuile sélectionnée) — mêmes rythmes que la mosaïque de picking */
.ct-tile.ctc-sel .ct-tile-qty.multi { background:#ff4444; animation:quantity-pop .9s ease-in-out infinite; }
.ct-tile.ctc-sel .fi.nonen { animation:ctc-flag-pulse 1.1s ease-in-out infinite; outline:2px solid #ef4444; }
@keyframes quantity-pop { 0%,100% { transform:scale(1); } 50% { transform:scale(1.25); } }
@keyframes ctc-flag-pulse { 0%,100% { transform:scale(1); box-shadow:0 0 0 0 rgba(239,68,68,.5); } 50% { transform:scale(1.2); box-shadow:0 0 0 6px rgba(239,68,68,0); } }
@media (prefers-reduced-motion: reduce) { .ct-tile.ctc-sel .ct-tile-qty.multi, .ct-tile.ctc-sel .promo-label, .ct-tile.ctc-sel .fi.nonen { animation:none; } }

/* Numéro de pile sur la tuile de consolidation : en haut à gauche, sous la ligne de titre de la carte, plus gros que la quantité,
   chiffre et liseré dans la couleur de la pile (--pile-border), fond blanc pour rester lisible sur toute illustration. */
.ct-tile-pile { position:absolute; top:34px; left:6px; min-width:30px; height:38px; padding:0 8px; box-sizing:border-box; border-radius:10px; background:#fff; color:var(--pile-border, #111827); border:2px solid var(--pile-border, #111827); font-weight:800; font-size:1.6rem; line-height:34px; text-align:center; box-shadow:0 2px 6px rgba(0,0,0,.35); pointer-events:none; }
/* Pastille « n · Picking #x · CT y » devant chaque interrupteur de pile, mêmes couleurs que les tuiles */
.ctc-pile-switch { display:inline-flex; align-items:center; gap:4px; margin-left:12px; white-space:nowrap; }
.ctc-pile-chip { display:inline-flex; align-items:center; gap:6px; border:2px solid; border-radius:8px; padding:2px 10px; font-weight:600; font-size:.85rem; }
.ctc-pile-chip b { font-size:1.15rem; }
