/* Pre-production Tracker — dark-adapted variant of distrib.yoyaku.fr classes.
 * Scoped under .ppd to avoid conflicts with .objects-tracker.
 * Dark palette derived from objects-tracker.css --otr-* vars.
 */
.ppd {
    --bg: #15171f;
    --card: #1f222d;
    --row: #1f222d;
    --row-alt: #1a1d27;
    --row-hover: #292d39;
    --bd: #353a4a;
    --bd2: #444a5d;
    --t: #ececf3;
    --td: #b8bcd0;
    --td2: #8a8fa3;
    --g: #49F70C;
    --g-bg: rgba(73,247,12,.12);
    --r: #ef4444;
    --r-bg: rgba(239,68,68,.1);
    --o: #f59e0b;
    --o-bg: rgba(245,158,11,.12);
    --b: #3b82f6;
    --b-bg: rgba(59,130,246,.12);
    --p: #a78bfa;
    --accent: #ececf3;

    background: var(--bg);
    color: var(--t);
    font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', sans-serif;
    font-size: 13px;
    border: 1px solid var(--bd);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    height: calc(100vh - 240px);
    min-height: 520px;
}
.ppd .ppd-hdr { padding: 14px 24px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--bd); flex-shrink: 0; }
.ppd .ppd-hdr h1 { font-size: 18px; font-weight: 800; letter-spacing: -.3px; margin: 0; }
.ppd .ppd-hdr h1 span { color: var(--o); }
.ppd .ppd-hdr .meta { font-size: 11px; color: var(--td); }

.ppd .stats { display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; padding: 14px 24px; flex-shrink: 0; }
.ppd .st { background: var(--card); border: 1px solid var(--bd); border-radius: 12px; padding: 14px 16px; }
.ppd .st .l { font-size: 10px; color: var(--td); text-transform: uppercase; letter-spacing: .5px; font-weight: 600; }
.ppd .st .v { font-size: 28px; font-weight: 800; margin-top: 4px; line-height: 1; color: var(--t); font-variant-numeric: tabular-nums; }
.ppd .st .v.g { color: var(--g); }
.ppd .st .v.o { color: var(--o); }
.ppd .st .v.b { color: var(--b); }
.ppd .st .v.r { color: var(--r); }
.ppd .st .v.p { color: var(--p); }

.ppd .tb { padding: 10px 24px 14px; display: flex; gap: 10px; align-items: center; flex-shrink: 0; border-bottom: 1px solid var(--bd); flex-wrap: wrap; }
.ppd .tb input { background: var(--card); border: 1px solid var(--bd); border-radius: 999px; color: var(--t); padding: 9px 16px; font-size: 12px; font-family: inherit; flex: 1; max-width: 300px; }
.ppd .tb input::placeholder { color: var(--td2); }
.ppd .tb input:focus { outline: none; border-color: var(--o); }
.ppd .tb .ct { font-size: 11px; color: var(--td); margin-left: auto; font-weight: 500; }

.ppd .tw { flex: 1; overflow: auto; position: relative; }
.ppd .table-card { background: var(--card); overflow: hidden; }
.ppd table { width: 100%; border-collapse: separate; border-spacing: 0; min-width: 950px; }
.ppd thead th { background: var(--row-alt); padding: 12px 16px; text-align: left; font-size: 10px; text-transform: uppercase; letter-spacing: .7px; color: var(--td); font-weight: 700; border-bottom: 2px solid var(--bd2); white-space: nowrap; position: sticky; top: 0; z-index: 20; }
.ppd td { padding: 14px 16px; border-bottom: 1px solid var(--bd); vertical-align: middle; white-space: nowrap; font-size: 13px; }
.ppd tbody tr { background: var(--row); }
.ppd tbody tr:nth-child(even) { background: var(--row-alt); }
.ppd tbody tr:hover { background: var(--row-hover); }

.ppd .cat { font-weight: 800; font-size: 14px; letter-spacing: .2px; color: var(--t); font-family: 'SF Mono', 'Menlo', monospace; }
.ppd .label-cell .label-name { font-size: 13px; font-weight: 700; color: var(--t); text-decoration: none; }
.ppd .label-cell .label-name:hover { text-decoration: underline; }
.ppd .label-cell .deal { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: .4px; color: var(--td); margin-top: 3px; }

.ppd .mdots { display: flex; gap: 4px; align-items: center; }
.ppd .md { width: 22px; height: 22px; border-radius: 6px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 800; cursor: pointer; transition: transform .1s; }
.ppd .md:hover { transform: scale(1.1); }
.ppd .md.ok { background: var(--g-bg); color: var(--g); }
.ppd .md.no { background: var(--r-bg); color: var(--r); }

.ppd .pill { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .2px; white-space: nowrap; }
.ppd .pill.done { background: var(--g-bg); color: var(--g); }
.ppd .pill.warn { background: var(--r-bg); color: var(--r); }
.ppd .pill.wait { background: rgba(255,255,255,.05); color: var(--td2); }

.ppd .ibtn { display: inline-flex; align-items: center; gap: 4px; background: transparent; color: var(--t); border: 1px solid var(--bd2); padding: 5px 11px; border-radius: 999px; font-size: 10.5px; font-weight: 600; cursor: pointer; text-decoration: none; font-family: inherit; transition: all .12s; }
.ppd .ibtn:hover { background: var(--row-hover); border-color: var(--td); }
.ppd .ibtn.vincent { border-color: var(--o); color: var(--o); }
.ppd .ibtn.vincent:hover { background: var(--o-bg); }
.ppd .ibtn.lopaz { border-color: var(--p); color: var(--p); }
.ppd .ibtn.lopaz:hover { background: rgba(167,139,250,.12); }
.ppd .ibtn.disabled { opacity: .2; cursor: default; pointer-events: none; }
.ppd .ibtn.approved { background: var(--g-bg); color: var(--g); border-color: rgba(73,247,12,.3); }

.ppd .qty-cell { font-weight: 800; font-size: 16px; font-variant-numeric: tabular-nums; color: var(--t); line-height: 1.1; }
.ppd .qty-cell .sub { font-size: 9px; font-weight: 600; color: var(--g); text-transform: uppercase; letter-spacing: .4px; display: block; margin-top: 2px; }
.ppd .qty-cell .so { font-size: 9px; color: var(--td2); display: block; }

.ppd .mastering-cell { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; }
.ppd .mastering-cell .chosen { font-size: 11px; font-weight: 600; }
.ppd .mastering-cell .chosen.vincent { color: var(--o); }
.ppd .mastering-cell .chosen.lopaz { color: var(--p); }
.ppd .mastering-cell .approve-check { font-size: 10.5px; font-weight: 700; }

.ppd .portal-link { font-size: 9px; color: var(--td2); text-decoration: none; margin-left: 6px; }
.ppd .portal-link:hover { color: var(--td); text-decoration: underline; }


.ppd .stack { display: flex; flex-direction: column; gap: 6px; align-items: flex-start; min-width: 160px; }
.ppd .stack .top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.ppd .loading { text-align: center; padding: 80px; color: var(--td); }
.ppd .spinner { display: inline-block; width: 24px; height: 24px; border: 3px solid var(--bd); border-top-color: var(--o); border-radius: 50%; animation: ppd-spin .8s linear infinite; }
@keyframes ppd-spin { to { transform: rotate(360deg); } }

.ppd .label-cell .money-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 4px; padding-top: 4px; border-top: 1px dashed rgba(255,255,255,.06); font-size: 11px; }
.ppd .label-cell .money-row:first-of-type { margin-top: 6px; }
.ppd .label-cell .money-lbl { font-size: 9px; color: var(--td); text-transform: uppercase; letter-spacing: .4px; font-weight: 600; }
.ppd .label-cell .balance { font-variant-numeric: tabular-nums; font-weight: 600; font-size: 11px; }
.ppd .label-cell .balance.pos { color: var(--g); }
.ppd .label-cell .balance.neg { color: var(--r); }

.ppd .delete-x { cursor: pointer; color: var(--td2); font-size: 18px; opacity: .4; transition: all .15s; padding: 4px 8px; border-radius: 4px; }
.ppd .delete-x:hover { opacity: 1; color: var(--r); background: var(--r-bg); }