/* ============================================================================
   BARBAROS — orders-sheet.css (Tableur layout, owner choice 2026-10-14)
   ----------------------------------------------------------------------------
   The orders list as one flat sheet: a single card, a sticky column header, one hairline per row,
   quiet hover, and a premium action bar (contextual text action + grouped icon buttons). Replaces
   the batch-8 ticket look visually; orders-flow.css stays loaded for its menu/pill fixes.
   Markup: orders.js renderOrderRow (.os-row) — 9 cells:
     select · n° · client · téléphone · wilaya · produit · total · statut · actions
   Collision list (!important only here):
     s1  undo the batch-8 ticket card (border, radius, margin, rail, lift) on .os-row
     s2  give the sheet back its card surface (orders-flow f1 dissolved it)
     s3  hide the batch-8 progress track under the status pill
     s4  grid columns (orders-premium c1 sets them with !important)
   ============================================================================ */

/* ── 1. the sheet surface (s2) ─────────────────────────────────────────────── */
html[data-buld-theme] body #panel-all-orders .orders-table {
    background: var(--buld-elevated) !important;
    border: 1px solid var(--buld-hairline) !important;
    border-radius: 16px !important;
    overflow: auto;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 18px 40px -26px rgba(0, 0, 0, .7) !important;
}
html[data-buld-theme] body #panel-all-orders .yaya-scope .table-head {
    position: sticky; top: 0; z-index: 2;
    background: var(--buld-surface-2) !important;
    border-bottom: 1px solid var(--buld-divider) !important;
    border-radius: 0 !important;
    padding: 11px 16px !important;
    font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
}
html[data-buld-theme] body #panel-all-orders .yaya-scope .table-head > div { color: var(--buld-ink-3); }

/* ── 2. columns (s4) ───────────────────────────────────────────────────────── */
html[data-buld-theme] body #panel-all-orders .yaya-scope .table-head,
html[data-buld-theme] body #panel-all-orders .yaya-scope .table-row.os-row {
    grid-template-columns: 30px 112px minmax(170px, 1.25fr) 122px 118px minmax(170px, 1.3fr) 104px 168px 286px !important;
    gap: 12px !important;
    min-width: 1300px;
}

/* ── 3. rows: flat lines, not tickets (s1) ─────────────────────────────────── */
html[data-buld-theme] body #allOrdersBody { padding: 0 !important; }
html[data-buld-theme] body #panel-all-orders .yaya-scope #allOrdersBody .table-row.os-row {
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid var(--buld-hairline) !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 9px 16px !important;
    min-height: 58px;
    box-shadow: none !important;
    transform: none !important;
    transition: background-color .15s ease;
}
html[data-buld-theme] body #panel-all-orders .yaya-scope #allOrdersBody .table-row.os-row:last-child { border-bottom: 0 !important; }
html[data-buld-theme] body #panel-all-orders .yaya-scope #allOrdersBody .table-row.os-row:hover {
    background: rgba(255, 255, 255, .035) !important;
}
html[data-buld-theme] body #panel-all-orders .yaya-scope #allOrdersBody .table-row.os-row.selected,
html[data-buld-theme] body #panel-all-orders .yaya-scope #allOrdersBody .table-row.os-row.is-selected {
    background: var(--buld-cta-soft) !important;
    box-shadow: inset 3px 0 0 var(--buld-cta) !important;
}
html[data-buld-theme] body #panel-all-orders .table-row.os-row::before,
html[data-buld-theme] body #panel-all-orders .table-row.os-row::after { display: none !important; }
/* s3 — no progress track under the pill */
html[data-buld-theme] body #panel-all-orders .table-row.os-row .status-dropdown-wrap::after { display: none !important; }

/* ── 4. cells ──────────────────────────────────────────────────────────────── */
html[data-buld-theme] #panel-all-orders .os-row .order-id { font-weight: 700; font-variant-numeric: tabular-nums; color: var(--buld-ink-1); }
html[data-buld-theme] #panel-all-orders .os-row .ord-date { display: block; font-size: 11.5px; color: var(--buld-ink-4); margin-top: 2px; }
html[data-buld-theme] #panel-all-orders .os-row .customer-name { font-weight: 600; color: var(--buld-ink-1); }
html[data-buld-theme] #panel-all-orders .os-row .customer-meta,
html[data-buld-theme] #panel-all-orders .os-row .product-sku,
html[data-buld-theme] #panel-all-orders .os-row .os-sub { font-size: 12px; color: var(--buld-ink-3); }
html[data-buld-theme] #panel-all-orders .os-row .os-wilaya { display: flex; flex-direction: column; min-width: 0; }
html[data-buld-theme] #panel-all-orders .os-row .os-strong { font-weight: 600; color: var(--buld-ink-1); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
html[data-buld-theme] #panel-all-orders .os-row .product-name { font-weight: 600; }
html[data-buld-theme] #panel-all-orders .os-row .os-total .price { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--buld-ink-1); }
html[data-buld-theme] #panel-all-orders .os-row .os-total small { font-size: 11px; color: var(--buld-ink-3); font-weight: 600; }
html[data-buld-theme] body #panel-all-orders .os-row .phone-chip {
    background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0 !important;
    color: var(--buld-ink-2); font-variant-numeric: tabular-nums; cursor: copy;
}
html[data-buld-theme] body #panel-all-orders .os-row .phone-chip:hover { color: var(--buld-ink-1); }
html[data-buld-theme] #panel-all-orders .os-row .os-peek { cursor: help; }
html[data-buld-theme] #panel-all-orders .os-row .op-pill { height: 28px; border-radius: 999px; padding: 0 11px; }
html[data-buld-theme] #panel-all-orders .os-row .op-pill svg { opacity: .7; }

/* ── 5. actions: contextual text action + one grouped bar ─────────────────── */
html[data-buld-theme] #panel-all-orders .os-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
html[data-buld-theme] body #panel-all-orders .os-ctx {
    display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 11px;
    border-radius: 8px; font-size: 12px; font-weight: 650; white-space: nowrap; cursor: pointer;
    border: 1px solid; background: transparent; width: auto !important;
    transition: background-color .15s ease;
}
html[data-buld-theme] #panel-all-orders .os-ctx svg { width: 14px; height: 14px; }
html[data-buld-theme] body #panel-all-orders .os-ctx--ok    { color: #5FE3AE !important; border-color: rgba(61, 213, 152, .35) !important; background: rgba(61, 213, 152, .10) !important; }
html[data-buld-theme] body #panel-all-orders .os-ctx--ok:hover    { background: rgba(61, 213, 152, .18) !important; }
html[data-buld-theme] body #panel-all-orders .os-ctx--ship  { color: #7DB9FF !important; border-color: rgba(76, 157, 255, .35) !important; background: rgba(76, 157, 255, .10) !important; }
html[data-buld-theme] body #panel-all-orders .os-ctx--ship:hover  { background: rgba(76, 157, 255, .18) !important; }
html[data-buld-theme] body #panel-all-orders .os-ctx--track { color: var(--buld-ink-2) !important; border-color: var(--buld-divider) !important; background: transparent !important; }
html[data-buld-theme] body #panel-all-orders .os-ctx--track:hover { background: rgba(255, 255, 255, .05) !important; }

html[data-buld-theme] #panel-all-orders .os-group {
    display: inline-flex; align-items: stretch;
    border: 1px solid rgba(255, 255, 255, .10); border-radius: 9px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .015)), var(--buld-surface-2);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05), 0 1px 2px rgba(0, 0, 0, .3);
}
html[data-buld-theme] body #panel-all-orders .os-ia {
    position: relative; width: 32px !important; height: 30px !important; display: grid; place-items: center;
    border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important;
    color: var(--buld-ink-3) !important; text-decoration: none; cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}
html[data-buld-theme] body #panel-all-orders .os-ia + .os-ia { box-shadow: inset 1px 0 0 rgba(255, 255, 255, .07) !important; }
html[data-buld-theme] body #panel-all-orders .os-ia:first-child { border-radius: 8px 0 0 8px !important; }
html[data-buld-theme] body #panel-all-orders .os-ia:last-child { border-radius: 0 8px 8px 0 !important; }
html[data-buld-theme] body #panel-all-orders .os-ia:hover { color: var(--buld-ink-1) !important; background: rgba(255, 255, 255, .06) !important; }
html[data-buld-theme] body #panel-all-orders .os-ia--call:hover { color: #3DD598 !important; }
html[data-buld-theme] body #panel-all-orders .os-ia--wa:hover { color: #25D366 !important; }
html[data-buld-theme] #panel-all-orders .os-ia svg { width: 16px; height: 16px; stroke-width: 1.75; }

/* ── 6. info card (orders-sheet.js) ────────────────────────────────────────── */
.os-peekpop {
    position: fixed; z-index: 9000; width: 300px; padding: 14px; border-radius: 14px; pointer-events: none;
    background: var(--buld-elevated-2); border: 1px solid var(--buld-divider); color: var(--buld-ink-1);
    box-shadow: 0 22px 44px -16px rgba(0, 0, 0, .75); font-size: 13px; line-height: 1.45;
    animation: osFade .12s ease;
}
@keyframes osFade { from { opacity: 0; transform: translateY(3px); } }
.os-peekpop__h { display: flex; gap: 10px; align-items: center; }
.os-peekpop__h b { display: block; }
.os-peekpop__m { color: var(--buld-ink-3); font-size: 12px; }
.os-peekpop__r { display: flex; justify-content: space-between; gap: 12px; margin-top: 5px; }
.os-peekpop__r span:first-child { color: var(--buld-ink-3); }
.os-peekpop__r span:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.os-peekpop hr { border: 0; border-top: 1px solid var(--buld-hairline); margin: 10px 0; }
.os-peekpop__t { font-weight: 700; }
.os-peekpop__note { margin-top: 8px; font-size: 12px; color: var(--buld-ink-2); }

@media (prefers-reduced-motion: reduce) { .os-peekpop { animation: none; } }

/* ── 7. actions are always visible in the sheet (orders-premium hides .op-qa until hover) ── */
html[data-buld-theme] body #panel-all-orders .os-row .op-qa { opacity: 1 !important; transform: none !important; }
/* the peek popover's inner rows must stay flat */
.os-peekpop div, .os-peekpop span { background: transparent !important; border: 0 !important; box-shadow: none !important; padding: 0; border-radius: 0 !important; }

/* ── 8. source mark before the order number (imported Shopify / Woo orders) ── */
html[data-buld-theme] #panel-all-orders .os-row .ord-id-cell { position: relative; }
html[data-buld-theme] #panel-all-orders .os-row .os-src {
    display: inline-flex; align-items: center; justify-content: center; vertical-align: -3px;
    width: 16px; height: 16px; margin-inline-end: 6px; border-radius: 4px;
    font-size: 8.5px; font-weight: 800; letter-spacing: -.02em; color: var(--buld-ink-2);
    background: var(--buld-surface-2);
}
html[data-buld-theme] #panel-all-orders .os-row img.os-src { background: transparent; object-fit: contain; }