/* Promotion Center: navigation on the left, content and actions on the right. */
.app-shell:has(.promotion-center) { grid-template-columns:236px minmax(0,1fr); }
.app-shell:has(.promotion-center) .content { padding-top:24px; }
.promotion-center { display:grid; gap:20px; min-width:0; }
.promotion-center [hidden] { display:none !important; }
.promo-nav-parent { display:flex; align-items:center; justify-content:space-between; width:100%; }
.nav .promo-nav-parent.expanded { color:#253858; font-weight:700; background:transparent; }
.promo-subnav { display:grid; gap:3px; margin:2px 0 10px 16px; padding-left:10px; border-left:1px solid #e3e8ef; }
.promo-subnav a { display:block; text-decoration:none; color:#667085; font-size:13px; line-height:1.5; padding:9px 12px; border-radius:7px; }
.promo-subnav a:hover { background:#f4f6fa; color:#253858; }
.promo-subnav a.active { color:#2455d8; font-weight:650; background:#edf2ff; }
.promo-test-badge { align-self:center; color:#667085; background:#f4f5f7; border:1px solid #e4e7ec; border-radius:20px; font-size:11px; padding:4px 9px; white-space:nowrap; }
.promo-toolbar,.promo-filters { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.promo-filters { padding:0; gap:8px; }
.promo-filters input,.promo-filters select { height:38px; padding:8px 10px; border:1px solid #dce2e9; border-radius:8px; background:#fff; max-width:185px; min-width:0; font-size:13px; }
.promo-search { position:relative; flex:1 1 220px; max-width:380px; }
.promo-search > span { position:absolute; left:12px; top:6px; color:#98a2b3; font-size:22px; }
.promo-search input { width:100%; max-width:none; padding-left:36px; }
.promo-sr-only { position:absolute !important; width:1px !important; height:1px !important; overflow:hidden !important; clip-path:inset(50%); padding:0 !important; }
.promo-text-button { background:transparent !important; box-shadow:none !important; border-color:transparent !important; color:#667085 !important; padding:6px 8px !important; }
.promo-results-meta,.promo-management-bar,.promo-section-heading,.promo-editor-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.promo-results-meta { font-size:12px; color:#667085; }
.promo-management-bar > span { color:#667085; font-size:13px; }
.promotion-center a.primary { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; border-radius:8px; padding:9px 14px; background:#2f62ff; color:white; font-weight:600; font-size:13px; }
.promo-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(245px,100%),1fr)); gap:18px; align-items:start; }
.promo-card { border:1px solid #e4e8ef; background:#fff; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:box-shadow .15s,border-color .15s; }
.promo-card:hover { border-color:#cbd7f0; box-shadow:0 5px 20px #1e3a5f0a; }
.promo-card > img,.promo-cover { width:100%; height:156px; object-fit:contain; background:#f0f3fa; border-bottom:1px solid #e9edf4; }
.promo-cover { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; color:#667b9c; font-size:12px; }
.promo-cover > span { font-size:32px; opacity:.65; }
.promo-card-body { padding:18px; display:grid; gap:12px; flex:1; }
.promo-card h2 { font-size:16px; line-height:1.5; margin:0; overflow-wrap:anywhere; }
.promo-card p { margin:0; color:#667085; font-size:13px; line-height:1.6; min-height:40px; }
.promo-card-meta,.promo-card-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.promo-featured { color:#736038; background:#fbf5e9; font-size:10px; border-radius:4px; padding:2px 6px; }
.promo-card-footer { padding-top:10px; border-top:1px solid #f0f2f6; font-size:13px; }
.promo-card-link { text-decoration:none; font-weight:600; color:#2455d8; }
.promotion-center small { color:#667085; font-size:12px; line-height:1.5; }
.promo-detail { padding:26px; max-width:1000px; }
.promo-detail h2 { font-size:24px; }
.promo-file-list { display:grid; gap:0; margin-top:16px; }
.promo-file { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:12px; padding:14px 0; border-top:1px solid #e7ebf0; font-size:13px; }
.promo-file small { display:block; margin-top:5px; }
.promo-file strong { overflow-wrap:anywhere; }
.promo-file input[type=file] { max-width:185px; font-size:11px; }
.promo-replace-label { display:flex; gap:8px; align-items:center; color:#667085; }
.promo-editor-layout { display:grid; gap:18px; max-width:1120px; margin:0; }
.promo-editor-panel,.promotion-center > .card { padding:22px; }
.promo-editor-panel h2,.promo-settings h2 { margin:0 0 18px; font-size:16px; }
.promo-section-heading h2 { margin:0; }
.promo-section-heading { margin-bottom:18px; }
.promo-editor { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.promo-editor label { display:grid; gap:7px; align-content:start; font-size:13px; color:#475467; }
.promo-editor input,.promo-editor select,.promo-editor textarea { padding:9px 11px; border:1px solid #dce2e9; border-radius:7px; min-width:0; width:100%; font-size:13px; background:#fff; }
.promo-editor .span-2 { grid-column:1/-1; }
.promo-editor textarea { resize:vertical; min-height:70px; }
.promo-editor textarea[name=body] { min-height:190px; }
.promo-editor input[type=checkbox] { width:16px; height:16px; }
.promo-editor .promo-check { display:flex; align-items:center; gap:9px; }
.promo-options > summary { cursor:pointer; display:flex; gap:14px; font-size:14px; font-weight:600; }
.promo-options[open] > summary { margin-bottom:22px; }
.promo-upload-zone { border:1px dashed #cbd5e6; border-radius:9px; padding:18px; background:#f9faff; font-size:13px; }
.promo-upload-zone p { color:#667085; font-size:12px; margin:8px 0 14px; }
.promo-publish-bar { position:sticky; bottom:12px; z-index:5; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding:16px 20px; border:1px solid #dce3f0; border-radius:10px; background:#fff; box-shadow:0 5px 24px #2538580f; font-size:13px; }
.promo-publish-bar small { display:block; margin-top:4px; }
.promo-publish-bar button.primary { color:#475467; background:#fff; border:1px solid #dce2e9; box-shadow:none; }
.promo-publish-button { background:#2f62ff; color:#fff; border:1px solid #2f62ff; border-radius:8px; padding:9px 13px; font-size:13px; font-weight:600; }
.promo-status { display:inline-flex; align-items:center; white-space:nowrap; padding:4px 8px; border-radius:5px; background:#f2f4f7; color:#667085; font-size:12px; }
.promo-status.published { background:#ecf8f0; color:#23734b; }
.promo-status.draft { background:#fff7e8; color:#946c23; }
.promo-management-table,.promo-table { overflow:auto; border:1px solid #e4e8ef; border-radius:10px; background:#fff; }
.promo-management-table table,.promo-table table { width:100%; min-width:680px; border-collapse:collapse; }
.promo-management-table th,.promo-table th { background:#fafbfc; color:#667085; font-size:11px; font-weight:600; }
.promo-management-table th,.promo-management-table td,.promo-table th,.promo-table td { padding:14px 16px; text-align:left; border-bottom:1px solid #edf0f5; font-size:12px; }
.promo-management-table td:first-child { min-width:200px; max-width:330px; }
.promo-management-table td small { display:block; margin-top:5px; font-size:11px; }
.promo-item-title { font-weight:600; text-decoration:none; color:#253858; overflow-wrap:anywhere; }
.promo-management-table tbody tr:hover { background:#fafbff; }
.promo-stats-filters { padding:16px; background:#fff; border:1px solid #e4e8ef; border-radius:10px; align-items:end; }
.promo-stats-filters label { display:grid; gap:5px; font-size:11px; color:#667085; }
.promo-metrics { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.promo-metrics .card { padding:18px; }
.promo-metrics strong { display:block; font-size:28px; margin-top:8px; }
.promo-settings { max-width:780px; }
.promo-settings p { color:#667085; line-height:1.7; font-size:13px; }
.promo-settings form { display:flex; gap:16px; align-items:end; margin:24px 0; flex-wrap:wrap; }
.promo-settings label { display:grid; gap:8px; font-size:13px; }
.promo-settings select { min-width:220px; padding:10px; border:1px solid #dce2e9; border-radius:7px; }
.promo-settings-note { border-top:1px solid #e4e8ef; padding-top:20px; font-size:13px; }
.promo-empty { display:flex; align-items:center; flex-direction:column; text-align:center; padding:48px 20px 56px; border:1px dashed #dce2ed; border-radius:12px; background:#ffffff80; }
.promo-empty-icon { color:#98a7c0; font-size:34px; margin-bottom:12px; }
.promo-empty h2 { font-size:16px; margin:0 0 10px; }
.promo-empty p { font-size:13px; line-height:1.7; color:#667085; max-width:380px; margin:0 0 18px; }
.promo-pagination { display:flex; align-items:center; justify-content:center; gap:16px; padding-top:8px; color:#667085; font-size:12px; }
.promo-pagination button { border:1px solid #dce2e9; border-radius:7px; background:#fff; padding:6px 12px; }
.promo-preview { width:min(1000px,90vw); max-height:90vh; padding:20px; border:0; border-radius:12px; }
.promo-preview::backdrop { background:rgba(16,24,40,.65); }
.promo-preview img,.promo-preview video { display:block; max-width:100%; max-height:75vh; margin:16px auto; }
.promo-preview iframe { width:100%; height:75vh; border:0; margin-top:12px; }
.promo-notice { padding:12px 16px; color:#1749b2; background:#eef4ff; border-radius:8px; }
.promo-error { padding:12px; color:#a02020; background:#fff0f0; }
.promotion-center progress { display:block; margin-top:12px; width:100%; }
@media(max-width:1000px) {
  .app-shell:has(.promotion-center) { grid-template-columns:216px minmax(0,1fr); }
  .app-shell:has(.promotion-center) .sidebar { padding-left:14px; padding-right:14px; }
  .app-shell:has(.promotion-center) .content { padding:22px; }
  .promo-filters select { max-width:160px; }
}
@media(max-width:700px) {
  .app-shell:has(.promotion-center) { grid-template-columns:1fr; }
  .app-shell:has(.promotion-center) .sidebar { position:static; height:auto; }
  .app-shell:has(.promotion-center) .nav { display:block; }
  .promo-subnav { display:flex; flex-wrap:wrap; margin-left:8px; }
  .promo-subnav a { font-size:12px; padding:8px; }
  .promo-grid,.promo-editor { grid-template-columns:1fr; }
  .promo-editor .span-2 { grid-column:auto; }
  .promo-metrics { grid-template-columns:repeat(2,1fr); }
  .promo-filters select { max-width:100%; flex:1; }
  .promo-search { max-width:none; }
  .promo-detail,.promo-editor-panel { padding:18px; }
  .promo-publish-bar { bottom:4px; padding:12px; }
  .promo-publish-bar > div { width:100%; }
}