/* ==========================================================================
   WP Inventory POS — UI Design System
   Modelled on the Real Estate Platform Pro design language:
   · CSS custom properties for all tokens
   · rp-style KPI cards, tables, badges, buttons, forms, modals, toasts
   · Zero emoji in UI chrome; SVG icons only
   · Fully scoped under .wpip-app so frontend themes don't interfere
   ========================================================================== */

:root {
  --wpip-primary:       #1A3FD4;
  --wpip-primary-d:     #1228A0;
  --wpip-primary-l:     #EEF3FF;
  --wpip-primary-mid:   #4A7BF7;
  --wpip-accent:        #F59E0B;
  --wpip-sidebar-bg:    #0D1B40;
  --wpip-sidebar-w:     248px;
  --wpip-sidebar-w-sm:  68px;
  --wpip-sidebar-text:  #94A8CC;
  --wpip-topbar-h:      60px;
  --wpip-radius:        12px;
  --wpip-radius-sm:     8px;
  --wpip-shadow:        0 1px 4px rgba(0,0,0,.07),0 4px 16px rgba(0,0,0,.05);
  --wpip-shadow-md:     0 4px 24px rgba(0,0,0,.1);
  --wpip-shadow-lg:     0 12px 48px rgba(0,0,0,.16);
  --wpip-border:        #E5EAF2;
  --wpip-bg:            #F2F5FB;
  --wpip-text:          #111827;
  --wpip-text-2:        #374151;
  --wpip-muted:         #6B7280;
  --wpip-success:       #059669;
  --wpip-success-bg:    #ECFDF5;
  --wpip-danger:        #DC2626;
  --wpip-danger-bg:     #FEF2F2;
  --wpip-warning:       #D97706;
  --wpip-warning-bg:    #FFFBEB;
  --wpip-info:          #2563EB;
  --wpip-info-bg:       #EFF6FF;
  --wpip-overlay:       rgba(13,27,64,.55);
  --wpip-transition:    .22s cubic-bezier(.4,0,.2,1);
}

/* ── Reset ── */
.wpip-app *, .wpip-modal-v2 * { box-sizing: border-box; font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Segoe UI', Roboto, sans-serif; }
.wpip-app a { color: inherit; }

/* ════════════════════════════════════════════════════════════
   DASHBOARD SHELL  (consolidated shortcode container)
   ════════════════════════════════════════════════════════════ */
.wpip-app.wpip-dash-wrap {
  display: flex;
  min-height: 100vh;
  background: var(--wpip-bg);
  color: var(--wpip-text);
  font-size: 14px;
  line-height: 1.5;
}

/* ── Sidebar ── */
.wpip-app .wpip-dash-sidebar {
  width: var(--wpip-sidebar-w);
  background: var(--wpip-sidebar-bg);
  display: flex;
  flex-direction: column;
  height: 100vh;
  position: sticky;
  top: 0;
  flex-shrink: 0;
  overflow: hidden;
  z-index: 100;
  transition: width var(--wpip-transition);
}
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-sidebar { width: var(--wpip-sidebar-w-sm); }

/* Brand */
.wpip-app .wpip-dash-brand {
  display: flex; align-items: center; gap: 10px;
  padding: 18px 14px 16px; border-bottom: 1px solid rgba(255,255,255,.06);
  min-height: 66px; overflow: hidden;
}
.wpip-app .wpip-dash-brand-circle {
  width: 36px; height: 36px; border-radius: 9px;
  background: linear-gradient(135deg,var(--wpip-primary),var(--wpip-primary-mid));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 13px; flex-shrink: 0;
}
.wpip-app .wpip-dash-brand-logo { width: 36px; height: 36px; object-fit: contain; border-radius: 9px; flex-shrink: 0; }
.wpip-app .wpip-dash-brand-name { color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap; flex: 1; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-brand-name { display: none; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-brand { justify-content: center; padding: 15px 8px; }

/* Toggle */
.wpip-app #wpip-sidebar-toggle {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; flex-shrink: 0;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  border-radius: 7px; cursor: pointer; color: #fff;
  transition: background var(--wpip-transition);
}
.wpip-app #wpip-sidebar-toggle:hover { background: rgba(255,255,255,.16); }
.wpip-app .wpip-toggle-icon { width: 16px; height: 16px; display: block; transition: transform var(--wpip-transition); }
.wpip-app.wpip-sidebar-is-collapsed .wpip-toggle-icon { transform: rotate(180deg); }

/* Nav */
.wpip-app .wpip-dash-nav { flex: 1; padding: 10px 8px; overflow-y: auto; overflow-x: hidden; }
.wpip-app .wpip-dash-nav::-webkit-scrollbar { width: 3px; }
.wpip-app .wpip-dash-nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.08); border-radius: 2px; }

.wpip-app .wpip-dash-nav-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 10px; border-radius: 9px; cursor: pointer;
  color: var(--wpip-sidebar-text); font-size: 13.5px; font-weight: 500;
  white-space: nowrap; overflow: hidden; user-select: none;
  margin-bottom: 2px; position: relative;
  transition: background var(--wpip-transition), color var(--wpip-transition);
}
.wpip-app .wpip-dash-nav-item:hover { background: rgba(255,255,255,.06); color: #fff; }
.wpip-app .wpip-dash-nav-item.active { background: rgba(74,123,247,.20); color: #fff; }
.wpip-app .wpip-dash-nav-item.active::before {
  content: ''; position: absolute; left: 0; top: 20%; height: 60%;
  width: 3px; background: var(--wpip-primary-mid); border-radius: 0 3px 3px 0;
}
.wpip-app .wpip-dash-nav-icon { flex-shrink: 0; width: 20px; display: flex; align-items: center; justify-content: center; }
.wpip-app .wpip-dash-nav-icon svg { width: 17px; height: 17px; stroke: currentColor; }
.wpip-app .wpip-dash-nav-label { overflow: hidden; text-overflow: ellipsis; flex: 1; }

/* Collapsed nav */
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-nav-item { padding: 11px; justify-content: center; gap: 0; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-nav-label { display: none; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-nav-item::before { display: none; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-nav-item[title]:hover::after {
  content: attr(title);
  position: fixed;
  left: calc(var(--wpip-sidebar-w-sm) + 10px);
  top: var(--tt-top, 50%);
  transform: translateY(-50%);
  background: #1a2545; color: #fff;
  padding: 5px 11px; border-radius: 7px;
  font-size: 12px; white-space: nowrap; pointer-events: none; z-index: 99999;
  box-shadow: 0 4px 16px rgba(0,0,0,.2);
}

/* Footer */
.wpip-app .wpip-dash-sidebar-foot {
  display: flex; align-items: center; gap: 10px; padding: 14px;
  border-top: 1px solid rgba(255,255,255,.06); overflow: hidden;
}
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-sidebar-foot { justify-content: center; padding: 10px 8px; }
.wpip-app .wpip-dash-foot-avatar {
  width: 34px; height: 34px; border-radius: 50%;
  background: linear-gradient(135deg,var(--wpip-primary),var(--wpip-primary-mid));
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; flex-shrink: 0; overflow: hidden;
}
.wpip-app .wpip-dash-foot-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wpip-app .wpip-dash-foot-meta { flex: 1; overflow: hidden; }
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-foot-meta,
.wpip-app.wpip-sidebar-is-collapsed .wpip-dash-foot-logout { display: none; }
.wpip-app .wpip-dash-foot-name { color: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wpip-app .wpip-dash-foot-role { color: var(--wpip-sidebar-text); font-size: 11px; margin-top: 1px; }
.wpip-app .wpip-dash-foot-logout {
  color: var(--wpip-sidebar-text); text-decoration: none;
  display: flex; padding: 6px; border-radius: 7px;
  transition: background var(--wpip-transition), color var(--wpip-transition);
}
.wpip-app .wpip-dash-foot-logout:hover { background: rgba(220,38,38,.25); color: #fca5a5; }
.wpip-app .wpip-dash-foot-logout svg { width: 16px; height: 16px; }

/* Main */
.wpip-app .wpip-dash-main { flex: 1; display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; }
.wpip-app .wpip-dash-topbar {
  height: var(--wpip-topbar-h); background: #fff;
  border-bottom: 1px solid var(--wpip-border);
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 24px; gap: 16px; position: sticky; top: 0; z-index: 50;
  flex-shrink: 0;
}
.wpip-app .wpip-dash-page-title { font-size: 16px; font-weight: 700; margin: 0; color: var(--wpip-text); }
.wpip-app .wpip-dash-topbar-right { display: flex; align-items: center; gap: 10px; }
.wpip-app .wpip-dash-role-chip {
  background: var(--wpip-primary-l); color: var(--wpip-primary);
  border-radius: 20px; padding: 3px 12px; font-size: 11.5px; font-weight: 600;
}
.wpip-app .wpip-mobile-menu-btn {
  display: none; align-items: center; justify-content: center;
  width: 36px; height: 36px; border-radius: 8px;
  background: none; border: none; cursor: pointer; color: var(--wpip-text);
}
.wpip-app .wpip-mobile-menu-btn svg { width: 20px; height: 20px; }
.wpip-app .wpip-dash-content { flex: 1; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 24px; }

/* ════════════════════════════════════════════════════════════
   CONTENT AREA COMPONENTS
   All scoped under .wpip-app or .wpip-dash-content
   ════════════════════════════════════════════════════════════ */

/* Page header */
.wpip-app .wpip-page-header {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 12px; margin-bottom: 22px;
}
.wpip-app .wpip-page-header-left { flex: 1; min-width: 0; }
.wpip-app .wpip-page-title { font-size: 20px; font-weight: 700; color: var(--wpip-text); margin: 0 0 3px; display: flex; align-items: center; gap: 10px; }
.wpip-app .wpip-page-icon { font-size: 22px; }
.wpip-app .wpip-page-subtitle { color: var(--wpip-muted); font-size: 13px; margin: 0; }
.wpip-app .wpip-header-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* KPI cards */
.wpip-app .wpip-stat-cards, .wpip-app .rp-kpi-grid {
  display: grid; grid-template-columns: repeat(auto-fill,minmax(170px,1fr)); gap: 14px; margin-bottom: 22px;
}
.wpip-app .wpip-stat-card, .wpip-app .rp-kpi-card {
  background: #fff; border: 1px solid var(--wpip-border);
  border-radius: var(--wpip-radius); padding: 18px 16px;
  display: flex; align-items: center; gap: 14px;
  box-shadow: var(--wpip-shadow); transition: box-shadow var(--wpip-transition), transform var(--wpip-transition);
}
.wpip-app .wpip-stat-card:hover, .wpip-app .rp-kpi-card:hover { box-shadow: var(--wpip-shadow-md); transform: translateY(-1px); }
.wpip-app .wpip-kpi-icon {
  width: 46px; height: 46px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  background: var(--wpip-primary-l); color: var(--wpip-primary);
}
.wpip-app .wpip-kpi-icon svg { width: 22px; height: 22px; }
.wpip-app .wpip-stat-card-label, .wpip-app .rp-kpi-label { font-size: 11.5px; color: var(--wpip-muted); margin-top: 1px; }
.wpip-app .wpip-stat-card-value, .wpip-app .rp-kpi-value { font-size: 21px; font-weight: 800; color: var(--wpip-text); line-height: 1.15; }
.wpip-app .wpip-stat-card--danger .wpip-stat-card-value { color: var(--wpip-danger); }
.wpip-app .wpip-stat-card--success .wpip-stat-card-value { color: var(--wpip-success); }

/* Section card */
.wpip-app .wpip-card, .wpip-app .rp-section {
  background: #fff; border: 1px solid var(--wpip-border);
  border-radius: var(--wpip-radius); margin-bottom: 16px;
  box-shadow: var(--wpip-shadow);
}
.wpip-app .wpip-card { padding: 0; overflow: hidden; }
.wpip-app .rp-section { padding: 20px; }
.wpip-app .rp-section-title { font-size: 15px; font-weight: 700; margin: 0 0 16px; color: var(--wpip-text); display: flex; align-items: center; gap: 8px; }

/* Table */
.wpip-app .wpip-table, .wpip-app .rp-table {
  width: 100%; border-collapse: collapse; font-size: 13.5px;
  background: #fff; border-radius: var(--wpip-radius); overflow: hidden;
}
.wpip-app .wpip-table th, .wpip-app .rp-table thead th {
  background: #F8FAFD; color: var(--wpip-muted);
  font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px;
  padding: 10px 16px; text-align: left; border-bottom: 1px solid var(--wpip-border); white-space: nowrap;
}
.wpip-app .wpip-table td, .wpip-app .rp-table tbody td {
  padding: 13px 16px; border-bottom: 1px solid var(--wpip-border); vertical-align: middle; color: var(--wpip-text-2);
}
.wpip-app .wpip-table tr:last-child td, .wpip-app .rp-table tbody tr:last-child td { border-bottom: none; }
.wpip-app .wpip-table tr:hover td, .wpip-app .rp-table tbody tr:hover td { background: #F8FAFD; }
.wpip-app .wpip-table code { background: #F3F4F6; padding: 2px 6px; border-radius: 4px; font-size: 11px; }

/* Badges */
.wpip-app .wpip-badge, .wpip-app .rp-badge {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 20px;
  font-size: 11px; font-weight: 700; white-space: nowrap; letter-spacing: .2px;
}
.wpip-app .wpip-badge-success,  .wpip-app .rp-badge-success  { background: var(--wpip-success-bg); color: var(--wpip-success); }
.wpip-app .wpip-badge-danger,   .wpip-app .rp-badge-danger   { background: var(--wpip-danger-bg);  color: var(--wpip-danger); }
.wpip-app .wpip-badge-warning,  .wpip-app .rp-badge-warning  { background: var(--wpip-warning-bg); color: var(--wpip-warning); }
.wpip-app .wpip-badge-info,     .wpip-app .rp-badge-info     { background: var(--wpip-info-bg);    color: var(--wpip-info); }
.wpip-app .wpip-badge-neutral   { background: #F3F4F6; color: var(--wpip-text-2); }

/* Buttons */
.wpip-app .wpip-btn, .wpip-app .rp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 16px; border-radius: 8px; font-size: 13px; font-weight: 600;
  cursor: pointer; text-decoration: none;
  border: 1.5px solid var(--wpip-border); background: #fff; color: var(--wpip-text);
  line-height: 1.35; transition: all var(--wpip-transition);
  white-space: nowrap; font-family: inherit;
}
.wpip-app .wpip-btn svg, .wpip-app .rp-btn svg { width: 15px; height: 15px; flex-shrink: 0; }
.wpip-app .wpip-btn:hover, .wpip-app .rp-btn:hover { background: #F3F6FD; border-color: #C5D0E6; }
.wpip-app .wpip-btn-primary, .wpip-app .rp-btn-primary { background: var(--wpip-primary); color: #fff !important; border-color: var(--wpip-primary); }
.wpip-app .wpip-btn-primary:hover, .wpip-app .rp-btn-primary:hover { background: var(--wpip-primary-d); border-color: var(--wpip-primary-d); }
.wpip-app .wpip-btn-danger, .wpip-app .rp-btn-danger { background: var(--wpip-danger); color: #fff; border-color: var(--wpip-danger); }
.wpip-app .wpip-btn-sm, .wpip-app .rp-btn-sm { padding: 5px 11px; font-size: 12px; border-radius: 6px; }
.wpip-app .wpip-btn:disabled, .wpip-app .rp-btn:disabled { opacity: .5; cursor: not-allowed; }

/* WP native button overrides inside wpip-app */
.wpip-app .button { border-radius: 8px !important; font-family: inherit !important; font-size: 13px !important; font-weight: 600 !important; }
.wpip-app .button-primary { background: var(--wpip-primary) !important; border-color: var(--wpip-primary) !important; color: #fff !important; }
.wpip-app .button-primary:hover { background: var(--wpip-primary-d) !important; }
.wpip-app .button-small { padding: 4px 10px !important; font-size: 12px !important; }

/* ════════════════════════════════════════════════════════════
   FORMS — Real Estate style
   ════════════════════════════════════════════════════════════ */
.wpip-app .rp-form-group { display: flex; flex-direction: column; gap: 5px; flex: 1; min-width: 0; }
.wpip-app .rp-form-group label { font-size: 11.5px; font-weight: 600; color: var(--wpip-muted); text-transform: uppercase; letter-spacing: .4px; }
.wpip-app .rp-form-group small { font-size: 11px; color: var(--wpip-muted); margin-top: 1px; }
.wpip-app .rp-form-group input,
.wpip-app .rp-form-group select,
.wpip-app .rp-form-group textarea {
  width: 100%; padding: 9px 12px;
  border: 1.5px solid var(--wpip-border); border-radius: 8px;
  font-size: 13.5px; color: var(--wpip-text); background: #fff;
  outline: none; font-family: inherit;
  transition: border-color var(--wpip-transition), box-shadow var(--wpip-transition);
}
.wpip-app .rp-form-group input:focus,
.wpip-app .rp-form-group select:focus,
.wpip-app .rp-form-group textarea:focus {
  border-color: var(--wpip-primary); box-shadow: 0 0 0 3px rgba(26,63,212,.1);
}
.wpip-app .rp-form-row { display: flex; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.wpip-app .rp-form-row .rp-form-group { min-width: 120px; }

/* Image upload zone — matching Real Estate gallery upload */
.wpip-app .wpip-upload-zone {
  border: 2px dashed var(--wpip-border); border-radius: 10px;
  padding: 30px 20px; text-align: center; cursor: pointer;
  transition: border-color var(--wpip-transition), background var(--wpip-transition);
  background: #FAFBFD; position: relative;
}
.wpip-app .wpip-upload-zone:hover,
.wpip-app .wpip-upload-zone.drag-over { border-color: var(--wpip-primary); background: var(--wpip-primary-l); }
.wpip-app .wpip-upload-zone input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.wpip-app .wpip-upload-zone-icon { width: 48px; height: 48px; margin: 0 auto 12px; color: var(--wpip-muted); }
.wpip-app .wpip-upload-zone-icon svg { width: 48px; height: 48px; }
.wpip-app .wpip-upload-zone p { margin: 0; font-size: 13.5px; color: var(--wpip-muted); }
.wpip-app .wpip-upload-zone span { color: var(--wpip-primary); font-weight: 600; }

.wpip-app .wpip-img-preview {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px;
}
.wpip-app .wpip-img-thumb {
  position: relative; width: 80px; height: 80px;
  border-radius: 8px; overflow: hidden; border: 2px solid var(--wpip-border);
  background: var(--wpip-bg);
}
.wpip-app .wpip-img-thumb.featured { border-color: var(--wpip-primary); }
.wpip-app .wpip-img-thumb img { width: 100%; height: 100%; object-fit: cover; }
.wpip-app .wpip-img-thumb-remove {
  position: absolute; top: 2px; right: 2px;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--wpip-danger); color: #fff; border: none;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  font-size: 12px; line-height: 1; padding: 0;
}
.wpip-app .wpip-img-thumb-label {
  position: absolute; bottom: 0; left: 0; right: 0;
  background: rgba(0,0,0,.55); color: #fff; font-size: 9px;
  font-weight: 600; text-align: center; padding: 2px; text-transform: uppercase;
}
.wpip-app .wpip-featured-img-large {
  width: 100%; height: 180px; border-radius: 10px; overflow: hidden;
  border: 2px solid var(--wpip-border); margin-bottom: 8px; background: var(--wpip-bg);
  display: flex; align-items: center; justify-content: center; position: relative;
}
.wpip-app .wpip-featured-img-large img { width: 100%; height: 100%; object-fit: cover; }

/* ════════════════════════════════════════════════════════════
   MODAL v2 — Real Estate style with header/body/footer
   ════════════════════════════════════════════════════════════ */
.wpip-modal-v2 {
  position: fixed; inset: 0; z-index: 200000;
  display: none; align-items: center; justify-content: center;
  padding: 20px; background: var(--wpip-overlay); backdrop-filter: blur(4px);
}
.wpip-modal-v2.open { display: flex; }
.wpip-modal-v2-content {
  background: #fff; border-radius: 16px;
  width: 100%; max-width: 640px; max-height: 90vh;
  display: flex; flex-direction: column;
  box-shadow: var(--wpip-shadow-lg); animation: wpip-modal-v2-in .22s ease;
}
.wpip-modal-v2-lg .wpip-modal-v2-content { max-width: 900px; }
.wpip-modal-v2-sm .wpip-modal-v2-content { max-width: 440px; }
@keyframes wpip-modal-v2-in { from { opacity:0; transform:scale(.96) translateY(12px); } to { opacity:1; transform:none; } }
.wpip-modal-v2-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 22px; border-bottom: 1px solid var(--wpip-border); flex-shrink: 0;
}
.wpip-modal-v2-header h3 { margin: 0; font-size: 16px; font-weight: 700; color: var(--wpip-text); }
.wpip-modal-v2-close {
  display: flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; background: none; border: none;
  cursor: pointer; border-radius: 7px; color: var(--wpip-muted);
  transition: background var(--wpip-transition);
}
.wpip-modal-v2-close:hover { background: var(--wpip-danger-bg); color: var(--wpip-danger); }
.wpip-modal-v2-close svg { width: 18px; height: 18px; }
.wpip-modal-v2-body { padding: 22px; overflow-y: auto; flex: 1; }
.wpip-modal-v2-footer {
  padding: 14px 22px; border-top: 1px solid var(--wpip-border);
  display: flex; justify-content: flex-end; gap: 10px; flex-shrink: 0;
}
.wpip-modal-v2-notice {
  padding: 10px 14px; border-radius: 8px; margin-bottom: 14px;
  font-size: 13px; display: none;
}
.wpip-modal-v2-notice.error   { background: var(--wpip-danger-bg);  color: #991B1B; display: flex; }
.wpip-modal-v2-notice.success { background: var(--wpip-success-bg); color: #065F46; display: flex; }

/* ── Sub-tabs (e.g. PO detail: Items / Payments / Timeline) ─────── */
.wpip-subtab-btn {
  background: none; border: none; border-bottom: 2px solid transparent;
  padding: 8px 14px; font-size: 13px; font-weight: 600; color: var(--wpip-muted);
  cursor: pointer; transition: color var(--wpip-transition), border-color var(--wpip-transition);
}
.wpip-subtab-btn:hover  { color: var(--wpip-text); }
.wpip-subtab-btn.active { color: var(--wpip-primary); border-bottom-color: var(--wpip-primary); }

/* ── Simple vertical audit timeline ──────────────────────────────── */
.wpip-timeline { position: relative; padding-left: 20px; }
.wpip-timeline-item {
  position: relative; padding-bottom: 16px; padding-left: 12px;
  border-left: 2px solid var(--wpip-border); font-size: 13px;
}
.wpip-timeline-item:last-child { border-left-color: transparent; padding-bottom: 0; }
.wpip-timeline-dot {
  position: absolute; left: -7px; top: 2px;
  width: 12px; height: 12px; border-radius: 50%;
  background: var(--wpip-primary); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--wpip-border);
}

/* ════════════════════════════════════════════════════════════
   TOAST NOTIFICATIONS
   ════════════════════════════════════════════════════════════ */
#wpip-toast-container {
  position: fixed; bottom: 24px; right: 24px; z-index: 299999;
  display: flex; flex-direction: column; gap: 8px; pointer-events: none;
}
.wpip-toast {
  display: flex; align-items: center; gap: 10px;
  padding: 13px 18px; border-radius: 11px;
  font-size: 13.5px; font-weight: 500; min-width: 260px;
  box-shadow: var(--wpip-shadow-md); animation: wpip-toast-in .25s ease;
  color: #fff; pointer-events: all;
}
.wpip-toast svg { width: 18px; height: 18px; flex-shrink: 0; }
@keyframes wpip-toast-in { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.wpip-toast-success { background: #059669; }
.wpip-toast-error   { background: #DC2626; }
.wpip-toast-info    { background: var(--wpip-primary); }
.wpip-toast-warning { background: var(--wpip-warning); }

/* ════════════════════════════════════════════════════════════
   NOTICES
   ════════════════════════════════════════════════════════════ */
.wpip-app .rp-notice, .wpip-app .wpip-notice-v2 {
  display: flex; align-items: flex-start; gap: 12px;
  padding: 13px 16px; border-radius: 8px;
  font-size: 13.5px; margin-bottom: 16px; line-height: 1.55;
  border: 1px solid transparent;
}
.wpip-app .rp-notice-success, .wpip-app .wpip-notice-v2.success { background: var(--wpip-success-bg); color: #065F46; border-color: #A7F3D0; }
.wpip-app .rp-notice-error,   .wpip-app .wpip-notice-v2.error   { background: var(--wpip-danger-bg);  color: #991B1B; border-color: #FECACA; }
.wpip-app .rp-notice-warning, .wpip-app .wpip-notice-v2.warning { background: var(--wpip-warning-bg); color: #92400E; border-color: #FDE68A; }
.wpip-app .rp-notice-info,    .wpip-app .wpip-notice-v2.info    { background: var(--wpip-info-bg);    color: #1E40AF; border-color: #BFDBFE; }

/* Empty state */
.wpip-app .wpip-empty {
  display: flex; flex-direction: column; align-items: center;
  justify-content: center; text-align: center; padding: 60px 20px; color: var(--wpip-muted);
}
.wpip-app .wpip-empty-icon {
  width: 72px; height: 72px; border-radius: 20px;
  background: var(--wpip-primary-l); color: var(--wpip-primary);
  display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
}
.wpip-app .wpip-empty-icon svg { width: 34px; height: 34px; }
.wpip-app .wpip-empty h4 { margin: 0 0 6px; font-size: 17px; color: var(--wpip-text); font-weight: 700; }
.wpip-app .wpip-empty p  { margin: 0 0 20px; font-size: 13.5px; }

/* Skeleton */
@keyframes wpip-shimmer { 0% { background-position:-800px 0; } 100% { background-position:800px 0; } }
.wpip-skel {
  background: linear-gradient(90deg,#e8edf5 25%,#f4f7fb 50%,#e8edf5 75%);
  background-size: 800px 100%; animation: wpip-shimmer 1.6s infinite linear;
  border-radius: 8px;
}
.wpip-skel-kpi   { height: 98px; border-radius: 12px; }
.wpip-skel-table { height: 240px; border-radius: 12px; }
.wpip-skel-cards { display: grid; grid-template-columns: repeat(auto-fill,minmax(165px,1fr)); gap: 14px; margin-bottom: 20px; }

/* Loading */
.wpip-app .wpip-loading { display: flex; align-items: center; justify-content: center; padding: 48px; color: var(--wpip-muted); }
.wpip-app .wpip-spinner {
  width: 28px; height: 28px; border-radius: 50%;
  border: 3px solid var(--wpip-border); border-top-color: var(--wpip-primary);
  animation: wpip-spin .7s linear infinite;
}
@keyframes wpip-spin { to { transform:rotate(360deg); } }

/* Form elements */
.wpip-app input[type=text], .wpip-app input[type=number], .wpip-app input[type=email],
.wpip-app input[type=password], .wpip-app input[type=date], .wpip-app textarea, .wpip-app select {
  border: 1.5px solid var(--wpip-border); border-radius: 8px;
  padding: 9px 12px; font-size: 13.5px; color: var(--wpip-text);
  background: #fff; outline: none; font-family: inherit;
  transition: border-color var(--wpip-transition), box-shadow var(--wpip-transition);
}
.wpip-app input:focus, .wpip-app textarea:focus, .wpip-app select:focus {
  border-color: var(--wpip-primary); box-shadow: 0 0 0 3px rgba(26,63,212,.1);
}
.wpip-app .regular-text { width: 280px; max-width: 100%; }
.wpip-app .large-text   { width: 100%; }
.wpip-app .small-text   { width: 80px; }

/* form-table compat */
.wpip-app .form-table { border-collapse: collapse; width: 100%; }
.wpip-app .form-table th { width: 180px; padding: 10px 16px 10px 0; font-weight: 600; color: var(--wpip-text-2); font-size: 13px; vertical-align: top; padding-top: 12px; }
.wpip-app .form-table td { padding: 8px 0; vertical-align: top; }
.wpip-app .description  { font-size: 11px; color: var(--wpip-muted); margin-top: 4px; }

/* ════════════════════════════════════════════════════════════
   POS TERMINAL
   ════════════════════════════════════════════════════════════ */
.wpip-pos-wrap {
  display: grid; grid-template-columns: 1fr 360px;
  height: 100%; background: #0F172A; border-radius: 10px; overflow: hidden;
}
.wpip-pos-consolidated { height: calc(100vh - 120px); min-height: 500px; }

.wpip-pos-products-col { display: flex; flex-direction: column; background: #1E293B; overflow: hidden; }
.wpip-pos-topbar {
  padding: 12px 16px; background: #0F172A;
  display: flex; gap: 10px; align-items: center;
  border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0;
}
.wpip-pos-topbar input[type=text] {
  flex: 1; background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15); border-radius: 8px;
  color: #fff; padding: 8px 14px; font-size: 14px;
}
.wpip-pos-topbar input::placeholder { color: rgba(255,255,255,.4); }
.wpip-pos-topbar select {
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.15);
  border-radius: 8px; color: #fff; padding: 8px 10px; font-size: 13px;
}
.wpip-pos-grid {
  flex: 1; overflow-y: auto; padding: 14px;
  display: grid; grid-template-columns: repeat(auto-fill,minmax(140px,1fr));
  gap: 12px; align-content: start;
}
.wpip-pos-product-card {
  background: #293548; border-radius: 10px; padding: 14px;
  cursor: pointer; text-align: center;
  border: 2px solid transparent; transition: border .14s, background .14s;
  display: flex; flex-direction: column; gap: 6px;
  position: relative;
}
.wpip-pos-product-card:hover { border-color: #3B82F6; background: #304060; }
.wpip-pos-product-card.out   { opacity: .45; cursor: not-allowed; }
.pcard-exp-badge {
  position: absolute; top: 6px; right: 6px;
  font-size: 9px; font-weight: 700; letter-spacing: .3px;
  padding: 2px 6px; border-radius: 20px; text-transform: uppercase;
  z-index: 1;
}
.pcard-exp-badge.exp-danger  { background: #EF4444; color: #fff; }
.pcard-exp-badge.exp-warning { background: #F5A623; color: #1E1608; }
.wpip-pos-product-card .pcard-img {
  width: 56px; height: 56px; border-radius: 8px;
  background: rgba(255,255,255,.08); margin: 0 auto;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
}
.wpip-pos-product-card .pcard-img img { width: 100%; height: 100%; object-fit: cover; }
.wpip-pos-product-card .pcard-img svg { width: 28px; height: 28px; color: rgba(255,255,255,.25); }
.wpip-pos-product-card .name { font-size: 12px; font-weight: 600; color: #E2E8F0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wpip-pos-product-card .price { font-size: 14px; color: #3B82F6; font-weight: 700; }
.wpip-pos-product-card .stock { font-size: 11px; color: #64748B; }

/* Cart */
.wpip-pos-cart-col { display: flex; flex-direction: column; background: #1E293B; border-left: 1px solid rgba(255,255,255,.08); }
.wpip-pos-cart-header {
  padding: 14px 16px; font-size: 13px; font-weight: 700;
  color: #94A3B8; text-transform: uppercase; letter-spacing: .5px;
  border-bottom: 1px solid rgba(255,255,255,.08); flex-shrink: 0;
  display: flex; justify-content: space-between; align-items: center;
}
.wpip-pos-cart-items { flex: 1; overflow-y: auto; }
.wpip-pos-cart-item {
  padding: 10px 16px; display: flex; align-items: center;
  gap: 10px; border-bottom: 1px solid rgba(255,255,255,.05);
}
.wpip-pos-cart-item .ci-name { flex: 1; font-size: 13px; color: #E2E8F0; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wpip-pos-cart-item .ci-qty  { display: flex; align-items: center; gap: 6px; }
.wpip-pos-cart-item .ci-qty button { width: 24px; height: 24px; border-radius: 6px; background: rgba(255,255,255,.1); border: none; color: #fff; cursor: pointer; font-size: 14px; }
.wpip-pos-cart-item .ci-qty span  { font-size: 14px; font-weight: 600; color: #fff; min-width: 24px; text-align: center; }
.wpip-pos-cart-item .ci-total  { font-size: 13px; font-weight: 600; color: #3B82F6; min-width: 70px; text-align: right; }
.wpip-pos-cart-item .ci-remove { background: none; border: none; color: #EF4444; cursor: pointer; font-size: 16px; }
.wpip-pos-cart-empty { padding: 40px 16px; text-align: center; color: #475569; font-size: 13px; }
.wpip-pos-cart-totals { padding: 14px 16px; border-top: 1px solid rgba(255,255,255,.08); }
.wpip-pos-cart-totals .row { display: flex; justify-content: space-between; font-size: 13px; color: #94A3B8; margin-bottom: 6px; }
.wpip-pos-cart-totals .row.total { font-size: 17px; font-weight: 700; color: #fff; margin-top: 8px; }
.wpip-pos-cart-actions { padding: 12px 16px; border-top: 1px solid rgba(255,255,255,.08); display: grid; grid-template-columns: 1fr 1fr; gap: 8px; flex-shrink: 0; }
.wpip-pos-btn { padding: 11px; border-radius: 8px; border: none; font-weight: 600; font-size: 13px; cursor: pointer; }
.wpip-pos-btn-primary  { background: #3B82F6; color: #fff; }
.wpip-pos-btn-outline  { background: transparent; border: 1px solid rgba(255,255,255,.2); color: #fff; }
.wpip-pos-btn-full     { grid-column: 1/-1; }

/* ════════════════════════════════════════════════════════════
   PROFILE PAGE
   ════════════════════════════════════════════════════════════ */
.wpip-profile-avatar-wrap {
  display: flex; align-items: center; gap: 20px; margin-bottom: 24px;
  padding: 20px; background: var(--wpip-primary-l); border-radius: 12px;
}
.wpip-profile-avatar {
  width: 80px; height: 80px; border-radius: 50%;
  border: 3px solid var(--wpip-primary); overflow: hidden; flex-shrink: 0;
  background: var(--wpip-primary); display: flex; align-items: center;
  justify-content: center; font-size: 28px; font-weight: 700; color: #fff;
}
.wpip-profile-avatar img { width: 100%; height: 100%; object-fit: cover; }
.wpip-profile-avatar-info h3 { margin: 0 0 4px; font-size: 18px; font-weight: 700; }
.wpip-profile-avatar-info p  { margin: 0; font-size: 13px; color: var(--wpip-muted); }

/* ════════════════════════════════════════════════════════════
   AUDIT LOG PAGE
   ════════════════════════════════════════════════════════════ */
.wpip-log-action { font-family: monospace; font-size: 12px; background: #F3F4F6; padding: 2px 8px; border-radius: 4px; }
.wpip-log-action.sale    { background: #D1FAE5; color: #065F46; }
.wpip-log-action.product { background: #DBEAFE; color: #1E40AF; }
.wpip-log-action.inventory { background: #FEF3C7; color: #92400E; }
.wpip-log-action.user    { background: #F3E8FF; color: #6B21A8; }
.wpip-log-action.order   { background: #D1FAE5; color: #065F46; }

/* ════════════════════════════════════════════════════════════
   MOBILE — full responsive
   ════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .wpip-app.wpip-dash-wrap { flex-direction: column; height: auto; min-height: 100vh; }
  .wpip-app .wpip-dash-sidebar {
    position: fixed; left: -100%; top: 0; height: 100vh; z-index: 9999;
    width: var(--wpip-sidebar-w) !important;
    transition: left var(--wpip-transition), box-shadow var(--wpip-transition);
  }
  .wpip-app .wpip-dash-sidebar.wpip-mobile-open {
    left: 0; box-shadow: 0 0 0 100vw rgba(0,0,0,.45);
  }
  .wpip-app .wpip-mobile-menu-btn { display: flex !important; }
  .wpip-app .wpip-dash-main { height: auto; overflow: visible; }
  .wpip-app .wpip-dash-content { padding: 16px; overflow: visible; }
  .wpip-app .wpip-dash-topbar { padding: 0 16px; position: sticky; top: 0; }
  .wpip-app .wpip-stat-cards, .wpip-app .rp-kpi-grid { grid-template-columns: repeat(2,1fr); gap: 10px; }
  .wpip-app .rp-form-row { flex-direction: column; gap: 10px; }
  .wpip-app .form-table th, .wpip-app .form-table td { display: block; width: 100%; }
  .wpip-app .form-table th { padding-top: 8px; padding-bottom: 2px; }
  .wpip-app .regular-text { width: 100%; }

  /* POS mobile — stack vertically */
  .wpip-pos-wrap {
    grid-template-columns: 1fr;
    grid-template-rows: 1fr auto;
    height: 100vh;
  }
  .wpip-pos-consolidated { height: 100vh; border-radius: 0; }
  .wpip-pos-cart-col {
    max-height: 45vh; border-left: none;
    border-top: 1px solid rgba(255,255,255,.08);
  }
  .wpip-pos-grid { grid-template-columns: repeat(auto-fill,minmax(110px,1fr)); }
  .wpip-pos-cart-actions { grid-template-columns: 1fr 2fr; }
  .wpip-pos-topbar { flex-wrap: wrap; row-gap: 8px; }
  .wpip-pos-topbar input[type=text] { flex: 1 1 100%; }
  .wpip-pos-topbar select { flex: 1 1 auto; min-width: 0; }
  #pos-display-link-btn { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 480px) {
  .wpip-app .wpip-stat-cards { grid-template-columns: 1fr 1fr; }
  .wpip-pos-grid { grid-template-columns: repeat(2,1fr); }
  .wpip-pos-product-card { padding: 10px; }
}

/* Explicit color override so text is always readable in both light and dark themes */
.wpip-pos-wrap input[type=text],
.wpip-pos-wrap input[type=number],
.wpip-pos-wrap input[type=email],
.wpip-pos-wrap input[type=password],
.wpip-pos-wrap select {
    color: #fff !important;
}
.wpip-pos-theme-light input[type=text],
.wpip-pos-theme-light input[type=number],
.wpip-pos-theme-light input[type=email],
.wpip-pos-theme-light input[type=password],
.wpip-pos-theme-light select {
    color: #111827 !important;
}
/* ════════════════════════════════════════════════════════════
   LIGHT THEME
   Configurable from Settings → Display Theme.
   Default theme is dark. Light theme replaces the dark palette
   with neutral whites/greys, keeping layout and spacing identical.
   ════════════════════════════════════════════════════════════ */
.wpip-pos-theme-light                     { background: #F2F5FB; }
.wpip-pos-theme-light .wpip-pos-products-col { background: #fff; border-right: 1px solid #E5EAF2; }
.wpip-pos-theme-light .wpip-pos-topbar       { background: #F8FAFD; border-bottom: 1px solid #E5EAF2; }
.wpip-pos-theme-light .wpip-pos-topbar input[type=text] {
    background: #fff; border: 1.5px solid #D1D5DB; color: #111827; border-radius: 8px;
}
.wpip-pos-theme-light .wpip-pos-topbar input::placeholder { color: #9CA3AF; }
.wpip-pos-theme-light .wpip-pos-topbar select {
    background: #fff; border: 1.5px solid #D1D5DB; color: #111827; border-radius: 8px;
}
.wpip-pos-theme-light .wpip-pos-topbar button {
    background: #EEF3FF; border-color: #C5D0E6; color: #1A3FD4;
}
.wpip-pos-theme-light .wpip-pos-product-card {
    background: #F8FAFD; border: 2px solid #E5EAF2; border-radius: 10px;
}
.wpip-pos-theme-light .wpip-pos-product-card:hover { border-color: #1A3FD4; background: #EEF3FF; }
.wpip-pos-theme-light .wpip-pos-product-card .name  { color: #111827; }
.wpip-pos-theme-light .wpip-pos-product-card .price { color: #1A3FD4; }
.wpip-pos-theme-light .wpip-pos-product-card .stock { color: #6B7280; }
.wpip-pos-theme-light .wpip-pos-product-card .pcard-img { background: #E5EAF2; }
.wpip-pos-theme-light .wpip-pos-cart-col {
    background: #fff; border-left: 1px solid #E5EAF2;
}
.wpip-pos-theme-light .wpip-pos-cart-header { color: #6B7280; border-bottom: 1px solid #E5EAF2; }
.wpip-pos-theme-light .wpip-pos-cart-item   { border-bottom: 1px solid #F3F4F6; }
.wpip-pos-theme-light .wpip-pos-cart-item .ci-name  { color: #111827; }
.wpip-pos-theme-light .wpip-pos-cart-item .ci-qty button { background: #F3F4F6; color: #374151; }
.wpip-pos-theme-light .wpip-pos-cart-item .ci-qty span  { color: #111827; }
.wpip-pos-theme-light .wpip-pos-cart-item .ci-total  { color: #1A3FD4; }
.wpip-pos-theme-light .wpip-pos-cart-item .ci-remove { color: #EF4444; }
.wpip-pos-theme-light .wpip-pos-cart-totals { border-top: 1px solid #E5EAF2; }
.wpip-pos-theme-light .wpip-pos-cart-totals .row { color: #6B7280; }
.wpip-pos-theme-light .wpip-pos-cart-totals .row.total { color: #111827; }
.wpip-pos-theme-light .wpip-pos-cart-actions { border-top: 1px solid #E5EAF2; background: #F8FAFD; }
.wpip-pos-theme-light .wpip-pos-btn-outline {
    background: #fff; border: 1.5px solid #D1D5DB; color: #374151;
}
.wpip-pos-theme-light .wpip-pos-cart-empty { color: #9CA3AF; }
.wpip-pos-theme-light .wpip-pos-cart-empty::before { filter: invert(1) brightness(0.4); }

/* Customer search input in light mode */
.wpip-pos-theme-light #pos-cust-search {
    background: #F8FAFD !important; border: 1.5px solid #D1D5DB !important; color: #111827 !important;
}
.wpip-pos-theme-light #pos-cust-results { background: #fff; border: 1px solid #E5EAF2; }
.wpip-pos-theme-light .pos-cust-row { color: #111827 !important; border-color: #F3F4F6 !important; }
.wpip-pos-theme-light #pos-add-new-cust-btn { background: #1A3FD4; border-color: #1A3FD4; }
.wpip-pos-theme-light #pos-cust-selected { background: #ECFDF5; color: #065F46; }

/* System/auto theme — follow OS preference */
@media (prefers-color-scheme: light) {
  .wpip-pos-theme-auto                     { background: #F2F5FB; }
  .wpip-pos-theme-auto .wpip-pos-products-col { background: #fff; border-right: 1px solid #E5EAF2; }
  .wpip-pos-theme-auto .wpip-pos-topbar       { background: #F8FAFD; border-bottom: 1px solid #E5EAF2; }
  .wpip-pos-theme-auto .wpip-pos-topbar input[type=text],
  .wpip-pos-theme-auto .wpip-pos-topbar select { background: #fff; border-color: #D1D5DB; color: #111827; }
  .wpip-pos-theme-auto .wpip-pos-product-card { background: #F8FAFD; border-color: #E5EAF2; }
  .wpip-pos-theme-auto .wpip-pos-product-card .name { color: #111827; }
  .wpip-pos-theme-auto .wpip-pos-cart-col    { background: #fff; border-left: 1px solid #E5EAF2; }
  .wpip-pos-theme-auto .wpip-pos-cart-header { color: #6B7280; border-color: #E5EAF2; }
  .wpip-pos-theme-auto .wpip-pos-cart-totals .row.total { color: #111827; }
}

/* ════════════════════════════════════════════════════════════
   RECEIPT MODAL — sale success banner + print isolation
   These live here (not pos.css) because the consolidated dashboard
   ([wpip_dashboard] shortcode — the actual live POS Terminal tab)
   only enqueues wpip-ui.css, not pos.css. pos.css is only loaded for
   the standalone [wpip_pos] shortcode / native wp-admin POS screen.
   ════════════════════════════════════════════════════════════ */
.wpip-sale-success {
  text-align: center;
  padding: 6px 0 20px;
  margin-bottom: 4px;
  border-bottom: 1px dashed #E5E7EB;
}
.wpip-sale-success-check {
  width: 64px;
  height: 64px;
  margin: 0 auto 10px;
  display: block;
}
.wpip-check-circle {
  stroke: #10B981;
  stroke-width: 3;
  stroke-dasharray: 151;
  stroke-dashoffset: 151;
}
.wpip-check-mark {
  stroke: #10B981;
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-dasharray: 32;
  stroke-dashoffset: 32;
}
.wpip-sale-success-check.animate .wpip-check-circle {
  animation: wpip-check-circle-draw .45s ease-out forwards;
}
.wpip-sale-success-check.animate .wpip-check-mark {
  animation: wpip-check-mark-draw .35s .4s ease-out forwards;
}
@keyframes wpip-check-circle-draw { to { stroke-dashoffset: 0; } }
@keyframes wpip-check-mark-draw   { to { stroke-dashoffset: 0; } }
.wpip-sale-success-title {
  font-size: 20px;
  font-weight: 700;
  color: #065F46;
  margin-bottom: 4px;
}
.wpip-sale-success-sub {
  font-size: 13px;
  color: #6B7280;
}

@media print {
  /* BUG 5 FIX: this used to also declare #pos-receipt-content's print
     dimensions (width:100% of a full print page, no @page override) — a
     second, conflicting copy of the sizing that lives in pos.css and,
     authoritatively, in the dynamic inline <style> in templates/page-pos.php
     (see the comment there). Depending on stylesheet enqueue order — which
     differs between the plain wp-admin POS page and the AJAX-loaded
     consolidated-shortcode context — this block could win over the correct
     58mm/80mm sizing and print at full page width, which is what caused the
     receipt to overflow/clip on a physical thermal roll (see the sample
     receipt photo). Sizing has been removed from here; only the generic
     "hide everything except the receipt" visibility rules remain, which
     don't hardcode any dimension and so can never conflict with it.
     Duplicated deliberately with the same rules in pos.css, in case either
     stylesheet loads without the other on some page. */
  body * { visibility: hidden !important; }
  #pos-receipt-content, #pos-receipt-content * { visibility: visible !important; }
}

/* ── Purchase List (printable goods-collection checklist) ────────────────── */
.wpip-purchase-list {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 13px;
  line-height: 1.6;
  color: #111827;
  max-width: 680px;
  margin: 0 auto;
}
.wpip-purchase-list .pl-header { text-align: center; margin-bottom: 10px; }
.wpip-purchase-list .pl-logo { max-height: 48px; margin-bottom: 6px; }
.wpip-purchase-list .pl-business-name { font-size: 16px; font-weight: 700; }
.wpip-purchase-list .pl-business-sub { font-size: 12px; color: #6B7280; }
.wpip-purchase-list .pl-divider { border-top: 1px dashed #D1D5DB; margin: 12px 0; }
.wpip-purchase-list .pl-title {
  text-align: center; font-size: 15px; font-weight: 700;
  letter-spacing: 1.5px; margin-bottom: 12px;
}
.wpip-purchase-list .pl-meta-row {
  display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 13px;
}
.wpip-purchase-list .pl-label { color: #6B7280; margin-right: 4px; }
.wpip-purchase-list .pl-block { margin-bottom: 10px; }
.wpip-purchase-list .pl-block-title {
  font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: 0.5px; color: #6B7280; margin-bottom: 2px;
}
.wpip-purchase-list .pl-small { font-size: 12px; color: #6B7280; }
.wpip-purchase-list .pl-table {
  width: 100%; border-collapse: collapse; margin-top: 6px; font-size: 12px;
}
.wpip-purchase-list .pl-table th,
.wpip-purchase-list .pl-table td {
  border: 1px solid #D1D5DB; padding: 6px 8px; text-align: left;
}
.wpip-purchase-list .pl-table th {
  background: #F9FAFB; font-size: 10px; text-transform: uppercase; letter-spacing: 0.4px;
}
.wpip-purchase-list .pl-blank-cell { min-width: 70px; }
.wpip-purchase-list .pl-checkbox-cell { text-align: center; width: 34px; }
.wpip-purchase-list .pl-checkbox {
  display: inline-block; width: 16px; height: 16px;
  border: 1.5px solid #6B7280; border-radius: 3px;
}
.wpip-purchase-list .pl-notes-lines div {
  border-bottom: 1px solid #D1D5DB; height: 22px;
}
.wpip-purchase-list .pl-signoff {
  display: flex; gap: 40px; margin-top: 28px;
}
.wpip-purchase-list .pl-signoff > div { flex: 1; }
.wpip-purchase-list .pl-sign-line {
  border-bottom: 1px solid #111827; height: 32px;
}

@media print {
  body * { visibility: hidden !important; }
  #po-purchase-list-content, #po-purchase-list-content * { visibility: visible !important; }
  #po-purchase-list-content {
    position: absolute !important;
    left: 0; top: 0; width: 100%;
    margin: 0; padding: 20px;
    color: #000 !important;
  }
  #po-purchase-list-content * { color: #000 !important; }
}