/**
 * ============================================================================
 * Portal Cloud 9 - Add Product Styles
 * ============================================================================
 *
 * Styles for the vendor add product form including:
 * - Form layout and input field styling
 * - Image upload and gallery management UI
 * - Category and attribute selectors
 * - Pricing, stock and shipping field groups
 * - Mobile-responsive form adjustments
 *
 * @package Portal_Cloud_9
 * @version 8.6.0
 * @author  Brian Agoi (Gradyzer)
 * @company Gradyzer
 * @license GPL-2.0+
 * ============================================================================
 */
 :root{--p9-bg:var(--p9-bg-light);--p9-panel:var(--p9-panel-light);--p9-border:var(--p9-border-light);--p9-text:var(--p9-text-light);--p9-muted:var(--p9-muted-light);--p9-primary:#0ea5e9}.p9-add-product-wrap{background:var(--p9-bg);color:var(--p9-text);padding:24px}.p9-edit-topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-bottom:24px}.p9-edit-title{text-align:center;margin:0;font-size:20px;font-weight:800;color:var(--p9-text)}.p9-form-grid{display:grid;grid-template-columns:1.6fr 0.9fr;gap:32px}@media (max-width:980px){.p9-form-grid{grid-template-columns:1fr;gap:24px}}.p9-glass-card{background:var(--p9-panel);border:1px solid var(--p9-border);border-radius:16px;box-shadow:0 8px 32px rgba(0,0,0,.08);padding:24px;margin-bottom:24px;position:relative;overflow:hidden}.p9-card-title{background:linear-gradient(135deg,dodgerblue,#000);color:#fff;margin:-24px -24px 20px -24px;padding:14px 20px;border-radius:16px 16px 0 0;font-size:16px;font-weight:700;letter-spacing:.3px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.p9-field{margin-bottom:18px}.p9-field label{display:block;font-weight:700;margin:0 0 6px;color:var(--p9-text)}.p9-field label span{color:#ef4444}.p9-field input[type="text"],.p9-field input[type="number"],.p9-field input[type="tel"],.p9-field select,input[name="product_title"],input[name="sku"],input[name="seller_phone"],#p9-new-category-name,#p9-new-tags{width:100%;padding:12px 14px;border:2px solid var(--p9-border);background:var(--p9-panel);color:var(--p9-text);border-radius:999px;transition:border-color 0.2s,box-shadow 0.2s}.p9-field textarea{width:100%;padding:12px 14px;border:2px solid var(--p9-border);background:var(--p9-panel);color:var(--p9-text);border-radius:16px;transition:border-color 0.2s,box-shadow 0.2s}.p9-field input:focus,.p9-field select:focus,.p9-field textarea:focus{outline:none;border-color:var(--p9-primary);box-shadow:0 0 0 3px rgba(14,165,233,.15)}.p9-rich-editor{position:relative}.p9-editor-toolbar{display:flex;gap:4px;margin-bottom:8px;flex-wrap:wrap}.p9-editor-toolbar button{border:1px solid var(--p9-border);background:var(--p9-panel);color:var(--p9-text);border-radius:999px;padding:3px 9px;cursor:pointer;font-size:10px;font-weight:700;min-width:28px;height:26px;display:inline-flex;align-items:center;justify-content:center;transition:all 0.2s}.p9-editor-toolbar button:hover{background:var(--p9-primary);color:#fff;border-color:var(--p9-primary);transform:translateY(-1px);box-shadow:0 2px 6px rgba(14,165,233,.3)}.p9-rich-textarea{min-height:140px;border:2px solid var(--p9-border);border-radius:16px;padding:12px;background:var(--p9-panel);color:var(--p9-text);transition:border-color 0.2s,box-shadow 0.2s}.p9-rich-textarea.empty:before{content:attr(data-placeholder);color:var(--p9-muted)}.p9-rich-textarea:focus{border-color:var(--p9-primary);box-shadow:0 0 0 3px rgba(14,165,233,.25)}.p9-price-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:640px){.p9-price-row{grid-template-columns:1fr}}.p9-price-input{display:flex;align-items:center;gap:8px}.p9-currency{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:44px;background:rgba(14,165,233,.12);border:1px solid rgba(14,165,233,.35);color:var(--p9-text);border-radius:999px;font-weight:700}.p9-inventory-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}@media (max-width:640px){.p9-inventory-row{grid-template-columns:1fr}}#p9-upload-area{display:block;width:100%;aspect-ratio:1 / 1}#p9-upload-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;height:100%;min-height:unset;cursor:pointer;background:var(--p9-panel);border:2px dashed var(--p9-border);border-radius:14px;color:var(--p9-muted);transition:border-color 0.2s,transform 0.15s;text-align:center;padding:20px}#p9-upload-trigger:hover{border-color:var(--p9-primary);transform:translateY(-1px)}#p9-upload-trigger.dragover{border-color:var(--p9-primary);background:rgba(14,165,233,.05)}.p9-upload-icon{font-size:48px;opacity:.7}#p9-image-preview,.p9-image-preview{display:none;position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:12px;border:1px solid var(--p9-border);background:var(--p9-panel)}#p9-image-preview img,.p9-image-preview img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.p9-remove-img-btn,#p9-remove-image{position:absolute;top:10px;right:10px;border:none;border-radius:999px;width:36px;height:36px;background:rgba(0,0,0,.6);color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;display:flex;align-items:center;justify-content:center;z-index:10}.p9-remove-img-btn:hover,#p9-remove-image:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}.p9-upload-progress{width:100%;max-width:200px;display:none;margin-top:8px}.p9-progress-bar{width:100%;height:10px;background:rgba(0,0,0,.1);border-radius:999px;overflow:hidden}.p9-progress-fill{width:0%;height:100%;background:linear-gradient(90deg,dodgerblue,#000);transition:width 0.15s linear}.p9-progress-text{margin-top:6px;font-size:12px;color:var(--p9-muted);text-align:center;display:block}.p9-gallery-upload-box{margin-bottom:16px}.p9-gallery-trigger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;max-width:200px;aspect-ratio:1 / 1;min-height:unset;cursor:pointer;background:var(--p9-panel);border:2px dashed var(--p9-border);border-radius:14px;color:var(--p9-muted);transition:border-color 0.2s,transform 0.15s;text-align:center;padding:16px}.p9-gallery-trigger:hover{border-color:var(--p9-primary);transform:translateY(-1px)}.p9-gallery-trigger.dragover{border-color:var(--p9-primary);background:rgba(14,165,233,.05)}.p9-gallery-trigger .p9-upload-icon{font-size:32px}.p9-gallery-trigger p{margin:0 0 4px;font-size:13px}.p9-gallery-trigger small{font-size:11px}.p9-gallery-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}@media (max-width:768px){.p9-gallery-preview{grid-template-columns:repeat(2,1fr)}}.p9-gallery-item{position:relative;width:100%;aspect-ratio:1 / 1;border-radius:12px;overflow:hidden;border:1px solid var(--p9-border);background:var(--p9-panel)}.p9-gallery-item img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.p9-gallery-item .p9-gallery-remove{position:absolute;top:6px;right:6px;border:none;border-radius:50%;width:28px;height:28px;background:rgba(0,0,0,.6);color:#fff;font-size:18px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;display:flex;align-items:center;justify-content:center;z-index:10}.p9-gallery-item .p9-gallery-remove:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}.p9-gallery-item .p9-gallery-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:rgba(0,0,0,.2);border-radius:0 0 12px 12px;overflow:hidden}.p9-gallery-item .p9-gallery-progress-fill{height:100%;background:linear-gradient(90deg,dodgerblue,#000);transition:width 0.15s linear}.p9-selected-terms{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;min-height:20px}.p9-term-pill{display:inline-flex;align-items:center;gap:8px;padding:6px 12px;border-radius:999px;background:linear-gradient(135deg,dodgerblue,#000);color:#fff;font-size:13px;font-weight:500;box-shadow:0 0 8px rgba(30,144,255,.55),0 2px 4px rgba(0,0,0,.08);animation:p9PillAppear 0.3s ease-out}@keyframes p9PillAppear{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.p9-term-pill .p9-term-remove{border:none;background:transparent;color:#fff;cursor:pointer;font-size:16px;width:18px;height:18px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background 0.2s}.p9-term-pill .p9-term-remove:hover{background:rgba(255,255,255,.2)}.p9-terms-list{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));max-height:260px;overflow:auto}.p9-term-item{position:relative;display:flex;align-items:center;gap:10px;padding:12px 14px;border:1px solid var(--p9-border);background:var(--p9-panel);border-radius:12px;cursor:pointer;transition:all 0.2s ease}.p9-term-item:hover{border-color:var(--p9-primary);transform:translateY(-1px)}.p9-term-item input[type="checkbox"]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}.p9-term-item::after{content:'';position:absolute;right:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;border-radius:4px;border:2px solid var(--p9-border);background:transparent;transition:all 0.2s ease}.p9-term-item.term-selected{border-color:dodgerblue;box-shadow:0 0 0 3px rgba(30,144,255,.25);background:rgba(30,144,255,.03)}.p9-term-item.term-selected::after{background:dodgerblue;border-color:dodgerblue}.p9-term-item.term-selected::before{content:'✓';position:absolute;right:14px;top:50%;transform:translateY(-52%);font-weight:900;font-size:12px;color:#fff;z-index:1}.p9-form-actions{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}.p9-add-product-wrap .p9-btn,.p9-add-product-wrap a.p9-btn{display:inline-flex!important;align-items:center!important;gap:6px!important;border-radius:999px!important;padding:10px 22px!important;cursor:pointer!important;transition:all 0.22s ease!important;font-weight:600!important;font-size:13px!important;line-height:1!important;white-space:nowrap!important;text-decoration:none!important;box-sizing:border-box!important}.p9-add-product-wrap .p9-btn-primary{background:linear-gradient(135deg,dodgerblue 0%,#000 100%)!important;color:#fff!important;border:none!important;box-shadow:0 2px 10px rgba(30,144,255,.3)!important}.p9-add-product-wrap .p9-btn-primary:hover{filter:brightness(1.12)!important;transform:translateY(-2px)!important;box-shadow:0 6px 20px rgba(30,144,255,.45)!important}.p9-add-product-wrap .p9-btn-secondary{background:linear-gradient(#111827,#111827) padding-box,linear-gradient(135deg,#000 0%,dodgerblue 100%) border-box!important;color:#fff!important;border:2px solid transparent!important;box-shadow:0 2px 8px rgba(30,144,255,.15)!important}.p9-add-product-wrap .p9-btn-secondary:hover{background:linear-gradient(#1e293b,#1e293b) padding-box,linear-gradient(135deg,#000 0%,dodgerblue 100%) border-box!important;transform:translateY(-2px)!important;box-shadow:0 6px 18px rgba(30,144,255,.35)!important}.p9-add-product-wrap .p9-btn-accent{background:transparent!important;border:2px solid dodgerblue!important;color:dodgerblue!important;box-shadow:none!important}.p9-add-product-wrap .p9-btn-accent:hover{background:rgba(30,144,255,.1)!important;transform:translateY(-1px)!important;box-shadow:0 3px 10px rgba(30,144,255,.2)!important}.p9-add-product-wrap .p9-btn-outline{background:transparent!important;border:1.5px solid rgba(0,0,0,.25)!important;color:#334155!important;box-shadow:none!important}.p9-add-product-wrap .p9-btn-outline:hover{border-color:dodgerblue!important;color:dodgerblue!important;background:rgba(30,144,255,.06)!important;transform:translateY(-1px)!important}.p9-featured-checkbox{display:flex;align-items:center;gap:8px}.p9-featured-checkbox input[type="checkbox"]{width:18px;height:18px}.p9-modal{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1000;display:flex;align-items:center;justify-content:center}.p9-modal-content{background:var(--p9-panel);border-radius:16px;padding:24px;max-width:500px;width:90%;box-shadow:0 20px 60px rgba(0,0,0,.3)}.p9-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.p9-modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:var(--p9-muted)}.p9-modal-body{margin-bottom:24px}.p9-modal-actions{display:flex;gap:12px;margin-bottom:16px}.p9-modal-footer{display:flex;justify-content:space-between;gap:12px}@media (prefers-color-scheme:light){.p9-glass-card::after,.p9-image-preview::after,.p9-category-card::after,.p9-tag-card::after{content:'';position:absolute;inset:0;width:200%;height:100%;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.18) 50%,transparent 60%);animation:glassShimmer 6s linear infinite;pointer-events:none;z-index:1}}@keyframes glassShimmer{to{background-position:200% 0}}.p9-rich-textarea{border:2px solid var(--p9-border)!important;transition:border-color 0.2s,box-shadow 0.2s!important}.p9-rich-textarea:focus{border-color:var(--p9-primary)!important;box-shadow:0 0 0 3px rgba(14,165,233,.25)!important;outline:0!important}.p9-image-preview,#p9-image-preview{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:12px;border:1px solid var(--p9-border);background:var(--p9-bg-muted,#f8fafc)}.p9-image-preview img,#p9-image-preview img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}#p9-remove-image,.p9-remove-img-btn{position:absolute;top:10px;right:10px;border:none;border-radius:999px;width:36px;height:36px;background:rgba(0,0,0,.6);color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;z-index:10;display:flex;align-items:center;justify-content:center}#p9-remove-image:hover,.p9-remove-img-btn:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}#p9-upload-area{width:100%;aspect-ratio:1 / 1}#p9-upload-trigger{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--p9-border,#e2e8f0);border-radius:12px;background:var(--p9-bg-muted,#f8fafc);cursor:pointer;transition:border-color 0.2s,background 0.2s;text-align:center;padding:20px;min-height:unset;position:relative}#p9-upload-trigger::before{content:'';position:absolute;width:var(--p9-ind-w,76%);height:var(--p9-ind-h,76%);border:1px dashed var(--p9-primary,#0ea5e9);border-radius:6px;opacity:.35;pointer-events:none}#p9-upload-trigger:hover,#p9-upload-trigger.dragover{border-color:var(--p9-primary,#0ea5e9);background:rgba(14,165,233,.05)}#p9-upload-trigger .p9-upload-icon{font-size:48px;margin-bottom:12px;opacity:.7}#p9-upload-trigger p{margin:0 0 8px;color:var(--p9-text,#1e293b);font-size:15px}#p9-upload-trigger small{color:var(--p9-muted,#64748b);font-size:13px}.p9-gallery-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.p9-gallery-item{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:10px;border:1px solid var(--p9-border,#e2e8f0);background:var(--p9-bg-muted,#f8fafc)}.p9-gallery-item img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.p9-gallery-remove{position:absolute;top:6px;right:6px;width:26px;height:26px;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:16px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;display:flex;align-items:center;justify-content:center;z-index:10}.p9-gallery-remove:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}.p9-gallery-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:rgba(0,0,0,.2);border-radius:0 0 10px 10px;overflow:hidden}.p9-gallery-progress-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#22d3ee);transition:width 0.2s ease}.p9-gallery-trigger{width:100%;aspect-ratio:1 / 1;max-width:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--p9-border,#e2e8f0);border-radius:12px;background:var(--p9-bg-muted,#f8fafc);cursor:pointer;transition:border-color 0.2s,background 0.2s;text-align:center;padding:16px;min-height:unset;position:relative}.p9-gallery-trigger:hover,.p9-gallery-trigger.dragover{border-color:var(--p9-primary,#0ea5e9);background:rgba(14,165,233,.05)}.p9-gallery-trigger::before{content:'';position:absolute;width:var(--p9-ind-w,76%);height:var(--p9-ind-h,76%);border:1px dashed var(--p9-primary,#0ea5e9);border-radius:4px;opacity:.35;pointer-events:none}.p9-gallery-trigger .p9-upload-icon{font-size:32px;margin-bottom:8px;opacity:.7}.p9-gallery-trigger p{margin:0 0 4px;font-size:13px;color:var(--p9-text,#1e293b)}.p9-gallery-trigger small{font-size:11px;color:var(--p9-muted,#64748b)}.p9-upload-progress{margin-top:16px;width:100%;max-width:200px}.p9-progress-bar{height:8px;background:rgba(0,0,0,.1);border-radius:4px;overflow:hidden}.p9-progress-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#22d3ee);transition:width 0.2s ease;border-radius:4px}.p9-progress-text{display:block;text-align:center;font-size:12px;color:var(--p9-muted,#64748b);margin-top:4px}@media (max-width:768px){.p9-gallery-preview{grid-template-columns:repeat(2,1fr)}}.p9-rich-textarea{border:2px solid var(--p9-border)!important;transition:border-color 0.2s,box-shadow 0.2s!important}.p9-rich-textarea:focus{border-color:var(--p9-primary)!important;box-shadow:0 0 0 3px rgba(14,165,233,.25)!important;outline:0!important}#p9-image-preview{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:12px;border:1px solid var(--p9-border);background:var(--p9-bg-muted,#f8fafc)}#p9-image-preview img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}#p9-remove-image,.p9-remove-img-btn{position:absolute;top:10px;right:10px;border:none;border-radius:999px;width:36px;height:36px;background:rgba(0,0,0,.6);color:#fff;font-size:20px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;z-index:10;display:flex;align-items:center;justify-content:center}#p9-remove-image:hover,.p9-remove-img-btn:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}#p9-upload-area{width:100%;aspect-ratio:1 / 1}#p9-upload-trigger{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--p9-border,#e2e8f0);border-radius:12px;background:var(--p9-bg-muted,#f8fafc);cursor:pointer;transition:border-color 0.2s,background 0.2s;text-align:center;padding:20px;position:relative}#p9-upload-trigger::before{content:'';position:absolute;width:var(--p9-ind-w,76%);height:var(--p9-ind-h,76%);border:1px dashed var(--p9-primary,#0ea5e9);border-radius:6px;opacity:.35;pointer-events:none}#p9-upload-trigger:hover,#p9-upload-trigger.dragover{border-color:var(--p9-primary,#0ea5e9);background:rgba(14,165,233,.05)}#p9-upload-trigger .p9-upload-icon{font-size:48px;margin-bottom:12px;opacity:.7}#p9-upload-trigger p{margin:0 0 8px;color:var(--p9-text,#1e293b);font-size:15px}#p9-upload-trigger small{color:var(--p9-muted,#64748b);font-size:13px}.p9-gallery-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px}.p9-gallery-item{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;border-radius:10px;border:1px solid var(--p9-border,#e2e8f0);background:var(--p9-bg-muted,#f8fafc)}.p9-gallery-item img{width:100%;height:100%;object-fit:contain;object-position:center;display:block}.p9-gallery-remove{position:absolute;top:6px;right:6px;width:26px;height:26px;border:none;border-radius:50%;background:rgba(0,0,0,.6);color:#fff;font-size:16px;line-height:1;cursor:pointer;transition:background 0.2s,transform 0.2s;display:flex;align-items:center;justify-content:center;z-index:10}.p9-gallery-remove:hover{background:rgba(239,68,68,.9);transform:scale(1.1)}.p9-gallery-progress{position:absolute;bottom:0;left:0;right:0;height:4px;background:rgba(0,0,0,.2);border-radius:0 0 10px 10px;overflow:hidden}.p9-gallery-progress-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#22d3ee);transition:width 0.2s ease}.p9-gallery-trigger{width:100%;aspect-ratio:1 / 1;max-width:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--p9-border,#e2e8f0);border-radius:12px;background:var(--p9-bg-muted,#f8fafc);cursor:pointer;transition:border-color 0.2s,background 0.2s;text-align:center;padding:16px;position:relative}.p9-gallery-trigger:hover,.p9-gallery-trigger.dragover{border-color:var(--p9-primary,#0ea5e9);background:rgba(14,165,233,.05)}.p9-gallery-trigger::before{content:'';position:absolute;width:var(--p9-ind-w,76%);height:var(--p9-ind-h,76%);border:1px dashed var(--p9-primary,#0ea5e9);border-radius:4px;opacity:.35;pointer-events:none}.p9-gallery-trigger .p9-upload-icon{font-size:32px;margin-bottom:8px;opacity:.7}.p9-gallery-trigger p{margin:0 0 4px;font-size:13px;color:var(--p9-text,#1e293b)}.p9-gallery-trigger small{font-size:11px;color:var(--p9-muted,#64748b)}.p9-upload-progress{margin-top:16px;width:100%;max-width:200px}.p9-progress-bar{height:8px;background:rgba(0,0,0,.1);border-radius:4px;overflow:hidden}.p9-progress-fill{height:100%;background:linear-gradient(90deg,#0ea5e9,#22d3ee);transition:width 0.2s ease;border-radius:4px}.p9-progress-text{display:block;text-align:center;font-size:12px;color:var(--p9-muted,#64748b);margin-top:4px}@media (max-width:768px){.p9-gallery-preview{grid-template-columns:repeat(2,1fr)}}.p9-field-hint{margin:0 0 16px;color:var(--p9-muted);font-size:14px}.p9-field-mt{margin-top:12px}.p9-field-mb{margin-bottom:16px}