/* U Dress Core Plugin CSS — uses same design tokens as theme */
:root {
  --pink:#e91e8c; --pink-dark:#c2177a; --pink-light:#fce4f3;
  --purple:#5c35a0; --purple-lt:#ede9f8;
  --dark:#111827; --dark2:#1f2937; --dark3:#374151;
  --gray:#6b7280; --gray-lt:#9ca3af;
  --border:#e5e7eb; --bg:#f9fafb; --white:#ffffff;
  --green:#16a34a; --green-lt:#dcfce7;
  --orange:#ea580c; --orange-lt:#fff7ed;
  --red:#dc2626; --red-lt:#fee2e2;
  --blue:#2563eb; --blue-lt:#dbeafe;
  --yellow:#d97706; --yellow-lt:#fef3c7;
  --radius:8px; --radius-lg:12px;
  --shadow-sm:0 1px 3px rgba(0,0,0,.08);
  --shadow:0 4px 6px rgba(0,0,0,.07);
  --shadow-lg:0 10px 15px rgba(0,0,0,.08);
}

/* ── BUTTONS ─────────────────────────────────────────────────────────────────── */
.udress-btn, .ud-btn {
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 20px; background:var(--pink); color:var(--white)!important;
  border:2px solid var(--pink); border-radius:var(--radius);
  font-size:14px; font-weight:600; cursor:pointer;
  text-decoration:none!important; transition:background .15s, border-color .15s; line-height:1;
}
.udress-btn:hover, .ud-btn:hover { background:var(--pink-dark); border-color:var(--pink-dark); }
.udress-btn-outline, .ud-btn-outline { background:transparent; color:var(--pink)!important; }
.udress-btn-outline:hover, .ud-btn-outline:hover { background:var(--pink); color:var(--white)!important; }
.udress-btn-sm, .ud-btn-sm { padding:6px 14px; font-size:13px; }
.udress-btn-danger, .ud-btn-danger { background:var(--red); border-color:var(--red); }

/* ── ALERTS ──────────────────────────────────────────────────────────────────── */
.udress-msg-success,.ud-alert-success {
  background:var(--green-lt); color:#15803d;
  border-left:4px solid var(--green); border-radius:var(--radius);
  padding:12px 16px; font-size:14px; margin-bottom:14px;
}
.udress-msg-error,.ud-alert-error {
  background:var(--red-lt); color:#b91c1c;
  border-left:4px solid var(--red); border-radius:var(--radius);
  padding:12px 16px; font-size:14px; margin-bottom:14px;
}

/* ── AUTH BOX ────────────────────────────────────────────────────────────────── */
.udress-box, .udress-register, .udress-login {
  max-width:460px; margin:48px auto;
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  overflow:hidden;
}
.udress-box-top {
  background:var(--dark); padding:28px 32px; text-align:center;
}
.udress-box-top h2 { color:var(--white); font-size:22px; margin:0; }
.udress-box-top p  { color:var(--gray-lt); font-size:13px; margin-top:4px; }
.udress-box-body { padding:28px 32px; }
.udress-box h2 {
  background:var(--dark); color:var(--white);
  margin:-1px -1px 0; padding:28px 32px;
  font-size:22px; text-align:center;
  border-radius:var(--radius-lg) var(--radius-lg) 0 0;
}
.udress-field { margin-bottom:16px; padding:0 32px; }
.udress-field:first-of-type { padding-top:24px; }
.udress-field label {
  display:block; font-size:13px; font-weight:600;
  color:var(--dark); margin-bottom:5px;
}
.udress-field input,.udress-field select,.udress-field textarea {
  width:100%; padding:10px 14px;
  border:1.5px solid var(--border); border-radius:var(--radius);
  font-size:14px; color:var(--dark); background:var(--white);
  font-family:inherit; transition:border-color .15s; outline:none;
}
.udress-field input:focus,.udress-field select:focus,.udress-field textarea:focus {
  border-color:var(--pink);
}
.udress-field small { display:block; font-size:11px; color:var(--gray-lt); margin-top:4px; }
.udress-field-row { display:flex; gap:12px; padding:0 32px; flex-wrap:wrap; }
.udress-field-row .udress-field { flex:1; min-width:120px; padding:0; }
#ud_reg_submit, #ud_login_submit, #ud-upload-submit {
  display:block; width:calc(100% - 64px);
  margin:20px 32px 24px;
}
.udress-link { text-align:center; font-size:13px; color:var(--gray); padding:0 32px 24px; }
.udress-link a { color:var(--pink); font-weight:600; text-decoration:none; }

/* ── FEE NOTICE ──────────────────────────────────────────────────────────────── */
#ud-shopkeeper-fee-notice { padding:0 32px 8px; }
.udress-fee-box {
  background:var(--yellow-lt); border:1.5px solid var(--yellow);
  border-radius:var(--radius); padding:20px; text-align:center; margin-bottom:14px;
}
.udress-fee-icon { font-size:36px; margin-bottom:8px; }
.udress-fee-box h3 { font-size:16px; font-weight:700; color:var(--dark); margin-bottom:8px; }
.udress-fee-amount { font-size:36px; font-weight:900; color:var(--pink); margin-bottom:8px; }
.udress-fee-box p  { font-size:13px; color:var(--dark3); }
.udress-bank-info {
  background:var(--dark); color:var(--white);
  border-radius:var(--radius); padding:12px 14px;
  margin:10px 0; text-align:left; font-size:13px;
}
.udress-bank-info code { color:#fbbf24; display:block; margin-top:4px; font-size:13px; }
.udress-fee-note { font-size:12px!important; color:var(--gray)!important; font-style:italic; }
.required { color:var(--red); }

/* ── DASHBOARD ───────────────────────────────────────────────────────────────── */
.udress-dashboard { /* rendered inside ud-main-content */ }
.udress-dash-header {
  display:flex; align-items:center; gap:12px; margin-bottom:24px;
}
.udress-dash-header h2 { font-size:22px; font-weight:800; color:var(--dark); }
.udress-role-badge, .ud-role-pill {
  display:inline-block; padding:3px 12px; border-radius:50px;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.4px;
}
.udress-role-admin,.ud-role-admin             { background:var(--dark); color:var(--white); }
.udress-role-ps,.ud-role-ps                   { background:var(--pink); color:var(--white); }
.udress-role-shopkeeper,.ud-role-shopkeeper   { background:var(--purple); color:var(--white); }
.udress-role-wholesaler,.ud-role-wholesaler   { background:var(--blue); color:var(--white); }
.udress-role-customer,.ud-role-customer       { background:var(--green); color:var(--white); }
.udress-role-shopkeeper_pending               { background:var(--yellow); color:var(--white); }

/* Stat cards */
.udress-stat-cards {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:16px; margin-bottom:24px;
}
.udress-stat-card {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:20px;
  display:flex; align-items:flex-start; gap:14px;
}
.udress-stat-card .stat-icon {
  width:46px; height:46px; border-radius:var(--radius);
  display:flex; align-items:center; justify-content:center;
  font-size:20px; flex-shrink:0; background:var(--pink-light);
}
.udress-stat-card .stat-value { font-size:22px; font-weight:800; color:var(--dark); display:block; line-height:1; margin-bottom:4px; }
.udress-stat-card .stat-label { font-size:12px; color:var(--gray); font-weight:500; }
.udress-stat-card > div { display:flex; flex-direction:column; }

/* Chart */
.udress-chart-wrap {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:20px 24px; margin-bottom:24px;
}

/* Notifications */
.udress-notif-bar { display:flex; justify-content:flex-end; margin-bottom:20px; position:relative; }
#udress-notif-toggle {
  display:flex; align-items:center; gap:8px;
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius); padding:8px 14px;
  font-size:13px; font-weight:600; cursor:pointer; color:var(--dark);
}
.udress-badge {
  background:var(--pink); color:var(--white);
  border-radius:50px; font-size:11px; font-weight:700;
  padding:1px 7px;
}
#udress-notif-panel {
  display:none; position:absolute; top:44px; right:0; z-index:200;
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); box-shadow:var(--shadow-lg);
  width:320px; max-height:340px; overflow-y:auto;
}
.udress-notif-item {
  padding:12px 16px; border-bottom:1px solid var(--border);
  font-size:13px; color:var(--dark3);
}
.udress-notif-item.unread { background:var(--pink-light); }

/* Quick links */
.udress-quick-links { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }

/* ── PENDING SHOPKEEPER ───────────────────────────────────────────────────────── */
.udress-pending-wrap { max-width:520px; margin:60px auto; }
.udress-pending-box {
  background:var(--white); border:1px solid var(--border);
  border-top:4px solid var(--yellow); border-radius:var(--radius-lg);
  padding:48px 32px; text-align:center; box-shadow:var(--shadow);
}
.udress-pending-rejected { border-top-color:var(--red); }
.pend-icon { font-size:56px; margin-bottom:16px; }
.udress-pending-box h3 { font-size:20px; margin-bottom:10px; }
.udress-pending-box p  { font-size:14px; color:var(--gray); line-height:1.7; }
.udress-pending-box code {
  background:var(--bg); border:1px solid var(--border);
  padding:2px 8px; border-radius:4px; font-size:13px;
}
.pend-eta { font-size:13px!important; color:var(--gray-lt)!important; margin-top:14px!important; }

/* ── PRODUCT ARCHIVE ─────────────────────────────────────────────────────────── */
.udress-archive { max-width:1200px; margin:0 auto; padding:28px 20px; }
.udress-search-bar { display:flex; gap:0; margin-bottom:18px; max-width:500px; }
.udress-search-bar input {
  flex:1; padding:10px 14px;
  border:1.5px solid var(--border); border-right:none;
  border-radius:var(--radius) 0 0 var(--radius); font-size:14px;
}
.udress-search-bar input:focus { border-color:var(--pink); outline:none; }
.udress-search-bar .udress-btn { border-radius:0 var(--radius) var(--radius) 0; }
.udress-filter-row { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.udress-filter-row select,.udress-filter-row input[type=number] {
  padding:8px 12px; border:1.5px solid var(--border); border-radius:var(--radius);
  font-size:13px; background:var(--white); color:var(--dark);
}
.udress-filter-row select:focus,.udress-filter-row input:focus {
  border-color:var(--pink); outline:none;
}

.udress-product-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr));
  gap:16px; margin-bottom:28px;
}
.udress-product-card {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); overflow:hidden;
  transition:box-shadow .2s, transform .2s; position:relative;
}
.udress-product-card:hover { box-shadow:var(--shadow-lg); transform:translateY(-3px); }
.udress-card-img { display:block; overflow:hidden; }
.udress-card-img img { width:100%; height:220px; object-fit:cover; transition:transform .3s; }
.udress-product-card:hover .udress-card-img img { transform:scale(1.04); }
.udress-out-badge {
  position:absolute; top:8px; left:8px;
  background:var(--red); color:var(--white);
  font-size:11px; font-weight:700; padding:3px 10px; border-radius:50px;
}
.udress-card-body { padding:14px; }
.udress-card-body h3 { font-size:14px; font-weight:600; color:var(--dark); line-height:1.4; margin-bottom:6px; }
.udress-card-body h3 a { color:inherit; text-decoration:none; }
.udress-card-body h3 a:hover { color:var(--pink); }
.udress-price { font-size:17px; font-weight:800; color:var(--pink); margin-bottom:10px; }
.udress-card-actions { display:flex; gap:6px; flex-wrap:wrap; }
#udress-load-more-wrap { text-align:center; margin-top:10px; }
.udress-empty { text-align:center; padding:48px; color:var(--gray); font-size:15px; }

/* ── ORDERS ──────────────────────────────────────────────────────────────────── */
.udress-orders { max-width:860px; }
.udress-order-list { display:flex; flex-direction:column; gap:12px; }
.udress-order-card {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:16px 20px;
  display:flex; gap:16px; align-items:flex-start;
}
.udress-order-thumb { width:72px; height:72px; object-fit:cover; border-radius:var(--radius); flex-shrink:0; border:1px solid var(--border); }
.udress-order-info { display:flex; flex-direction:column; gap:4px; font-size:13px; flex:1; }
.udress-order-info strong { font-size:15px; color:var(--dark); }
.udress-status {
  display:inline-block; padding:3px 10px; border-radius:50px;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.3px;
}
.udress-status-pending   { background:var(--yellow-lt); color:var(--yellow); }
.udress-status-confirmed { background:var(--blue-lt);   color:var(--blue); }
.udress-status-shipped   { background:var(--purple-lt); color:var(--purple); }
.udress-status-delivered { background:var(--green-lt);  color:var(--green); }
.udress-status-cancelled { background:var(--red-lt);    color:var(--red); }
.udress-status-update { display:flex; gap:8px; align-items:center; margin-top:8px; }

/* ── UPLOAD ──────────────────────────────────────────────────────────────────── */
.udress-upload { max-width:700px; }
.udress-image-preview { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.udress-image-preview img { width:72px; height:72px; object-fit:cover; border-radius:var(--radius); border:1px solid var(--border); }

/* ── SHOWCASE ────────────────────────────────────────────────────────────────── */
.udress-showcase-mgr { max-width:1100px; }
.udress-store-meta-form {
  background:var(--white); border:1px solid var(--border);
  border-radius:var(--radius-lg); padding:24px;
  display:flex; flex-wrap:wrap; gap:20px; align-items:flex-end;
  margin-bottom:24px;
}
.udress-showcase-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px; }
.udress-showcase-card { background:var(--white); border:1px solid var(--border); border-radius:var(--radius-lg); overflow:hidden; }
.udress-showcase-card img { width:100%; height:160px; object-fit:cover; }
.udress-sc-info { padding:12px; display:flex; flex-direction:column; gap:6px; font-size:13px; }
.udress-sc-price-edit { display:flex; align-items:center; gap:6px; }
.udress-sc-price-edit input { width:80px; padding:6px 10px; border:1.5px solid var(--border); border-radius:var(--radius); font-size:13px; }

/* ── STORE PUBLIC ────────────────────────────────────────────────────────────── */
.udress-store-page {}
.udress-store-banner {
  background:var(--dark); background-size:cover; background-position:center;
  min-height:220px; display:flex; align-items:center; justify-content:center;
  border-bottom:3px solid var(--pink);
}
.udress-store-banner-overlay { text-align:center; padding:32px 20px; }
.udress-store-banner-overlay h1 { color:var(--white); font-size:32px; }
.udress-store-banner-overlay p  { color:var(--gray-lt); font-size:15px; margin-top:6px; }
.udress-store-body { max-width:1200px; margin:32px auto; padding:0 20px; }

/* ── RESPONSIVE ──────────────────────────────────────────────────────────────── */
@media(max-width:768px) {
  .udress-product-grid { grid-template-columns:repeat(2,1fr); }
  .udress-field { padding:0 20px; }
  .udress-field-row { padding:0 20px; }
  #ud_reg_submit,#ud_login_submit,#ud-upload-submit { width:calc(100% - 40px); margin-left:20px; margin-right:20px; }
  .udress-link { padding:0 20px 20px; }
  #ud-shopkeeper-fee-notice { padding:0 20px 8px; }
  .udress-box h2 { padding:24px 20px; }
  .udress-order-card { flex-direction:column; }
  .udress-stat-cards { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:480px) {
  .udress-product-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .udress-box { margin:24px 12px; }
}