/* IDEA PREMIUM — Admin theme (on top of Bootstrap 5.3). Logical properties: works in RTL and LTR. */
:root {
  --ip-cream: #F8F5EF;
  --ip-paper: #FFFFFF;
  --ip-beige: #EDE5D8;
  --ip-line: #E4DCCF;
  --ip-ink: #1F1D1B;
  --ip-ink-2: #4A4540;
  --ip-muted: #7D766D;
  --ip-gold: #A9824B;
  --ip-gold-soft: #F3EADB;
  --ip-ok: #4E7D5B;
  --ip-warn: #C28A3A;
  --ip-off: #A65A4E;
  --ip-radius: 14px;
  --ip-sidebar: 256px;
  --bs-body-bg: var(--ip-cream);
  --bs-body-color: var(--ip-ink);
  --bs-border-color: var(--ip-line);
  --bs-link-color: var(--ip-ink);
  --bs-link-color-rgb: 31, 29, 27;
  --bs-link-hover-color: var(--ip-gold);
  --bs-focus-ring-color: rgba(169, 130, 75, .35);
}
html[lang="ar"] body { font-family: "Segoe UI", "Noto Sans Arabic", Tahoma, "Geeza Pro", system-ui, sans-serif; }
html[lang="en"] body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; }
body.ip-admin { background: var(--ip-cream); color: var(--ip-ink); -webkit-font-smoothing: antialiased; }

/* Layout ----------------------------------------------------------------- */
.ip-sidebar { background: var(--ip-ink) !important; color: #EDE7DD; width: var(--ip-sidebar); }
@media (min-width: 992px) {
  .ip-sidebar { position: fixed; inset-block: 0; inset-inline-start: 0; display: flex; flex-direction: column; }
  .ip-main { margin-inline-start: var(--ip-sidebar); }
}
.ip-sidebar.offcanvas-lg { --bs-offcanvas-bg: var(--ip-ink); --bs-offcanvas-color: #EDE7DD; --bs-offcanvas-width: 280px; }
.ip-sidebar .btn-close { filter: invert(1); }
.ip-sidebar-head { display: flex; align-items: center; justify-content: space-between; padding: 22px 22px 14px; }
.ip-brand, .ip-auth-brand { font-weight: 600; letter-spacing: .18em; font-size: 1.05rem; color: #fff; text-decoration: none; direction: ltr; unicode-bidi: isolate; }
.ip-brand span, .ip-auth-brand span { color: var(--ip-gold); font-weight: 400; }
.ip-brand:hover { color: #fff; }
.ip-nav { padding: 8px 12px; flex: 1; overflow-y: auto; }
.ip-nav-section { font-size: .72rem; text-transform: uppercase; letter-spacing: .12em; color: #9C948A; padding: 18px 12px 6px; }
.ip-nav-link { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 10px; color: #E3DCD1; text-decoration: none; font-size: .95rem; min-height: 44px; }
.ip-nav-link svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; flex: none; opacity: .85; }
.ip-nav-link:hover { background: rgba(255,255,255,.06); color: #fff; }
.ip-nav-link.active { background: rgba(169,130,75,.18); color: #fff; box-shadow: inset 3px 0 0 var(--ip-gold); }
[dir="rtl"] .ip-nav-link.active { box-shadow: inset -3px 0 0 var(--ip-gold); }
.ip-sidebar-foot { padding: 14px 22px 22px; display: flex; gap: 6px; flex-wrap: wrap; }

.ip-topbar { position: sticky; top: 0; z-index: 1020; display: flex; align-items: center; gap: 12px; padding: 10px 16px; background: rgba(248,245,239,.92); backdrop-filter: blur(8px); border-bottom: 1px solid var(--ip-line); min-height: 60px; }
.ip-topbar-title { font-weight: 600; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ip-topbar-actions { display: flex; align-items: center; gap: 8px; }
.ip-icon-btn { width: 44px; height: 44px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; }
.ip-icon-btn svg { width: 22px; height: 22px; fill: none; stroke: var(--ip-ink); stroke-width: 1.8; stroke-linecap: round; }
.ip-avatar { display: inline-flex; width: 28px; height: 28px; border-radius: 50%; background: var(--ip-gold-soft); color: var(--ip-gold); align-items: center; justify-content: center; font-weight: 600; font-size: .85rem; margin-inline-end: 6px; }
.ip-content { padding: 20px 16px 48px; max-width: 1320px; }
@media (min-width: 768px) { .ip-content { padding: 28px 32px 64px; } }
.ip-skip { position: absolute; inset-inline-start: 8px; top: 8px; z-index: 2000; background: #fff; padding: 8px 12px; }

/* Typography & headings --------------------------------------------------- */
.ip-h1 { font-size: 1.5rem; font-weight: 600; margin: 0 0 4px; letter-spacing: -.01em; }
.ip-h2 { font-size: 1.1rem; font-weight: 600; margin: 0 0 12px; }
.ip-h3 { font-size: 1rem; font-weight: 600; margin: 0 0 14px; }
.ip-muted { color: var(--ip-muted) !important; }
.ip-page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.ip-back { display: inline-block; font-size: .85rem; color: var(--ip-muted); text-decoration: none; margin-bottom: 6px; }
[dir="rtl"] .ip-back { transform: none; }

/* Cards, lists, badges --------------------------------------------------- */
.ip-card { background: var(--ip-paper); border: 1px solid var(--ip-line); border-radius: var(--ip-radius); padding: 20px; box-shadow: 0 1px 2px rgba(31,29,27,.03); }
.ip-card-link { color: inherit; text-decoration: none; transition: border-color .2s, box-shadow .2s, transform .2s; }
.ip-card-link:hover { border-color: var(--ip-gold); box-shadow: 0 6px 18px rgba(31,29,27,.06); color: inherit; transform: translateY(-1px); }
.ip-card-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; flex-wrap: wrap; }
.ip-narrow { max-width: 640px; }
.ip-dl { display: grid; grid-template-columns: minmax(120px, 40%) 1fr; gap: 10px 16px; margin: 0; }
.ip-dl dt { font-weight: 400; color: var(--ip-muted); }
.ip-dl dd { margin: 0; }
.ip-list { list-style: none; margin: 0; padding: 0; }
.ip-list li + li { border-top: 1px solid var(--ip-line); }
.ip-list a { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 12px 18px; text-decoration: none; color: inherit; }
.ip-list a:hover { background: var(--ip-cream); }
.ip-market-chip { display: inline-block; font-size: .72rem; font-weight: 600; letter-spacing: .06em; padding: 2px 8px; border-radius: 999px; background: var(--ip-beige); color: var(--ip-ink-2); vertical-align: middle; direction: ltr; }
.ip-sidebar .ip-market-chip { background: rgba(255,255,255,.08); color: #E3DCD1; }
.ip-market-eg { background: #EFE6D6; }
.ip-market-ae { background: #E2E8E4; }
.ip-badge-gold { display: inline-block; padding: 2px 10px; border-radius: 999px; background: var(--ip-gold-soft); color: #7A5A2C; font-size: .8rem; font-weight: 600; }
.ip-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-inline-end: 7px; vertical-align: middle; }
.ip-dot-ok { background: var(--ip-ok); }
.ip-dot-warn { background: var(--ip-warn); }
.ip-dot-off { background: var(--ip-off); }
.ip-alert { border-radius: 12px; border: 0; }
.ip-error-code { font-size: 3rem; font-weight: 300; color: var(--ip-gold); margin: 12px 0 0; }

/* Buttons ----------------------------------------------------------------- */
.btn { border-radius: 10px; min-height: 40px; }
.btn-sm { min-height: 34px; }
.ip-btn-primary { --bs-btn-bg: var(--ip-ink); --bs-btn-color: #fff; --bs-btn-border-color: var(--ip-ink); --bs-btn-hover-bg: #34302C; --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: #34302C; --bs-btn-active-bg: #000; --bs-btn-active-color: #fff; padding-inline: 20px; }
.ip-btn-secondary { --bs-btn-bg: var(--ip-gold-soft); --bs-btn-color: #5E4523; --bs-btn-border-color: transparent; --bs-btn-hover-bg: #EADCC4; --bs-btn-hover-color: #5E4523; }
.ip-btn-ghost { --bs-btn-bg: transparent; --bs-btn-color: var(--ip-ink); --bs-btn-border-color: var(--ip-line); --bs-btn-hover-bg: var(--ip-paper); --bs-btn-hover-border-color: var(--ip-gold); --bs-btn-hover-color: var(--ip-ink); }
.ip-link { color: var(--ip-muted); }

/* Forms ------------------------------------------------------------------- */
.form-control, .form-select { border-radius: 10px; border-color: var(--ip-line); min-height: 44px; background-color: #fff; }
.form-switch { padding-inline-start: 3.1em; }
.form-switch .form-check-input { margin-inline-start: -3.1em; }
.form-control-sm, .form-select-sm { min-height: 34px; }
.form-control:focus, .form-select:focus { border-color: var(--ip-gold); box-shadow: 0 0 0 .2rem rgba(169,130,75,.18); }
.form-check-input:checked { background-color: var(--ip-ink); border-color: var(--ip-ink); }
.form-switch .form-check-input { width: 2.4em; height: 1.3em; }
.form-label { font-weight: 500; font-size: .92rem; }
.ip-form-actions { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 20px; position: sticky; bottom: 0; padding: 12px 0; background: linear-gradient(to top, var(--ip-cream) 70%, rgba(248,245,239,0)); }
.ip-check-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.ip-check { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--ip-line); border-radius: 10px; cursor: pointer; background: var(--ip-paper); min-height: 44px; }
.ip-check:hover { border-color: var(--ip-gold); }
.ip-check .form-check-input { margin: 3px 0 0; flex: none; }
.ip-perm-group { border: 0; margin: 0 0 18px; padding: 0; }
.ip-perm-group-title { font-size: .85rem; font-weight: 600; color: var(--ip-ink-2); margin-bottom: 8px; float: none; width: auto; }
.ip-perm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--ip-line); }
.ip-perm-row label { font-size: .9rem; }
.ip-perm-row select { max-width: 150px; flex: none; }
.ip-details summary { cursor: pointer; font-weight: 500; padding: 8px 0; }
.ip-filters { margin-bottom: 16px; padding: 14px 16px; }
.ip-filter { display: flex; gap: 8px; }
.ip-toolbar { display: flex; flex-wrap: wrap; gap: 12px; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.ip-tabs { display: flex; gap: 4px; flex-wrap: wrap; }
.ip-tab { padding: 7px 14px; border-radius: 999px; text-decoration: none; color: var(--ip-ink-2); font-size: .9rem; border: 1px solid transparent; }
.ip-tab.active { background: var(--ip-paper); border-color: var(--ip-line); color: var(--ip-ink); font-weight: 600; }
.ip-search { display: flex; gap: 6px; min-width: 0; flex: 1 1 260px; max-width: 380px; }

/* Tables — turn into stacked cards on small screens ------------------------ */
.ip-table-wrap { width: 100%; }
.ip-table { --bs-table-bg: transparent; margin: 0; }
.ip-table th { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ip-muted); font-weight: 600; border-bottom-width: 1px; padding: 12px 16px; white-space: nowrap; }
.ip-table td { padding: 12px 16px; vertical-align: middle; border-color: var(--ip-line); }
html[lang="ar"] .ip-table th { text-transform: none; letter-spacing: 0; font-size: .85rem; }
@media (max-width: 767.98px) {
  .ip-table-stack thead { display: none; }
  .ip-table-stack, .ip-table-stack tbody, .ip-table-stack tr, .ip-table-stack td { display: block; width: 100%; }
  .ip-table-stack tr { padding: 12px 16px; border-bottom: 1px solid var(--ip-line); }
  .ip-table-stack td { border: 0; padding: 4px 0; text-align: start !important; }
  .ip-table-stack td[data-label]::before { content: attr(data-label); display: block; font-size: .75rem; color: var(--ip-muted); }
  .ip-table-stack td.text-end .btn { width: 100%; margin-top: 6px; }
}
.ip-table-wrap { position: relative; } /* keeps visually-hidden labels inside the scroll area (Phase 8) */
@media (min-width: 768px) { .ip-table-wrap { overflow-x: auto; } }
.ip-pagination { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 14px; }

/* Auth / installer ---------------------------------------------------------- */
.ip-auth { min-height: 100vh; background: radial-gradient(circle at 20% 10%, #FFFFFF 0, var(--ip-cream) 45%, var(--ip-beige) 100%); }
.ip-auth-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px 16px; }
.ip-auth-card { width: 100%; max-width: 420px; background: var(--ip-paper); border: 1px solid var(--ip-line); border-radius: 20px; padding: 36px 28px; box-shadow: 0 20px 60px rgba(31,29,27,.08); }
.ip-auth .ip-auth-brand, .ip-install .ip-auth-brand { color: var(--ip-ink); text-align: center; font-size: 1.3rem; }
.ip-auth-sub { text-align: center; color: var(--ip-muted); margin: 6px 0 24px; }
.ip-install { background: var(--ip-cream); }
.ip-install-wrap { max-width: 880px; margin: 0 auto; padding: 24px 16px 64px; }
.ip-install-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
.ip-install .ip-auth-brand { text-align: start; }
.ip-steps li { margin-bottom: 10px; }
.ip-code { background: var(--ip-ink); color: #F3EADB; padding: 14px 16px; border-radius: 10px; font-size: .85rem; white-space: pre-wrap; word-break: break-all; margin-top: 8px; text-align: left; }

@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; } }

/* ---------------------------------------------------------------- Phase 3: catalog */
.ip-subtabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--ip-line); margin-bottom: 20px; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.ip-subtab { padding: 10px 14px; white-space: nowrap; text-decoration: none; color: var(--ip-ink-2); border-bottom: 2px solid transparent; margin-bottom: -1px; font-size: .93rem; min-height: 44px; display: inline-flex; align-items: center; }
.ip-subtab:hover { color: var(--ip-ink); }
.ip-subtab.active { color: var(--ip-ink); border-bottom-color: var(--ip-gold); font-weight: 600; }
.ip-pill { display: inline-block; padding: 2px 9px; border-radius: 999px; font-size: .76rem; font-weight: 600; line-height: 1.6; vertical-align: middle; }
.ip-pill-ok { background: #E3EFE6; color: #2F5D3B; }
.ip-pill-warn { background: #F7EBD7; color: #845A1B; }
.ip-pill-off { background: #F4E1DD; color: #8A3B30; }
.ip-pill-muted { background: #ECE9E4; color: #5F5A54; }
.ip-pill-gold { background: var(--ip-gold-soft); color: #7A5A2C; }
.ip-badges { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; align-items: center; }
.ip-thumb { display: inline-block; border-radius: 10px; overflow: hidden; background: var(--ip-beige); flex: none; border: 1px solid var(--ip-line); }
.ip-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ip-thumb-sm { width: 52px; height: 52px; }
.ip-thumb-lg { width: 100%; aspect-ratio: 1 / 1; max-width: 220px; }
.ip-item { display: flex; gap: 12px; align-items: flex-start; }
.ip-item-title { font-weight: 600; text-decoration: none; }
.ip-price { font-weight: 600; }
.ip-actions { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.ip-actions form { margin: 0; }
.ip-w-num { width: 5.5rem; min-width: 4.5rem; max-width: 110px; flex: 0 0 auto; }
.ip-row-warn td { background: #FBF4E8; }
.ip-stock-num { font-size: 1.15rem; font-variant-numeric: tabular-nums; margin-inline-end: 6px; }
.ip-stockbox { background: var(--ip-cream); border-radius: 12px; padding: 12px 14px; }
.ip-subcard { border: 1px solid var(--ip-line); border-radius: 12px; padding: 14px; margin-bottom: 12px; background: #FDFCFA; }
.ip-seg { display: inline-flex; flex-wrap: wrap; border: 1px solid var(--ip-line); border-radius: 12px; padding: 3px; background: #fff; gap: 2px; }
.ip-seg-item { position: relative; margin: 0; }
.ip-seg-item input { position: absolute; opacity: 0; inset: 0; }
.ip-seg-item span { display: inline-flex; align-items: center; min-height: 38px; padding: 0 14px; border-radius: 9px; cursor: pointer; font-size: .92rem; }
.ip-seg-item input:checked + span { background: var(--ip-ink); color: #fff; }
.ip-seg-item input:focus-visible + span { outline: 2px solid var(--ip-gold); }
.ip-preview-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 14px; }
.ip-preview-grid > div { background: var(--ip-cream); border-radius: 12px; padding: 12px; text-align: center; }
.ip-preview-grid span { display: block; }
.ip-preview-grid strong { font-size: 1.5rem; font-variant-numeric: tabular-nums; }
.ip-gallery { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 14px; }
.ip-gallery-item { border: 1px solid var(--ip-line); border-radius: 12px; padding: 10px; background: #fff; }
.ip-gallery-item .ip-thumb-lg { max-width: none; }
.ip-gallery-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: 8px 0; }
.ip-gallery-actions { display: flex; flex-wrap: wrap; gap: 4px; }
.ip-drop { display: flex; flex-direction: column; gap: 6px; align-items: center; justify-content: center; text-align: center; border: 1.5px dashed var(--ip-gold); border-radius: 14px; padding: 22px 14px; background: #FDFAF5; cursor: pointer; }
.ip-drop input { max-width: 100%; }
.ip-empty { display: flex; flex-direction: column; gap: 12px; align-items: center; text-align: center; padding: 14px 0; }
.ip-empty .ip-thumb-lg { width: 160px; }
.ip-sortable { list-style: none; margin: 0; padding: 0; }
.ip-sortable-item { display: flex; align-items: center; gap: 12px; padding: 10px 16px; border-bottom: 1px solid var(--ip-line); background: #fff; cursor: grab; }
.ip-sortable-item.is-dragging { opacity: .5; background: var(--ip-gold-soft); }
.ip-sortable-label { flex: 1; min-width: 0; }
.ip-sortable-btns { display: inline-flex; gap: 4px; }
.ip-sortable-btns .btn { min-width: 40px; }
.ip-handle { color: var(--ip-muted); letter-spacing: -2px; user-select: none; }
.ip-code-chip { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-weight: 600; background: var(--ip-cream); border: 1px dashed var(--ip-gold); padding: 3px 10px; border-radius: 8px; text-decoration: none; }
.ip-scroll-x { overflow-x: auto; }
fieldset[disabled] .form-control, fieldset[disabled] .form-select { background-color: #F6F4F0; }
@media (max-width: 767.98px) {
  .ip-actions { width: 100%; justify-content: stretch; }
  .ip-actions > * { flex: 1 1 auto; }
  .ip-actions .btn { width: 100%; }
  .ip-sortable-item { padding: 10px 12px; }
  .ip-preview-grid strong { font-size: 1.2rem; }
}

/* ---------------------------------------------------------------- Phase 5: orders */
.ip-bell { position: relative; width: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
.ip-bell svg { width: 20px; height: 20px; fill: none; stroke: var(--ip-ink); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ip-bell-count { position: absolute; top: -5px; inset-inline-end: -5px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 999px; background: var(--ip-off); color: #fff; font-size: .7rem; font-weight: 700; line-height: 19px; text-align: center; }
.ip-status { display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px 2px 8px; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #F1EEE9; color: var(--ip-ink); white-space: nowrap; }
.ip-status::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--ip-st, var(--ip-muted)); flex: none; }
.ip-status-lg { font-size: .95rem; padding: 5px 14px 5px 11px; }
.ip-order-filters { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; align-items: end; }
.ip-order-filters .ip-f-q { grid-column: 1 / -1; }
@media (min-width: 992px) { .ip-order-filters .ip-f-q { grid-column: span 2; } }
.ip-order-filters label { font-size: .78rem; color: var(--ip-muted); margin-bottom: 3px; display: block; }
.ip-filter-actions { display: flex; gap: 6px; flex-wrap: wrap; }
.ip-bulkbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 12px 16px; border-bottom: 1px solid var(--ip-line); background: #FDFBF7; border-radius: var(--ip-radius) var(--ip-radius) 0 0; }
.ip-bulkbar .form-select { max-width: 300px; flex: 1 1 200px; }
.ip-bulkbar .form-check { margin: 0; }
.ip-col-check { width: 44px; }
.ip-col-check .form-check-input { width: 1.2em; height: 1.2em; }
.ip-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ip-ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }
.ip-order-no { font-weight: 600; text-decoration: none; direction: ltr; unicode-bidi: isolate; }
.ip-order-grid { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 992px) { .ip-order-grid { grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); align-items: start; } }
.ip-stack { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.ip-trans { display: flex; flex-direction: column; gap: 10px; }
.ip-trans-item { border: 1px solid var(--ip-line); border-radius: 12px; padding: 12px; background: #FDFCFA; }
.ip-trans-item .btn { width: 100%; }
.ip-trans-hint { font-size: .82rem; color: var(--ip-muted); margin: 6px 0 8px; }
.ip-signals { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.ip-signals li { display: flex; gap: 8px; align-items: center; font-size: .92rem; }
.ip-timeline { list-style: none; margin: 0; padding: 0; }
.ip-timeline li { position: relative; padding: 0 0 14px; padding-inline-start: 20px; border-inline-start: 2px solid var(--ip-line); margin-inline-start: 5px; }
.ip-timeline li:last-child { padding-bottom: 0; }
.ip-timeline li::before { content: ""; position: absolute; top: 4px; inset-inline-start: -7px; width: 12px; height: 12px; border-radius: 50%; background: var(--ip-paper); border: 2px solid var(--ip-gold); }
.ip-timeline .ip-tl-title { font-weight: 500; }
.ip-timeline .ip-tl-meta { font-size: .8rem; color: var(--ip-muted); }
.ip-diff { font-size: .82rem; margin-top: 4px; background: var(--ip-cream); border-radius: 8px; padding: 6px 10px; word-break: break-word; }
.ip-diff del { color: var(--ip-off); }
.ip-diff ins { color: var(--ip-ok); text-decoration: none; }
.ip-totals { display: grid; grid-template-columns: 1fr auto; gap: 6px 0; margin: 0; }
.ip-totals dt { padding-inline-end: 16px; }
.ip-totals dt { font-weight: 400; color: var(--ip-ink-2); }
.ip-totals dd { margin: 0; text-align: end; font-variant-numeric: tabular-nums; }
.ip-totals .ip-grand { font-weight: 700; font-size: 1.08rem; border-top: 1px solid var(--ip-ink); padding-top: 8px; }
.ip-internal { border: 1px dashed var(--ip-gold); background: #FDF8EF; }
.ip-comp { list-style: none; padding: 0; margin: 4px 0 0; font-size: .82rem; color: var(--ip-muted); }
.ip-line-row { display: grid; grid-template-columns: minmax(0, 1fr) 90px; gap: 8px; margin-bottom: 8px; }
.ip-stat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 10px; }
.ip-stat { background: var(--ip-paper); border: 1px solid var(--ip-line); border-radius: 12px; padding: 12px 14px; text-decoration: none; color: inherit; display: block; }
.ip-stat span { display: block; font-size: .8rem; color: var(--ip-muted); }
.ip-stat strong { font-size: 1.35rem; font-variant-numeric: tabular-nums; }
a.ip-stat:hover { border-color: var(--ip-gold); color: inherit; }
.ip-note { border-bottom: 1px solid var(--ip-line); padding: 12px 0; }
.ip-note:last-child { border-bottom: 0; }
.ip-note-meta { font-size: .8rem; color: var(--ip-muted); margin-bottom: 4px; }
.ip-note-body { white-space: pre-wrap; word-break: break-word; }
.ip-notif-unread { background: #FDF8EF; }
.ip-notif-unread .ip-item-title::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--ip-gold); margin-inline-end: 8px; vertical-align: middle; }
.ip-err { font-size: .8rem; color: var(--ip-off); word-break: break-word; }
.ip-break { word-break: break-word; overflow-wrap: anywhere; }
.ip-return-row .form-control { max-width: 110px; }
@media (max-width: 767.98px) {
  .ip-bulkbar .form-select, .ip-bulkbar .btn { max-width: none; width: 100%; flex: 1 1 100%; }
  .ip-table-stack td.ip-col-check { display: flex; gap: 8px; align-items: center; }
  .ip-table-stack td.ip-col-check::before { display: none; }
  .ip-line-row { grid-template-columns: minmax(0, 1fr) 76px; }
  .ip-return-row .form-control { max-width: none; }
}
/* The off-canvas sidebar (hidden below 992px) sits just outside the viewport; never let it widen the page. */
html:has(body.ip-admin), body.ip-admin { overflow-x: clip; }

/* ---------------------------------------------------------------- Phase 6: CMS */
.ip-media-current { display: flex; gap: 12px; align-items: center; min-height: 72px; }
.ip-media-current img { width: 96px; height: 96px; object-fit: cover; border-radius: 10px; border: 1px solid var(--ip-line); background: var(--ip-beige); flex: none; }
.ip-media-empty { width: 96px; height: 72px; border-radius: 10px; border: 1.5px dashed var(--ip-line); background: var(--ip-cream); flex: none; }
.ip-library summary { color: var(--ip-ink-2); }
.ip-library-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 6px; max-height: 260px; overflow-y: auto; padding: 6px; border: 1px solid var(--ip-line); border-radius: 10px; background: #fff; }
.ip-library-item { position: relative; display: flex; align-items: center; justify-content: center; min-height: 76px; border-radius: 8px; border: 2px solid transparent; cursor: pointer; overflow: hidden; background: var(--ip-cream); text-align: center; }
.ip-library-item input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.ip-library-item img { width: 72px; height: 72px; object-fit: cover; }
.ip-library-item:has(input:checked) { border-color: var(--ip-gold); }
.ip-library-item:has(input:focus-visible) { outline: 2px solid var(--ip-gold); }
.ip-pos { width: 4.2rem; flex: none; text-align: center; }
.ip-section-row { flex-wrap: wrap; cursor: default; }
.ip-section-row[draggable="true"] { cursor: grab; }
.ip-section-row .ip-actions { margin-inline-start: auto; }
.ip-review-list { display: flex; flex-direction: column; gap: 12px; }
.ip-stars { color: var(--ip-gold); letter-spacing: 1px; margin-inline-end: 6px; }
.ip-review-text { white-space: pre-wrap; word-break: break-word; margin-bottom: 8px; }
.ip-media-preview { width: 100%; height: auto; border-radius: 10px; background: var(--ip-beige); }
.ip-rich { border: 1px solid var(--ip-line); border-radius: 10px; background: #fff; overflow: hidden; }
.ip-rich-bar { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px; border-bottom: 1px solid var(--ip-line); background: var(--ip-cream); }
.ip-rich-bar .btn { min-height: 32px; padding: 2px 10px; }
.ip-rich-area { min-height: 220px; max-height: 60vh; overflow-y: auto; padding: 12px 14px; outline: none; }
.ip-rich-area:focus { box-shadow: inset 0 0 0 2px rgba(169,130,75,.25); }
.ip-rich textarea { border: 0; border-radius: 0; min-height: 220px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .85rem; }
.prose-admin h2 { font-size: 1.2rem; margin: .8em 0 .4em; }
.prose-admin h3 { font-size: 1.05rem; margin: .8em 0 .4em; }
.prose-admin p { margin: 0 0 .7em; }
.prose-admin ul, .prose-admin ol { padding-inline-start: 1.4em; }
@media (max-width: 767.98px) {
  .ip-section-row .ip-actions { margin-inline-start: 0; width: 100%; }
  .ip-media-current { align-items: flex-start; }
}

/* ======================================================================= Phase 7: reports */
.ip-tabs-scroll { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; padding-bottom: 2px; }
.ip-tabs-scroll .ip-tab { white-space: nowrap; }
.ip-report-filters { padding: 14px 16px; }
.ip-report-filter-row { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: flex-end; }
.ip-report-filter-row > div { min-width: 140px; flex: 0 1 180px; }
.ip-report-filter-row .ip-report-filter-actions { display: flex; flex-wrap: wrap; gap: 6px; flex: 1 1 auto; min-width: 0; }
.ip-report-filters.ip-js [data-custom-dates][hidden] { display: none; }
.ip-report-kpis { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.ip-stat small { display: block; font-size: .75rem; line-height: 1.35; margin-top: 4px; }
.ip-stat-hero { background: var(--ip-gold-soft); border-color: #E6D6BC; }
.ip-margin { border-top: 1px dashed var(--ip-line); padding-top: 12px; }
.ip-margin-dl { max-width: 520px; grid-template-columns: 1fr auto; }
.ip-margin-dl dd { text-align: end; }
.ip-chart-wrap { margin: 0 0 8px; }
.ip-chart-scroll { overflow-x: auto; }
.ip-chart { display: block; width: 100%; max-width: 760px; min-width: 460px; height: auto; font-family: inherit; }
.ip-chart-grid { stroke: #ECE6DC; stroke-width: 1; }
.ip-chart-axis { fill: var(--ip-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.ip-chart-bar { fill: #2a78d6; }
.ip-chart-line { fill: none; stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.ip-chart-dot { stroke: var(--ip-paper); stroke-width: 1.5; }
.ip-chart-s1 { stroke: #2a78d6; } circle.ip-chart-s1 { fill: #2a78d6; }
.ip-chart-s2 { stroke: #eb6834; stroke-dasharray: 6 4; } circle.ip-chart-s2 { fill: #eb6834; stroke-dasharray: none; }
.ip-chart-s3 { stroke: #1baf7a; stroke-dasharray: 2 3; } circle.ip-chart-s3 { fill: #1baf7a; stroke-dasharray: none; }
.ip-chart-hit { fill: transparent; }
.ip-chart-hit:hover { fill: rgba(31, 29, 27, .05); }
.ip-chart-legend { display: flex; flex-wrap: wrap; gap: 6px 16px; list-style: none; padding: 0; margin: 6px 0 0; font-size: .82rem; color: var(--ip-ink-2); }
.ip-chart-legend li { display: inline-flex; align-items: center; gap: 6px; }
.ip-chart-legend svg { width: 24px; height: 8px; }
.ip-funnel { list-style: none; padding: 0; margin: 0 0 12px; display: grid; gap: 12px; }
.ip-funnel-label { display: flex; justify-content: space-between; gap: 12px; font-size: .9rem; }
.ip-funnel progress { width: 100%; height: 12px; appearance: none; border: 0; border-radius: 6px; overflow: hidden; background: #EFE9DF; }
.ip-funnel progress::-webkit-progress-bar { background: #EFE9DF; border-radius: 6px; }
.ip-funnel progress::-webkit-progress-value { background: #2a78d6; border-radius: 6px; }
.ip-funnel progress::-moz-progress-bar { background: #2a78d6; border-radius: 6px; }
.ip-funnel-rates { max-width: 420px; grid-template-columns: 1fr auto; }
.ip-funnel-rates dd { text-align: end; }
.ip-tracking-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.ip-code-list { font-size: .8rem; margin: 6px 0 0; padding-inline-start: 1.1em; }
.ip-code-list code { word-break: break-all; }
.ip-seo-flags { display: flex; flex-wrap: wrap; gap: 4px; }
@media (max-width: 575.98px) {
  .ip-report-filter-row > div { flex: 1 1 140px; }
  .ip-report-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ip-stat strong { font-size: 1.1rem; word-break: break-word; }
}
.ip-banner-thumb { width: 64px; height: 40px; object-fit: cover; border-radius: 6px; border: 1px solid var(--ip-line); display: block; } /* 1.1.0 banners list */
