/* Page-specific styles extracted from promotion_new_request.html for browser caching. */
/* تجميع متطلّبات الراعي بصريًا في بطاقة واحدة (مطابق لتطبيق الجوال). */
  .promo-sponsor-group{padding:14px;margin-bottom:12px;border:1px solid rgba(103,58,183,.14);border-radius:16px;background:rgba(103,58,183,.05)}
  .promo-sponsor-group-head{display:flex;align-items:center;gap:8px;color:#8E6AD8;font-size:14px;font-weight:800}
  .promo-sponsor-group-head::before{content:"";width:9px;height:9px;border-radius:999px;background:linear-gradient(135deg,#7E57C2,#B69AF0);box-shadow:0 0 0 4px rgba(103,58,183,.10)}
  .promo-sponsor-group-hint{margin:4px 0 10px;color:#7c6aa8;font-size:11.5px;font-weight:600}
  .promo-sponsor-group .form-group:last-child{margin-bottom:0}
  .promo-top-shell{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;gap:12px 24px;margin-bottom:18px;padding:24px 28px;border:1px solid #e3edf2;background:linear-gradient(135deg,#fcfffd 0%,#f3faf6 42%,#f9f6ff 100%);box-shadow:0 4px 16px rgba(15,23,42,.04);border-radius:18px}
  .promo-top-copy{grid-column:1;grid-row:1}
  .promo-top-copy h2{margin:6px 0 8px;font-size:22px;line-height:1.4;color:#8E6AD8}
  .promo-top-copy p{margin:0;max-width:62ch;color:#4b5563;line-height:1.8;font-size:13.5px}
  .promo-top-kicker{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:#EDE7F6;color:#7E57C2;font-size:12px;font-weight:700}
  .promo-top-toolbar{grid-column:2;grid-row:1;display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;justify-content:flex-end}
  .promo-top-actions{display:flex;gap:8px;flex-wrap:wrap}
  .promo-nav-pill{border:1px solid #cfe4d4;background:#fff;color:#225d2a;border-radius:999px;padding:9px 20px;font:inherit;font-size:13px;font-weight:700;cursor:pointer;transition:all .18s ease}
  .promo-nav-pill:hover{border-color:#7E57C2;background:#F5F0FB}
  .promo-nav-pill.active{background:#7E57C2;color:#fff;border-color:#7E57C2;box-shadow:0 4px 12px rgba(103,58,183,.18)}
  .promo-meta-label{font-size:11.5px;color:#6b7280;font-weight:600;letter-spacing:.01em}
  .promo-provider-panel{grid-column:1/-1;grid-row:2;display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:14px;background:#fff;border:1px solid #deebe1}
  .promo-provider-copy{display:flex;align-items:center;gap:12px;min-width:0}
  .promo-provider-avatar{flex-shrink:0}
  .promo-provider-copy strong{font-size:17px;line-height:1.4;color:#1f2937;word-break:break-word}
  .promo-quality-strip{margin-inline-start:auto;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
  .promo-quality-strip span{display:inline-flex;align-items:center;min-height:30px;padding:0 10px;border-radius:999px;background:#f8fafc;border:1px solid #dde7f3;color:#36513f;font-size:11.5px;font-weight:800}
  .promo-progress-rail{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:-4px 0 16px}
  .promo-progress-step{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid #dfe8f4;color:#64748b;box-shadow:0 10px 24px rgba(15,23,42,.04)}
  .promo-progress-step b{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:999px;background:#eef2f7;color:#475569;font-size:13px}
  .promo-progress-step strong{font-size:13px;color:inherit}
  .promo-progress-step.active{border-color:#7E57C2;background:linear-gradient(135deg,#fff 0%,#f6f0ff 100%);color:#7353C8;box-shadow:0 14px 30px rgba(103,58,183,.10)}
  .promo-progress-step.active b{background:#7E57C2;color:#fff}
  .promo-progress-step.done{border-color:#bfe3c5;background:#f7fff8;color:#166534}
  .promo-progress-step.done b{background:#16a34a;color:#fff}
  .page-promotion-new .page-shell,
  .page-promotion-new .detail-card,
  .page-promotion-new .promo-service-block,
  .page-promotion-new .service-body,
  .page-promotion-new .portfolio-picker,
  .page-promotion-new .form-group,
  .page-promotion-new .form-input{
    min-width:0;
    max-width:100%;
    box-sizing:border-box;
  }
  .page-promotion-new .form-input,
  .page-promotion-new select,
  .page-promotion-new textarea{
    width:100%;
  }

  .promo-pricing-view{background:linear-gradient(180deg,#fff 0,#fbf8ff 100%)}
  .pricing-guide-head h3{margin:0 0 6px;color:#7E57C2}
  .pricing-guide-head .text-muted{margin:0;color:#4b5563;line-height:1.8}
  .pricing-guide-instructions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}
  .pricing-instruction-item{border:1px solid #e7d7f4;background:#fff;border-radius:12px;padding:10px}
  .pricing-instruction-item strong{display:block;color:#5b2f91;font-size:13px;margin-bottom:4px}
  .pricing-instruction-item span{display:block;color:#475569;font-size:12px;line-height:1.7}
  .pricing-guide-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
  .pricing-meta-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid #d8c9ea;background:#fff;color:#4b5563;font-size:12px}
  .pricing-state{margin-top:12px;padding:10px 12px;border-radius:10px;background:#f8fafc;border:1px solid #e2e8f0;color:#334155;font-size:13px}
  .pricing-state-error{display:flex;align-items:center;justify-content:space-between;gap:8px;background:#fff1f2;border-color:#fecdd3;color:#9f1239}
  .pricing-reload-btn{border:1px solid #d8c9ea;background:#fff;color:#5b2f91;border-radius:999px;padding:6px 12px;font:inherit;font-size:12px;cursor:pointer}
  .pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
  .pricing-card{border:1px solid #d9c4eb;border-radius:14px;padding:12px;background:#fff;box-shadow:0 10px 26px rgba(80,47,130,.06)}
  .pricing-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}
  .pricing-card h4{margin:0;color:#663d90;font-size:15px}
  .pricing-rule-count{font-size:11px;color:#64748b;background:#f8fafc;border:1px solid #e2e8f0;border-radius:999px;padding:2px 8px;white-space:nowrap}
  .pricing-hints{margin:0 0 10px;padding-inline-start:16px;color:#475569;font-size:12px;line-height:1.7}
  .pricing-hints li{margin:0}
  .pricing-table-wrap{overflow:auto}
  .pricing-table{width:100%;border-collapse:collapse;font-size:12px}
  .pricing-table th,.pricing-table td{border:1px solid #eadcf6;padding:7px 8px;text-align:right;vertical-align:top}
  .pricing-table th{background:#f5ecfd;color:#5b2f91}
  .pricing-price-value{font-weight:800;color:#7E57C2}
  .pricing-empty{margin:0;padding:10px;border:1px dashed #d8c9ea;border-radius:10px;background:#faf7ff;color:#64748b;font-size:12px}

  .attachment-guide{border:1px solid #ece6f8;background:#faf7ff;border-radius:12px;padding:10px 12px;color:#4b2d73;font-size:13px;line-height:1.7;margin:0 0 10px}
  .attachment-guide strong{display:block;font-weight:700}

  .promo-composer-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:12px 16px;margin:0 0 14px;border-radius:14px;background:#f8fdf9;border:1px solid #e2ece6}
  .promo-composer-intro strong{display:block;margin-bottom:2px;color:#7353C8;font-size:15px}
  .promo-composer-intro p{margin:0;color:#52606d;line-height:1.7;font-size:12.5px}
  .promo-selected-counter{display:flex;align-items:center;gap:9px;padding:9px 12px;border-radius:14px;background:#fff;border:1px solid #dce7dd}
  .promo-selected-counter span{color:#64748b;font-size:12px;font-weight:800}
  .promo-selected-counter strong{display:inline-flex;align-items:center;justify-content:center;min-width:32px;height:32px;border-radius:999px;background:#104535;color:#fff;font-size:16px}

  .promo-builder-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,320px);gap:18px;align-items:start}
  .promo-builder-main{min-width:0}
  .promo-builder-sidebar{position:sticky;top:88px;display:grid;gap:12px}
  .promo-sidebar-card{border:1px solid #dfe8f4;border-radius:18px;padding:16px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);box-shadow:0 14px 34px rgba(15,23,42,.055)}
  .promo-sidebar-kicker{display:inline-flex;align-items:center;width:max-content;max-width:100%;padding:5px 10px;border-radius:999px;background:#eef8f4;color:#104535;font-size:11px;font-weight:900}
  .promo-sidebar-card h3{margin:8px 0 12px;color:#213547;font-size:18px}
  .promo-sidebar-total{display:grid;gap:4px;padding:12px;border-radius:14px;background:#f7f2ff;border:1px solid #e5daf7;margin-bottom:12px}
  .promo-sidebar-total-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
  .promo-sidebar-total span{font-size:12px;color:#6E5A99;font-weight:800}
  .promo-sidebar-total strong{font-size:22px;color:#8E6AD8;line-height:1.25}
  .promo-sidebar-empty{padding:12px;border:1px dashed #d9e2ec;border-radius:14px;color:#64748b;background:#f8fafc;font-size:12.5px;line-height:1.8}
  .promo-selected-list{display:grid;gap:8px}
  .promo-selected-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:12px;border:1px solid #e2e8f0;background:#fff;color:#243b53;font-size:12.5px;font-weight:800}
  .promo-selected-item span{color:#64748b;font-size:11px;font-weight:700}
  .promo-sidebar-pricing-hint{margin-top:10px;padding:10px 12px;border-radius:12px;background:#fff8ed;border:1px solid #f1d5a8;color:#7a4b00;font-size:12px;line-height:1.8;font-weight:700}
  .promo-sidebar-breakdown{margin-top:12px;margin-bottom:12px}
  .promo-sidebar-breakdown .promo-live-breakdown-item{background:#fff;padding:8px 0}
  .promo-sidebar-pricing{display:grid;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #e8eef5}
  .promo-sidebar-price-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0;color:#52606d}
  .promo-sidebar-price-row span{font-size:12px;font-weight:800}
  .promo-sidebar-price-row strong{font-size:13px;color:#243b53;white-space:nowrap}
  .promo-sidebar-price-row-total{background:#eef8f4;border-color:#cfe7d7;color:#104535}
  .promo-sidebar-price-row-total strong{color:#104535;font-size:15px}
  .promo-sidebar-note{background:linear-gradient(135deg,#fff8ed 0%,#fff 100%);border-color:#f1d5a8;color:#7a4b00}
  .promo-sidebar-note strong{display:block;margin-bottom:4px;color:#7a4b00}
  .promo-sidebar-note span{display:block;color:#8a5a14;font-size:12px;line-height:1.8}

  .promo-services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:16px;align-items:start}
  .promo-service-block{border:1px solid #dfe8f4;border-radius:18px;padding:18px;background:linear-gradient(180deg,#fff 0%,#fcfcff 100%);box-shadow:0 14px 34px rgba(15,23,42,.05);transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;min-height:100%}
  .promo-service-block:hover{transform:translateY(-2px);border-color:#c7d9e8}
  .promo-service-block.is-active{border-color:#7E57C2;box-shadow:0 0 0 3px rgba(103,58,183,.08),0 18px 36px rgba(103,58,183,.10);background:linear-gradient(180deg,#ffffff 0%,#F5F0FB 100%)}
  .promo-service-block.is-locked{border-color:#eadfbe;background:linear-gradient(180deg,#fffdfa 0%,#fff8e8 100%);box-shadow:0 12px 28px rgba(148,115,35,.06)}
  .promo-service-block.is-locked:hover{transform:none;border-color:#eadfbe}
  .service-block-header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:flex-start;gap:12px;margin:0}
  .service-block-icon{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:14px;background:#eef8f4;color:#104535;font-size:12px;font-weight:900;border:1px solid #d7eadf}
  .promo-service-block.is-active .service-block-icon{background:#7E57C2;color:#fff;border-color:#7E57C2}
  .service-block-title{min-width:0}
  .service-block-header h4{margin:0;color:#243b53;font-size:19px;line-height:1.4}
  .service-block-title p{margin:6px 0 0;color:#64748b;font-size:13px;line-height:1.8}
  .service-block-meta{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
  .service-block-meta span{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border-radius:999px;background:#f8fafc;border:1px solid #e2e8f0;color:#52606d;font-size:11px;font-weight:800}
  .service-toggle-label{display:inline-flex;align-items:center;gap:8px;color:#1f4d2a;font-size:13px;font-weight:800;cursor:pointer;padding:8px 12px;border-radius:999px;background:#F5F0FB;border:1px solid #d5e7d8;flex-shrink:0}
  .service-toggle-label.is-disabled{cursor:not-allowed;color:#8a6d3b;background:#f8f1de;border-color:#eadfbe}
  .service-toggle-input{accent-color:#7b2cbf}
  .service-body{margin-top:16px;padding-top:16px;border-top:1px solid #edf2f7}
  .service-block-footer{display:flex;justify-content:flex-end;margin-top:14px}
  .service-block-footer .btn{min-height:38px;padding-inline:14px}
  .promo-service-lock-note{margin-top:14px;padding:12px 14px;border-radius:14px;border:1px solid #eadfbe;background:#fff8e8;color:#7c5a16;font-size:13px;line-height:1.8}
  .promo-service-lock-note a{color:#6b46c1;font-weight:800;text-decoration:none}
  .promo-service-lock-note a:hover{text-decoration:underline}
  .form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
  .form-row .half,.form-group.half{min-width:0}
  .promo-service-block .form-input[type="datetime-local"]{min-width:0}
  .portfolio-picker{margin-top:8px;padding:14px;border:1px solid #dce7dd;border-radius:16px;background:linear-gradient(180deg,#fcfffc 0%,#f6fbf6 100%)}
  .portfolio-picker-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}
  .portfolio-picker-label{margin:0}
  .portfolio-picker-help{margin:4px 0 0;color:#6E5A99;font-size:12px;line-height:1.7}
  .portfolio-picker-link{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 12px;border-radius:999px;border:1px solid #c8b3ea;background:#faf7ff;color:#663d90;text-decoration:none;font-size:12px;font-weight:700;white-space:nowrap}
  .portfolio-picker-link:hover{background:#efe7fb}
  .portfolio-picker-state{padding:12px 14px;border-radius:14px;background:#fff;color:#51606c;font-size:12px;line-height:1.8;border:1px dashed #d8e1eb}
  .portfolio-picker-state-error{background:#fff6f6;color:#a33c3c;border-color:#efc4c4}
  .portfolio-picker-state-empty{background:#fffef7;color:#7a6840;border-color:#eadba5}
  .portfolio-picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,156px));gap:12px;align-items:start;justify-content:start}
  .portfolio-picker-card{width:100%;border:1px solid #dfe8f4;border-radius:16px;padding:8px;background:#fff;box-shadow:0 10px 24px rgba(15,23,42,.05);cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;text-align:right}
  .portfolio-picker-card:hover{transform:translateY(-1px);border-color:#c3d9c7;box-shadow:0 14px 28px rgba(34,88,49,.08)}
  .portfolio-picker-card.is-selected{border-color:#7E57C2;box-shadow:0 0 0 3px rgba(103,58,183,.12),0 14px 28px rgba(103,58,183,.10);background:linear-gradient(180deg,#ffffff 0%,#F5F0FB 100%)}
  .portfolio-picker-media{position:relative;overflow:hidden;border-radius:12px;background:#eef3f7;aspect-ratio:1 / 1}
  .portfolio-picker[data-portfolio-picker="snapshots"] .portfolio-picker-media{aspect-ratio:4 / 5}
  .portfolio-picker-media img,.portfolio-picker-media video{display:block;width:100%;height:100%;object-fit:cover}
  .portfolio-picker-type-badge{position:absolute;inset-inline-start:8px;bottom:8px;display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;background:rgba(15,23,42,.78);color:#fff;font-size:10px;font-weight:800;letter-spacing:.2px}
  .portfolio-picker-check{position:absolute;top:8px;inset-inline-end:8px;width:26px;height:26px;border-radius:999px;background:rgba(255,255,255,.92);border:1px solid rgba(103,58,183,.18);display:flex;align-items:center;justify-content:center;color:#7E57C2;box-shadow:0 8px 18px rgba(15,23,42,.12);opacity:0;transform:scale(.9);transition:opacity .18s ease,transform .18s ease}
  .portfolio-picker-card.is-selected .portfolio-picker-check{opacity:1;transform:scale(1)}
  .portfolio-picker-meta{padding:8px 2px 2px}
  .portfolio-picker-caption{margin:0;color:#8E6AD8;font-size:12px;font-weight:800;line-height:1.6;display:-webkit-box;line-clamp:2;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .portfolio-picker-date{display:block;margin-top:4px;color:#7b8794;font-size:11px}
  .portfolio-picker-selection{margin-top:12px;padding:10px 12px;border-radius:14px;background:#ffffff;border:1px solid #d9ead7;color:#215832;font-size:12px;font-weight:700}
  .portfolio-picker-preview{margin-top:12px;display:grid;gap:10px}
  .portfolio-picker-preview-frame{position:relative;overflow:hidden;border-radius:18px;background:linear-gradient(135deg,#10231c 0%,#1f3a2f 55%,#274236 100%);min-height:220px;border:1px solid rgba(103,58,183,.16);display:flex;align-items:center;justify-content:center;padding:10px}
  .portfolio-picker-preview-frame img,.portfolio-picker-preview-frame video{display:block;width:100%;height:100%;max-height:260px;object-fit:contain;border-radius:14px;background:rgba(255,255,255,.06)}
  .portfolio-picker-preview-empty{color:#e5efe8;font-size:12px;line-height:1.8;text-align:center;max-width:240px}
  .portfolio-picker-preview-caption{padding:10px 12px;border-radius:14px;background:#fff;border:1px solid #dce7dd;color:#36513f;font-size:12px;line-height:1.8}

  .check-row{display:flex;gap:12px;flex-wrap:wrap;margin:8px 0 12px}
  .check-row label{font-size:13px;color:#374151;line-height:1.7}
  .search-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
  .search-options label{display:flex;align-items:flex-start;gap:8px;padding:10px 12px;border-radius:12px;background:#f8fafc;border:1px solid #e2e8f0}
  .hint-list{border:1px dashed #f1cc63;background:#fffbe8;border-radius:10px;padding:8px 10px;margin:0 0 10px;color:#7a4b00;font-size:12px;line-height:1.7}
  .hint-list strong{display:block;margin-bottom:2px}
  .hint-list p{margin:0}


  .banner-editor{border:1px solid #ebe3f8;border-radius:14px;padding:12px;background:#faf7ff;margin-bottom:10px}
  .banner-editor-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:8px}
  .banner-preview-frame{position:relative;width:100%;aspect-ratio:16/7;border-radius:12px;overflow:hidden;background:linear-gradient(135deg,#0f172a,#1e293b)}
  .banner-preview-stage{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .banner-preview-empty{color:#e5e7eb;font-size:13px;text-align:center;padding:10px}
  .banner-preview-media-wrap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:10px}
  .banner-preview-media{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
  /* محرّر القصّ اليدوي للصورة (مقاس 1920×840) */
  .banner-crop-img{position:absolute;top:0;left:0;transform-origin:0 0;max-width:none;max-height:none;user-select:none;-webkit-user-drag:none;will-change:transform;cursor:grab;touch-action:none}
  .banner-crop-img:active{cursor:grabbing}
  .banner-preview-frame.is-cropping::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.32) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.32) 1px,transparent 1px);background-size:33.33% 33.33%;mix-blend-mode:overlay}
  .banner-crop-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 2px;flex-wrap:wrap}
  .banner-crop-controls[hidden]{display:none}
  .banner-crop-zoom{display:flex;align-items:center;gap:8px;flex:1;min-width:160px;color:#6b6480;font-weight:800;font-size:14px}
  .banner-crop-zoom input[type=range]{flex:1;accent-color:#7E57C2;cursor:pointer}
  .banner-crop-actions{display:flex;align-items:center;gap:10px}
  .banner-crop-status{color:#16a34a;font-size:12px;font-weight:800}
  .banner-crop-status[hidden]{display:none}
  .btn-sm{padding:6px 12px;font-size:12px}
  .promo-attachment-preview{margin:10px 0 14px;border:1px solid #d9ead7;border-radius:14px;background:#fbfefb;padding:12px;display:grid;gap:10px}
  .promo-attachment-preview[hidden]{display:none}
  .promo-attachment-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#215832}
  .promo-attachment-preview-head strong{font-size:13px}
  .promo-attachment-preview-count{font-size:12px;font-weight:800;color:#7E57C2}
  .promo-attachment-preview-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
  .promo-attachment-card{position:relative;overflow:hidden;border:1px solid #e2e8f0;border-radius:12px;background:#fff;box-shadow:0 8px 18px rgba(15,23,42,.04)}
  .promo-attachment-media{height:118px;background:#f3f6f8;display:flex;align-items:center;justify-content:center;overflow:hidden}
  .promo-attachment-media img,.promo-attachment-media video{display:block;width:100%;height:100%;object-fit:cover}
  .promo-attachment-file-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:14px;background:#f4effd;color:#7E57C2;font-size:12px;font-weight:800}
  .promo-attachment-meta{padding:9px 10px;display:grid;gap:3px}
  .promo-attachment-name{font-size:12px;font-weight:800;color:#243b53;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .promo-attachment-size{font-size:11px;color:#6b7280}
  .promo-attachment-remove{position:absolute;top:8px;inset-inline-end:8px;width:28px;height:28px;border:0;border-radius:999px;background:rgba(15,23,42,.78);color:#fff;font-size:18px;line-height:1;cursor:pointer}

  .promo-live-breakdown{margin-top:10px;border-top:1px solid #eadff6;padding-top:8px}
  .promo-live-breakdown-item{display:flex;justify-content:space-between;gap:10px;padding:6px 0;font-size:12px;color:#374151;border-bottom:1px dashed #eee}
  .promo-live-breakdown-item:last-child{border-bottom:0}
  .promo-live-breakdown-item strong{color:#4b2d73}
  .promo-upload-status{margin:14px 0 10px;border:1px solid #dce7dd;border-radius:14px;background:#fbfefb;padding:12px}
  .promo-upload-status-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
  .promo-upload-status-head strong{font-size:13px;color:#215832}
  .promo-upload-status-percent{font-size:12px;font-weight:700;color:#215832}
  .promo-upload-status-detail{margin:6px 0 0;color:#52606d;font-size:12px;line-height:1.7}
  .promo-upload-progress{margin-top:8px;width:100%;height:8px;border-radius:999px;background:#edf2f7;overflow:hidden}
  .promo-upload-progress span{display:block;height:100%;width:0;background:linear-gradient(90deg,#7E57C2,#B69AF0);transition:width .2s ease}
  .promo-upload-status.state-waiting{border-color:#d8c9ea;background:#faf7ff}
  .promo-upload-status.state-waiting .promo-upload-status-head strong,
  .promo-upload-status.state-waiting .promo-upload-status-percent{color:#5b2f91}
  .promo-upload-status.state-waiting .promo-upload-progress span{background:linear-gradient(90deg,#9f7aea,#7c3aed)}
  .promo-upload-status.state-uploading{border-color:#cfe9ff;background:#f4faff}
  .promo-upload-status.state-uploading .promo-upload-status-head strong,
  .promo-upload-status.state-uploading .promo-upload-status-percent{color:#1d4ed8}
  .promo-upload-status.state-uploading .promo-upload-progress span{background:linear-gradient(90deg,#0ea5e9,#2563eb)}
  .promo-upload-status.state-success{border-color:#cfead2;background:#f4fff6}
  .promo-upload-status.state-success .promo-upload-status-head strong,
  .promo-upload-status.state-success .promo-upload-status-percent{color:#166534}
  .promo-upload-status.state-failed{border-color:#fecaca;background:#fff7f7}
  .promo-upload-status.state-failed .promo-upload-status-head strong,
  .promo-upload-status.state-failed .promo-upload-status-percent{color:#b91c1c}
  .promo-upload-status.state-failed .promo-upload-progress span{background:linear-gradient(90deg,#ef4444,#dc2626)}

  .promo-submit-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
  .promo-submit-actions .btn{min-height:42px}

  .promo-summary-view{max-width:760px;margin:0 auto}
  .promo-summary-head-badge{display:inline-flex;align-items:center;justify-content:center;background:#7E57C2;color:#fff;font-weight:700;padding:10px 20px;border-radius:10px;margin:0 auto 14px;font-size:16px}
  .promo-summary-provider-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-bottom:12px;color:#5b2f91;font-weight:700;font-size:14px}
  .promo-summary-provider-row strong{display:inline-block;border:1px solid #d9c4eb;padding:6px 16px;min-width:140px;text-align:center;border-radius:10px;background:#faf7ff}
  .promo-summary-note{margin:0 0 10px;text-align:center;font-size:14px;color:#4b5563;line-height:1.7}
  .promo-summary-table-wrap{border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}
  .promo-summary-table{width:100%;border-collapse:collapse}
  .promo-summary-table thead th{background:#7E57C2;color:#fff;font-size:14px;padding:12px 14px;border:none;font-weight:700}
  .promo-summary-table tbody td,.promo-summary-table tbody th{border-bottom:1px solid #f1f5f9;padding:12px 14px;font-size:14px;text-align:center;background:#fff}
  .promo-summary-table tbody tr:last-child td,.promo-summary-table tbody tr:last-child th{border-bottom:none}
  .promo-summary-table tbody td[colspan="2"]{font-size:13px;color:#6b7280}
  .promo-summary-totals-wrap{margin-top:8px}
  .promo-summary-totals tbody th{background:#f8fdf9;font-weight:700;font-size:14px}
  .promo-summary-totals tbody td{font-weight:700;font-size:14px}
  .promo-summary-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:18px}
  .promo-summary-actions .btn{min-width:160px;min-height:44px}

  .promo-payment-view{max-width:560px;margin:0 auto}
  .promo-payment-head-badge{display:inline-flex;align-items:center;justify-content:center;background:#7E57C2;color:#fff;font-weight:700;padding:10px 20px;border-radius:10px;margin:0 auto 14px;font-size:16px}
  .promo-payment-request-row,.promo-payment-amount-row{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:8px 12px;border:1px solid #d9c4eb;border-radius:8px;background:#fff;margin-bottom:10px}
  .promo-payment-request-row span,.promo-payment-amount-row span{color:#6b7280;font-weight:700}
  .promo-payment-request-row strong,.promo-payment-amount-row strong{color:#7E57C2;font-weight:800}

  .promo-payment-methods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:12px}
  .promo-payment-method-option{display:flex;align-items:center;justify-content:center;gap:6px;border:1px solid #d9c4eb;border-radius:999px;padding:8px;background:#fff;color:#4b2d73;font-weight:700;cursor:pointer}
  .promo-payment-method-option.is-selected{border-color:#7E57C2;box-shadow:0 0 0 2px rgba(103,58,183,.12);background:#F5F0FB}
  .promo-payment-method-option input{accent-color:#7E57C2}
  .promo-payment-card-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .promo-payment-card-grid .form-group{margin:0}
  .promo-payment-card-grid .form-group.half{grid-column:span 1}
  .promo-payment-card-grid .form-group:not(.half){grid-column:span 2}
  .promo-payment-security{margin-top:12px;border:1px solid #dcefd7;background:#F5F0FB;border-radius:10px;padding:10px 12px}
  .promo-payment-security strong{display:block;color:#7E57C2;margin-bottom:6px}
  .promo-payment-security ul{margin:0;padding-inline-start:18px;color:#4b5563;font-size:12px;line-height:1.7}
  .promo-payment-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:14px}
  .promo-payment-actions .btn{min-width:160px;min-height:44px}

  .promo-modal{position:fixed;inset:0;z-index:1500}
  .promo-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(4px)}
  .promo-modal-card{position:relative;z-index:1;max-width:560px;margin:8vh auto 0;background:#fff;border-radius:22px;padding:18px;box-shadow:0 20px 40px rgba(15,23,42,.18)}
  .promo-modal-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
  .promo-modal-head h3{margin:0;color:#3f2470}
  .promo-modal-close{border:0;background:#f4effd;color:#663d90;width:36px;height:36px;border-radius:999px;font-size:24px;line-height:1;cursor:pointer}
  .promo-modal-body{max-height:60vh;overflow:auto}
  .promo-modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:16px;flex-wrap:wrap}
  .promo-modal-section{margin-bottom:14px}
  .promo-modal-section h4{margin:0 0 8px;color:#3f2470;font-size:15px}
  .promo-modal-item{padding:10px 12px;border-radius:14px;background:#f7f3ff;margin-bottom:8px}
  .promo-modal-item strong{display:block;margin-bottom:4px}
  .promo-summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .promo-summary-grid .promo-modal-item{margin-bottom:0;background:#faf8ff}
  .promo-note{margin:0;color:#6b7280;line-height:1.8;font-size:13px}
  .promo-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #f1f0f6}
  .promo-line:last-child{border-bottom:0}
  .promo-line span:first-child{color:#6b7280}
  .promo-modal-selected-media-frame img,.promo-modal-selected-media-frame video{display:block;width:100%;max-height:320px;object-fit:contain;border-radius:16px;background:#f5f7fb}

  .promo-success-card{max-width:420px;text-align:center;padding:28px 24px}
  .success-code-badge{display:inline-block;border:2px solid #7E57C2;color:#7E57C2;border-radius:8px;padding:8px 24px;font-weight:700;font-size:15px;margin:0 0 18px}
  .success-message-box{border:2px solid #7E57C2;border-radius:8px;padding:16px;margin:0 0 18px}
  .success-message-box strong{display:block;font-size:17px;margin:0 0 4px}
  .success-message-box p{margin:0;color:#6b7280}

  @media (max-width:1024px){
    .promo-top-shell{grid-template-columns:1fr;gap:14px}
    .promo-top-toolbar{justify-content:flex-start}
    .promo-quality-strip{margin-inline-start:0;justify-content:flex-start}
    .promo-builder-layout{grid-template-columns:1fr}
    .promo-builder-sidebar{position:static;order:-1}
    .pricing-guide-instructions{grid-template-columns:1fr}
    .pricing-grid{grid-template-columns:1fr}
  }

  @media (min-width:1025px){
    .promo-services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .promo-service-block.is-active{grid-column:1/-1}
    .promo-summary-view{max-width:800px;margin-inline:auto}
    .promo-payment-view{max-width:620px;margin-inline:auto}
  }

  @media (max-width:640px){
    .page-promotion-new .page-shell{gap:12px;overflow-x:hidden}
    .page-promotion-new .page-header{align-items:center;gap:10px}
    .page-promotion-new .page-header h1{min-width:0;font-size:18px;line-height:1.35;white-space:normal}
    .promo-top-shell{grid-template-columns:1fr;padding:14px;gap:10px;border-radius:12px}
    .promo-top-copy h2{font-size:18px;line-height:1.5}
    .promo-top-copy p{font-size:12.5px;line-height:1.8}
    .promo-top-kicker{max-width:100%;white-space:normal}
    .promo-nav-pill{width:100%;justify-content:center}
    .promo-top-actions{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
    .promo-top-toolbar{justify-content:stretch}
    .promo-progress-rail{grid-template-columns:1fr;gap:8px}
    .promo-progress-step{padding:10px 12px;border-radius:12px}
    .promo-quality-strip{display:grid;grid-template-columns:1fr;gap:6px;width:100%}
    .promo-quality-strip span{justify-content:center}
    .promo-provider-panel{padding:12px;border-radius:10px}
    .promo-provider-panel{display:grid}
    .promo-provider-copy strong{font-size:15px}
    .promo-services-grid{grid-template-columns:1fr}
    .promo-service-block{padding:14px;border-radius:10px;box-shadow:0 8px 22px rgba(15,23,42,.045)}
    .promo-service-block:hover{transform:none}
    .service-block-header h4{font-size:16px;line-height:1.45}
    .service-block-title p{font-size:12.5px;line-height:1.75}
    .form-row{grid-template-columns:1fr}
    .promo-service-block .form-input{min-height:44px;font-size:14px}
    .promo-service-block textarea.form-input{min-height:104px}
    .promo-service-block input[type="file"].form-input{height:auto;padding:10px;font-size:12px}
    .service-block-header{grid-template-columns:auto minmax(0,1fr);align-items:start}
    .service-block-icon{width:36px;height:36px;border-radius:12px}
    .service-toggle-label{grid-column:1/-1}
    .service-toggle-label{justify-content:center;width:100%;min-height:44px;border-radius:10px}
    .promo-composer-intro{display:grid;padding:12px;border-radius:10px}
    .promo-composer-intro strong{font-size:14px}
    .promo-composer-intro p{font-size:12px}
    .promo-selected-counter{justify-content:space-between}
    .promo-builder-sidebar{order:-1}
    .promo-sidebar-card{border-radius:12px;padding:12px}
    .promo-sidebar-total strong{font-size:20px}
    .service-block-meta span{font-size:10.5px}
    .service-block-footer{display:grid}
    .service-block-footer .btn{width:100%}
    .portfolio-picker{padding:12px;border-radius:10px}
    .portfolio-picker-head{flex-direction:column;align-items:stretch}
    .portfolio-picker-link{width:100%}
    .portfolio-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
    .portfolio-picker-card{border-radius:10px;padding:7px}
    .portfolio-picker-media{border-radius:8px}
    .portfolio-picker-preview-frame{min-height:160px;border-radius:10px}
    .portfolio-picker-preview-frame img,.portfolio-picker-preview-frame video{max-height:200px;border-radius:8px}
    .portfolio-picker-selection,.portfolio-picker-preview-caption,.portfolio-picker-state{border-radius:10px}
    .promo-composer-intro-note{max-width:none;width:100%}
    .banner-editor{padding:10px;border-radius:10px}
    .banner-editor-head{display:grid}
    .banner-preview-frame{border-radius:8px}
    .promo-live-breakdown-item{display:grid;grid-template-columns:1fr;gap:3px}
    .promo-upload-status{border-radius:10px}
    .promo-submit-actions{display:grid;grid-template-columns:1fr;gap:8px}
    .promo-submit-actions .btn{width:100%;min-width:0}
    .promo-summary-view,.promo-payment-view{width:100%;padding:14px;border-radius:12px}
    .promo-summary-head-badge{display:flex;width:100%;font-size:14px;padding:9px 12px;text-align:center;border-radius:8px}
    .promo-summary-note{font-size:13px}
    .promo-summary-table-wrap{border-radius:10px;overflow:hidden}
    .promo-summary-table,
    .promo-summary-table thead,
    .promo-summary-table tbody,
    .promo-summary-table tr,
    .promo-summary-table th,
    .promo-summary-table td{display:block;width:100%}
    .promo-summary-table thead{display:none}
    .promo-summary-table tbody tr{padding:10px 12px;border-bottom:1px solid #f1f5f9;background:#fff}
    .promo-summary-table tbody tr:last-child{border-bottom:0}
    .promo-summary-table tbody td,
    .promo-summary-table tbody th{border:0;padding:3px 0;font-size:13px;text-align:inherit;background:transparent}
    .promo-summary-table tbody td:not([colspan]):last-child{font-weight:800;color:#7E57C2}
    .promo-summary-totals tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}
    .promo-summary-actions .btn{width:100%}
    .promo-payment-head-badge{display:flex;width:100%;font-size:14px;border-radius:8px}
    .promo-payment-methods{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
    .promo-payment-method-option{min-height:44px;border-radius:10px;padding:8px 6px;font-size:12px}
    .promo-payment-card-grid{grid-template-columns:1fr}
    .promo-payment-card-grid .form-group,.promo-payment-card-grid .form-group.half{grid-column:span 1}
    .promo-payment-security{border-radius:10px}
    .promo-payment-actions .btn{width:100%}
    .promo-modal-card{margin:0;height:100dvh;max-width:none;border-radius:0;padding:14px;display:flex;flex-direction:column}
    .promo-modal-head{flex:0 0 auto}
    .promo-modal-body{flex:1 1 auto;max-height:none;min-height:0;overflow:auto}
    .promo-modal-actions{flex:0 0 auto;display:grid;grid-template-columns:1fr;gap:8px}
    .promo-modal-actions .btn{width:100%}
    .promo-summary-grid{grid-template-columns:1fr}
  }

  @media (max-width:420px){
    .promo-provider-panel,
    .promo-provider-copy,
    .pricing-state-error,
    .promo-summary-provider-row,
    .promo-payment-request-row,
    .promo-payment-amount-row,
    .promo-line{
      display:grid;
      grid-template-columns:1fr;
      align-items:start;
    }

    .promo-top-toolbar,
    .promo-top-actions,
    .promo-submit-actions,
    .promo-modal-actions{
      width:100%;
    }

    .promo-payment-methods{grid-template-columns:1fr}
    .promo-payment-method-option{justify-content:flex-start;padding-inline:12px}
    .promo-modal-card{width:100vw;max-height:100dvh;display:flex;flex-direction:column}
    .promo-modal-body{flex:1 1 auto}
  }

  @media (max-width:360px){
    .promo-top-shell,.promo-service-block,.promo-summary-table-wrap,.promo-payment-view{padding-inline:10px}
    .portfolio-picker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .promo-nav-pill{padding-inline:10px;font-size:12px}
    .promo-summary-actions .btn,.promo-payment-actions .btn{min-width:0}
  }

  /* ── Dark mode ── */
  [data-theme="dark"] .promo-top-shell{background:#1a1025;border-color:rgba(255,255,255,0.08)}
  [data-theme="dark"] .promo-top-copy h2{color:#e2d9f3}
  [data-theme="dark"] .promo-top-copy p{color:#8a95a8}
  [data-theme="dark"] .promo-service-block{background:#1e1828;border-color:rgba(255,255,255,0.08)}
  [data-theme="dark"] .promo-service-block.is-active{background:#1e1535;border-color:rgba(139,92,246,0.35);box-shadow:0 0 0 3px rgba(139,92,246,.12),0 18px 36px rgba(103,58,183,.18)}
  [data-theme="dark"] .service-block-header{border-color:rgba(255,255,255,0.07)}
  [data-theme="dark"] .service-toggle-label{color:#c9d5e0}
  [data-theme="dark"] .service-toggle-label:hover{background:#231d35}
  [data-theme="dark"] .service-body{border-color:rgba(255,255,255,0.06)}
  [data-theme="dark"] .form-label{color:#c9d5e0}
  [data-theme="dark"] .form-input{background:#231d35;border-color:rgba(255,255,255,0.15);color:#e2d9f3}
  [data-theme="dark"] .form-input:focus{border-color:rgba(139,92,246,0.6);box-shadow:0 0 0 3px rgba(139,92,246,0.15)}
  [data-theme="dark"] .portfolio-picker{background:#1e1828;border-color:rgba(255,255,255,0.08)}
  [data-theme="dark"] .portfolio-picker-card{background:#231d35;border-color:rgba(255,255,255,0.08);color:#e2d9f3}
  [data-theme="dark"] .portfolio-picker-card.is-selected{border-color:rgba(139,92,246,0.5);background:#1e1535}
  [data-theme="dark"] .portfolio-picker-caption{color:#d9ccf3}
  [data-theme="dark"] .promo-summary-table-wrap{background:#1a1025;border-color:rgba(255,255,255,0.08)}
  [data-theme="dark"] .promo-summary-table tbody td,
  [data-theme="dark"] .promo-summary-table tbody th{background:#1e1828;color:#e2d9f3;border-color:rgba(255,255,255,0.06)}
  [data-theme="dark"] .promo-summary-table tbody td[colspan="2"]{color:#8a95a8}
  [data-theme="dark"] .promo-summary-totals tbody th{background:#231d35;color:#c9d5e0}
  [data-theme="dark"] .promo-summary-totals tbody td{color:#e2d9f3}
  [data-theme="dark"] .promo-nav-pill{background:#231d35;border-color:rgba(255,255,255,0.1);color:#c9d5e0}
  [data-theme="dark"] .promo-nav-pill.active{background:#2a1f40;border-color:rgba(139,92,246,0.5);color:#c9a8ff}
  @media (prefers-color-scheme:dark){
    :not([data-theme]) .promo-service-block{background:#1e1828;border-color:rgba(255,255,255,0.08)}
    :not([data-theme]) .form-input{background:#231d35;border-color:rgba(255,255,255,0.15);color:#e2d9f3}
  }