/*
  Woo Quote Proforma — Builder UI
  Scope: UI/UX only (CSS / light markup styling)

  Notes:
  - All styles are scoped under .wqp-wrap to avoid impacting the site/theme.
  - No business logic / calculations / REST / DB behavior is affected.
*/

.wqp-wrap{
  max-width:1100px;
  margin:20px auto;
  padding:0 12px;
  color:#0f172a;
  font-size:14px;
  line-height:1.45;
}

/* Keep sizing predictable inside the Builder UI only */
.wqp-wrap,
.wqp-wrap *{box-sizing:border-box}

.wqp-wrap .wqp-card{
  background:#fff;
  border:1px solid #cbd5e1;
  border-radius:14px;
  box-shadow:0 1px 3px rgba(0,0,0,.06);
}

.wqp-wrap .wqp-header{
  padding:16px 18px;
  border-bottom:1px solid #cbd5e1;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:#f8fafc;
  border-radius:14px 14px 0 0;
}

.wqp-wrap .wqp-title{font-size:17px;font-weight:800;color:#0f172a}
.wqp-wrap .wqp-subtitle{font-size:12px;color:#475569}
.wqp-wrap .wqp-body{padding:16px 18px}

/* Layout */
.wqp-wrap .wqp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.wqp-wrap .wqp-grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.wqp-wrap .wqp-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.wqp-wrap .wqp-grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}

@media(max-width:900px){
  .wqp-wrap .wqp-grid,
  .wqp-wrap .wqp-grid-2,
  .wqp-wrap .wqp-grid-3,
  .wqp-wrap .wqp-grid-4{grid-template-columns:repeat(1,minmax(0,1fr))}
}

/* Document header blocks (missing styles previously) */
.wqp-wrap .wqp-doc-header{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:4px 0 16px;align-items:start}
.wqp-wrap .wqp-doc-col{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:12px;min-width:0;align-self:start}
@media(max-width:900px){.wqp-wrap .wqp-doc-header{grid-template-columns:1fr}}

/* Field sizing helpers used in markup */
.wqp-wrap .wqp-field{min-width:0}
.wqp-wrap .wqp-field-full{grid-column:1 / -1}
.wqp-wrap .wqp-field-hidden{display:none}

/* Typography */
.wqp-wrap .wqp-field label{
  display:block;
  font-size:13px;
  font-weight:600;
  color:#0f172a;
  margin-bottom:6px;
}

.wqp-wrap .wqp-field input,
.wqp-wrap .wqp-field select,
.wqp-wrap .wqp-field textarea{
  width:100%;
  padding:10px 12px;
  border:1px solid #cbd5e1;
  border-radius:10px;
  font-size:14px;
  font-weight:500;
  line-height:1.35;
  color:#0f172a;
  background:#fff;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.wqp-wrap .wqp-field textarea{resize:vertical}

.wqp-wrap .wqp-field input::placeholder,
.wqp-wrap .wqp-field textarea::placeholder{color:#94a3b8}

.wqp-wrap .wqp-field input:hover,
.wqp-wrap .wqp-field select:hover,
.wqp-wrap .wqp-field textarea:hover{border-color:#94a3b8}

/* Focus highlight (controlled) */
.wqp-wrap .wqp-field input:focus,
.wqp-wrap .wqp-field select:focus,
.wqp-wrap .wqp-field textarea:focus{
  border-color:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.18);
}

.wqp-wrap .wqp-field input:disabled{
  background:#f1f5f9;
  color:#64748b;
  border-color:#e2e8f0;
}

.wqp-wrap .wqp-req{color:#ef4444}

/* Buttons */
.wqp-wrap .wqp-actions{margin-top:14px;display:flex;gap:10px;flex-wrap:wrap}
.wqp-wrap .wqp-btn{
  border:1px solid #cbd5e1;
  background:#fff;
  border-radius:10px;
  padding:10px 14px;
  font-size:14px;
  font-weight:600;
  color:#0f172a;
  cursor:pointer;
  transition:background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.wqp-wrap .wqp-btn:hover{background:#f8fafc;border-color:#94a3b8}
.wqp-wrap .wqp-btn:focus{outline:none;border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.18)}

.wqp-wrap .wqp-btn-primary{background:#2563eb;border-color:#2563eb;color:#fff}
.wqp-wrap .wqp-btn-primary:hover{background:#1d4ed8;border-color:#1d4ed8}
.wqp-wrap .wqp-btn-primary:focus{box-shadow:0 0 0 3px rgba(37,99,235,.30)}

.wqp-wrap .wqp-alert{padding:10px 12px;border-radius:10px;margin-bottom:12px;font-size:13px}
.wqp-wrap .wqp-alert-info{background:#eff6ff;border:1px solid #bfdbfe;color:#1e3a8a}
.wqp-wrap .wqp-alert-error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}
.wqp-wrap .wqp-alert-success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}

/* Toast-style fixed message (Sprint 0) */
.wqp-wrap .wqp-toast{position:fixed;top:12px;left:50%;transform:translateX(-50%);width:calc(100% - 24px);max-width:680px;z-index:100000;margin:0;box-shadow:0 10px 24px rgba(0,0,0,.10);cursor:pointer}

/* Loading state (Sprint 0) */
.wqp-wrap .wqp-btn:disabled{opacity:.65;cursor:not-allowed}
.wqp-wrap .wqp-loading::before{content:'';position:fixed;bottom:16px;left:16px;width:18px;height:18px;border:2px solid #d1d5db;border-top-color:#2563eb;border-radius:50%;animation:wqp-spin .9s linear infinite;z-index:100001}
@keyframes wqp-spin{to{transform:rotate(360deg)}}

/* Customer/product search dropdown */
.wqp-wrap .wqp-product-search{margin-top:16px;position:relative}
.wqp-wrap .wqp-product-search input{padding-left:40px}
.wqp-wrap .wqp-ps-results{position:absolute;top:72px;right:0;left:0;background:#fff;border:1px solid #cbd5e1;border-radius:12px;max-height:300px;overflow:auto;z-index:9999;box-shadow:0 14px 34px rgba(0,0,0,.10)}
.wqp-wrap .wqp-ps-item{padding:10px 12px;border-bottom:1px solid #eef2f7;cursor:pointer}
.wqp-wrap .wqp-ps-item:last-child{border-bottom:none}
.wqp-wrap .wqp-ps-item:hover,
.wqp-wrap .wqp-ps-item.active{background:#f1f5f9}
.wqp-wrap .wqp-ps-title{font-size:13px;font-weight:700}
.wqp-wrap .wqp-ps-meta{font-size:12px;color:#64748b;margin-top:3px}

/* Items header (+) (Pack-8A) */
.wqp-wrap .wqp-items-header{margin-top:16px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc}
.wqp-wrap .wqp-items-title{font-size:14px;font-weight:800;color:#0f172a}
.wqp-wrap .wqp-items-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wqp-wrap .wqp-btn-manual{padding:9px 12px;font-size:13px;font-weight:700;border-radius:12px}
.wqp-wrap .wqp-btn-add{width:40px;height:40px;padding:0;display:inline-flex;align-items:center;justify-content:center;font-size:20px;line-height:1;border-radius:12px}
.wqp-wrap .wqp-btn-add:hover{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.12)}
.wqp-wrap .wqp-btn-add:disabled{opacity:.55;cursor:not-allowed}

/* Sepidar-like Product Picker Modal (Pack-8A) */
.wqp-wrap .wqp-modal{position:fixed;inset:0;z-index:100005;display:none}
.wqp-wrap .wqp-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.40)}
.wqp-wrap .wqp-modal-dialog{position:relative;max-width:1040px;width:calc(100% - 24px);max-height:calc(100% - 24px);margin:12px auto;background:#fff;border:1px solid #cbd5e1;border-radius:14px;box-shadow:0 18px 44px rgba(0,0,0,.18);display:flex;flex-direction:column}
.wqp-wrap .wqp-modal-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border-bottom:1px solid #e2e8f0;background:#f8fafc;border-radius:14px 14px 0 0}
.wqp-wrap .wqp-modal-title{font-size:14px;font-weight:800;color:#0f172a}
.wqp-wrap .wqp-modal-close{border:1px solid #cbd5e1;background:#fff;border-radius:10px;width:34px;height:34px;cursor:pointer;line-height:1;font-size:18px}
.wqp-wrap .wqp-modal-close:hover{background:#f1f5f9;border-color:#94a3b8}
.wqp-wrap .wqp-modal-body{padding:12px 14px;display:flex;flex-direction:column;gap:12px;overflow:hidden}

.wqp-wrap .wqp-pp-filters{margin-bottom:2px}
.wqp-wrap .wqp-pp-results{border:1px solid #cbd5e1;border-radius:12px;overflow:auto;max-height:360px;background:#fff}
.wqp-wrap .wqp-pp-table{width:100%;border-collapse:separate;border-spacing:0;min-width:860px}
.wqp-wrap .wqp-pp-table th,
.wqp-wrap .wqp-pp-table td{border-bottom:1px solid #eef2f7;padding:9px 8px;text-align:right;vertical-align:top;font-size:13px;white-space:nowrap;color:#0f172a}
.wqp-wrap .wqp-pp-table thead th{background:#f1f5f9;font-weight:800;color:#0f172a;position:sticky;top:0;z-index:1;border-bottom:1px solid #cbd5e1}
.wqp-wrap .wqp-pp-table tbody tr:hover{background:#f8fafc}
.wqp-wrap .wqp-pp-table tbody tr.wqp-pp-selected{background:#eff6ff}
.wqp-wrap .wqp-pp-col-check{text-align:center}
.wqp-wrap .wqp-pp-check{width:16px;height:16px;cursor:pointer}
.wqp-wrap .wqp-pp-price{text-align:left;direction:ltr}
.wqp-wrap .wqp-pp-muted{font-size:12px;color:#64748b;white-space:normal}

/* UI-PACK-08A: product name visibility (wrap + tooltip) */
.wqp-wrap .wqp-pp-table td.wqp-pp-title-cell{white-space:normal;word-break:break-word}

.wqp-wrap .wqp-pp-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.wqp-wrap .wqp-pp-pagination{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.wqp-wrap .wqp-pp-pageinfo{font-size:12px;color:#334155}
.wqp-wrap .wqp-pp-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}

@media(max-width:900px){
  .wqp-wrap .wqp-pp-results{max-height:52vh}
  .wqp-wrap .wqp-pp-table{min-width:760px}
}

/* Items table */
.wqp-wrap .wqp-table-wrap{margin-top:10px;overflow:auto;border:1px solid #cbd5e1;border-radius:12px;background:#fff}
.wqp-wrap .wqp-table{width:100%;border-collapse:separate;border-spacing:0}
.wqp-wrap .wqp-table th,
.wqp-wrap .wqp-table td{border-bottom:1px solid #eef2f7;padding:10px 8px;text-align:right;vertical-align:top;font-size:13px;color:#0f172a}

/* Align item rows vertically (fix misaligned "جمع" column) */
.wqp-wrap #wqp-items tbody td{vertical-align:middle}

/* Bidi-safe: keep mixed RTL/LTR titles readable in tables */
.wqp-wrap #wqp-items td:first-child{unicode-bidi:plaintext}
.wqp-wrap .wqp-pp-table td.wqp-pp-title-cell{unicode-bidi:plaintext}
.wqp-wrap .wqp-ps-title{unicode-bidi:plaintext}

.wqp-wrap .wqp-table thead th{background:#f1f5f9;font-weight:800;color:#0f172a;border-bottom:1px solid #cbd5e1}
.wqp-wrap .wqp-table tbody tr:hover{background:#f8fafc}

.wqp-wrap .wqp-table input,
.wqp-wrap .wqp-table textarea{
  width:100%;
  border:1px solid #cbd5e1;
  border-radius:10px;
  padding:8px 10px;
  font-size:14px;
  font-weight:500;
  line-height:1.35;
  color:#0f172a;
  background:#fff;
  outline:none;
  transition:border-color .15s ease, box-shadow .15s ease;
}

.wqp-wrap .wqp-table input:hover,
.wqp-wrap .wqp-table textarea:hover{border-color:#94a3b8}

.wqp-wrap .wqp-table input:focus,
.wqp-wrap .wqp-table textarea:focus{border-color:#2563eb;box-shadow:0 0 0 3px rgba(37,99,235,.18)}

.wqp-wrap .wqp-table textarea{min-height:38px;resize:vertical}

.wqp-wrap .wqp-remove{background:#fee2e2;border:1px solid #fca5a5;color:#991b1b;border-radius:10px;padding:8px 10px;cursor:pointer}
.wqp-wrap .wqp-remove:hover{background:#fecaca}

/* Summary */
.wqp-wrap .wqp-summary{margin-top:14px;border:1px solid #cbd5e1;border-radius:12px;padding:12px;background:#f8fafc}
.wqp-wrap .wqp-summary-row{display:flex;align-items:center;justify-content:space-between;padding:7px 0;font-size:14px;color:#0f172a}
.wqp-wrap .wqp-summary-row span:first-child{font-weight:600;color:#334155}
.wqp-wrap .wqp-summary-row span:last-child{font-weight:800;color:#0f172a}
.wqp-wrap .wqp-summary-total{font-weight:900;border-top:1px dashed #cbd5e1;margin-top:8px;padding-top:12px}
.wqp-wrap .wqp-summary-total span:last-child{font-size:16px}

.wqp-wrap .wqp-public-link{margin-top:12px;font-size:13px;color:#334155}
.wqp-wrap .wqp-public-link a{word-break:break-all}

/* Cart preview (Phase 2) */
.wqp-wrap .wqp-cart-preview{margin-top:14px;border:1px solid #cbd5e1;border-radius:12px;padding:12px;background:#f8fafc}
.wqp-wrap .wqp-cart-preview .wqp-cart-title{font-size:14px;font-weight:800;margin-bottom:8px;color:#0f172a}
.wqp-wrap .wqp-cart-preview ul{margin:0;padding:0 18px 0 0}
.wqp-wrap .wqp-cart-preview li{margin:4px 0;font-size:13px;color:#0f172a}
.wqp-wrap .wqp-cart-preview .wqp-cart-meta{font-size:12px;color:#64748b;margin-top:2px}
.wqp-wrap .wqp-cart-preview .wqp-cart-actions{margin-top:10px;display:flex;gap:10px;flex-wrap:wrap}

/* Sticky bottom toolbar (Pack-8B) */
.wqp-wrap .wqp-actions-toolbar{position:sticky;bottom:0;z-index:10000;background:#fff;padding:12px 0;margin-top:16px;border-top:1px solid #cbd5e1}

/* Summary small line (Pack-8B) */
.wqp-wrap .wqp-summary-row-small{font-size:13px;color:#64748b;padding:4px 0}

/* Global discount modal (Pack-8B) */
.wqp-wrap .wqp-gd-dialog{max-width:420px}
.wqp-wrap .wqp-gd-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.wqp-wrap .wqp-gd-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:8px;flex-wrap:wrap}
@media(max-width:900px){.wqp-wrap .wqp-gd-fields{grid-template-columns:repeat(1,minmax(0,1fr))}}

/* Readonly meta block (missing styles previously) */
.wqp-wrap .wqp-readonly-meta{margin:10px 0 12px;padding:10px 12px;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc;color:#334155;font-size:13px}

/* Numeric inputs: force LTR for readability in RTL UI */
.wqp-wrap .wqp-num{direction:ltr;text-align:left}

/* VAT toggle (Pack-09H) */
.wqp-wrap .wqp-vat-toggle-label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.wqp-wrap .wqp-vat-toggle-label input[type="checkbox"]{width:16px;height:16px;margin:0}
.wqp-wrap .wqp-vat-toggle-label span{unicode-bidi:plaintext}
