/* =====================================================
   SKILLSYM MARKETPLACE — COMPLETE DARK THEME FIX
   Fixes: white forms, white text, all UI components
   ===================================================== */

/* ── ROOT DARK THEME ── */
:root {
  --ssmp-primary: #00C6FF;
  --ssmp-secondary: #0057B8;
  --ssmp-accent: #FFB830;
  --ssmp-success: #00D68F;
  --ssmp-danger: #FF4757;
  --ssmp-dark: #03112A;
  --ssmp-mid: #071D3E;
  --ssmp-card: rgba(255,255,255,0.04);
  --ssmp-card-border: rgba(0,198,255,0.15);
  --ssmp-text: #FFFFFF;
  --ssmp-muted: #8A9BBC;
  --ssmp-radius: 14px;
  --ssmp-btn-radius: 100px;
  --ssmp-font: 'Poppins', sans-serif;
  --ssmp-input-bg: rgba(255,255,255,0.05);
  --ssmp-input-border: rgba(0,198,255,0.2);
  --ssmp-t: all 0.3s ease;
}

/* ── GLOBAL MARKETPLACE WRAPPER ── */
.ssmp-marketplace,
.ssmp-marketplace * {
  box-sizing: border-box;
  font-family: var(--ssmp-font) !important;
}
.ssmp-marketplace { background: var(--ssmp-dark); color: var(--ssmp-text); min-height: 60vh; }

/* ── ALL INPUTS — DARK THEME ── */
.ssmp-marketplace input[type="text"],
.ssmp-marketplace input[type="email"],
.ssmp-marketplace input[type="tel"],
.ssmp-marketplace input[type="number"],
.ssmp-marketplace input[type="url"],
.ssmp-marketplace input[type="date"],
.ssmp-marketplace input[type="password"],
.ssmp-marketplace input[type="search"],
.ssmp-marketplace select,
.ssmp-marketplace textarea,
.ssmp-form-field input,
.ssmp-form-field select,
.ssmp-form-field textarea,
.ssmp-post-form input,
.ssmp-post-form select,
.ssmp-post-form textarea {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(0,198,255,0.2) !important;
  border-radius: 10px !important;
  padding: 11px 14px !important;
  color: #ffffff !important;
  font-family: var(--ssmp-font) !important;
  font-size: 0.9rem !important;
  outline: none !important;
  width: 100% !important;
  transition: border 0.2s, box-shadow 0.2s !important;
  -webkit-appearance: none;
  appearance: none;
}
.ssmp-marketplace input:focus,
.ssmp-marketplace select:focus,
.ssmp-marketplace textarea:focus,
.ssmp-form-field input:focus,
.ssmp-form-field select:focus,
.ssmp-form-field textarea:focus {
  border-color: var(--ssmp-primary) !important;
  box-shadow: 0 0 0 3px rgba(0,198,255,0.12) !important;
}
.ssmp-marketplace input::placeholder,
.ssmp-marketplace textarea::placeholder {
  color: rgba(138,155,188,0.7) !important;
}
/* Select arrow */
.ssmp-marketplace select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%238A9BBC'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  padding-right: 36px !important;
  cursor: pointer !important;
}
.ssmp-marketplace select option {
  background: #071D3E !important;
  color: #fff !important;
}

/* ── ALL CARDS & SECTIONS — DARK ── */
.ssmp-card,
.ssmp-form-section,
.ssmp-sidebar-widget,
.ssmp-contact-card,
.ssmp-package-card,
.ssmp-dash-sidebar,
.ssmp-cart-item,
.ssmp-payment-method,
.ssmp-stripe-wrap,
.ssmp-bank-details,
.ssmp-checkout-wrap > div {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(0,198,255,0.15) !important;
  border-radius: var(--ssmp-radius) !important;
  color: var(--ssmp-text) !important;
}

/* ── LABELS ── */
.ssmp-marketplace label,
.ssmp-form-field label,
.ssmp-field-label {
  color: var(--ssmp-muted) !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  display: block !important;
  margin-bottom: 7px !important;
}

/* ── HEADINGS & TEXT ── */
.ssmp-marketplace h1,
.ssmp-marketplace h2,
.ssmp-marketplace h3,
.ssmp-marketplace h4,
.ssmp-marketplace h5 {
  color: #ffffff !important;
}
.ssmp-marketplace p {
  color: var(--ssmp-muted) !important;
}
.ssmp-marketplace strong { color: #fff !important; }
.ssmp-marketplace a { color: var(--ssmp-primary); text-decoration: none; }
.ssmp-marketplace a:hover { color: #fff; }

/* ── SEARCH BOX ── */
.ssmp-search-wrap {
  background: linear-gradient(135deg, rgba(0,87,184,0.2), rgba(0,198,255,0.08)) !important;
  border-bottom: 1px solid rgba(0,198,255,0.15) !important;
  padding: 28px 0 !important;
}
.ssmp-search-box {
  display: flex; gap: 10px; align-items: center;
  background: rgba(255,255,255,0.06) !important;
  border: 1.5px solid rgba(0,198,255,0.25) !important;
  border-radius: 100px !important;
  padding: 6px 6px 6px 20px !important;
  backdrop-filter: blur(10px);
}
.ssmp-search-input {
  flex: 1; background: transparent !important; border: none !important;
  outline: none !important; color: #fff !important;
  font-size: 0.95rem !important; padding: 6px 0 !important;
}
.ssmp-search-input::placeholder { color: rgba(138,155,188,0.7) !important; }
.ssmp-search-cat {
  background: rgba(0,198,255,0.08) !important;
  border: 1px solid rgba(0,198,255,0.2) !important;
  color: var(--ssmp-muted) !important;
  border-radius: 100px !important;
  padding: 7px 30px 7px 14px !important;
  font-size: 0.82rem !important;
}
.ssmp-search-btn {
  background: linear-gradient(135deg, var(--ssmp-primary), var(--ssmp-secondary)) !important;
  color: #fff !important; border: none !important;
  border-radius: 100px !important; padding: 10px 26px !important;
  font-weight: 700 !important; cursor: pointer !important;
  font-size: 0.88rem !important; white-space: nowrap !important;
  transition: var(--ssmp-t) !important;
}
.ssmp-search-btn:hover { filter: brightness(1.1) !important; transform: translateY(-2px) !important; }

/* ── FILTERS BAR ── */
.ssmp-filters {
  background: var(--ssmp-mid) !important;
  border-bottom: 1px solid rgba(0,198,255,0.1) !important;
  padding: 14px 0 !important;
  position: sticky; top: 0; z-index: 900;
}
.ssmp-filters-inner {
  max-width: 1200px; margin: 0 auto; padding: 0 24px;
  display: flex; gap: 10px; align-items: center; flex-wrap: wrap;
}
.ssmp-filter-select {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(0,198,255,0.18) !important;
  border-radius: 100px !important; padding: 8px 32px 8px 16px !important;
  color: var(--ssmp-muted) !important; font-size: 0.82rem !important;
  font-weight: 600 !important; cursor: pointer !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='%238A9BBC'%3E%3Cpath d='M7 10l5 5 5-5px'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 10px center !important;
  -webkit-appearance: none; appearance: none;
}
.ssmp-filter-select:hover, .ssmp-filter-select:focus {
  border-color: var(--ssmp-primary) !important;
  color: var(--ssmp-primary) !important; outline: none !important;
}
.ssmp-price-range {
  display: flex; gap: 8px; align-items: center;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(0,198,255,0.18) !important;
  border-radius: 100px !important; padding: 6px 16px !important;
}
.ssmp-price-range input {
  width: 80px !important; background: transparent !important;
  border: none !important; color: #fff !important;
  font-size: 0.82rem !important; outline: none !important;
}
.ssmp-price-range span { color: var(--ssmp-muted); font-size: 0.82rem; }
.ssmp-filter-btn {
  background: rgba(0,198,255,0.1) !important;
  border: 1px solid rgba(0,198,255,0.25) !important;
  color: var(--ssmp-primary) !important; border-radius: 100px !important;
  padding: 8px 16px !important; font-size: 0.8rem !important;
  font-weight: 700 !important; cursor: pointer !important;
  transition: var(--ssmp-t) !important; white-space: nowrap !important;
  font-family: var(--ssmp-font) !important;
}
.ssmp-filter-btn:hover { background: rgba(0,198,255,0.2) !important; }
.ssmp-filter-btn.active { background: var(--ssmp-primary) !important; color: #000 !important; }

/* ── VIEW BUTTONS ── */
.ssmp-view-btn {
  width: 36px; height: 36px; border-radius: 8px;
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(255,255,255,0.1) !important;
  color: var(--ssmp-muted) !important; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem; transition: var(--ssmp-t);
}
.ssmp-view-btn.active, .ssmp-view-btn:hover {
  background: rgba(0,198,255,0.15) !important;
  border-color: var(--ssmp-primary) !important;
  color: var(--ssmp-primary) !important;
}
.ssmp-sort-select {
  background: rgba(255,255,255,0.05) !important;
  border: 1px solid rgba(0,198,255,0.18) !important;
  border-radius: 8px !important; padding: 7px 14px !important;
  color: var(--ssmp-muted) !important; font-size: 0.82rem !important;
}

/* ── LISTING GRID ── */
.ssmp-layout { max-width: 1200px; margin: 0 auto; padding: 28px 24px; display: flex; gap: 26px; }
.ssmp-sidebar { width: 260px; flex-shrink: 0; }
.ssmp-main { flex: 1; min-width: 0; }
.ssmp-listing-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.ssmp-listing-list { display: flex; flex-direction: column; gap: 14px; }

/* ── LISTING CARD ── */
.ssmp-card {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(0,198,255,0.12) !important;
  border-radius: var(--ssmp-radius) !important;
  overflow: hidden; position: relative;
  transition: var(--ssmp-t); display: flex; flex-direction: column;
}
.ssmp-card:hover {
  transform: translateY(-6px) !important;
  border-color: rgba(0,198,255,0.4) !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3) !important;
}
.ssmp-card-img { position: relative; height: 200px; overflow: hidden; background: var(--ssmp-mid); }
.ssmp-card-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.4s; }
.ssmp-card:hover .ssmp-card-img img { transform: scale(1.05); }
.ssmp-card-body { padding: 16px; flex: 1; display: flex; flex-direction: column; gap: 8px; }
.ssmp-card-cat { font-size: 0.72rem; font-weight: 700; color: var(--ssmp-primary); text-transform: uppercase; letter-spacing: 0.08em; }
.ssmp-card-title { font-size: 0.96rem; font-weight: 600; color: #fff !important; line-height: 1.35; }
.ssmp-card-title a { color: #fff !important; text-decoration: none; }
.ssmp-card-title a:hover { color: var(--ssmp-primary) !important; }
.ssmp-card-location { display: flex; align-items: center; gap: 5px; font-size: 0.78rem; color: var(--ssmp-muted); }
.ssmp-card-meta { display: flex; gap: 12px; flex-wrap: wrap; font-size: 0.74rem; color: var(--ssmp-muted); }
.ssmp-card-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid rgba(255,255,255,0.05); display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ssmp-card-price { font-size: 1.15rem; font-weight: 800; color: var(--ssmp-primary) !important; font-family: var(--ssmp-font); }

/* ── ADD TO CART BUTTON ── */
.ssmp-atc-btn {
  background: linear-gradient(135deg, var(--ssmp-primary), var(--ssmp-secondary)) !important;
  color: #fff !important; border: none !important;
  border-radius: var(--ssmp-btn-radius) !important;
  padding: 8px 16px !important; font-weight: 700 !important;
  font-size: 0.78rem !important; cursor: pointer !important;
  transition: var(--ssmp-t) !important; white-space: nowrap !important;
  font-family: var(--ssmp-font) !important;
  display: inline-flex !important; align-items: center !important; gap: 5px !important;
  text-decoration: none !important;
}
.ssmp-atc-btn:hover { transform: translateY(-2px) !important; filter: brightness(1.1) !important; }

/* ── BADGES ── */
.ssmp-badges { position: absolute; top: 8px; left: 8px; display: flex; flex-direction: column; gap: 4px; z-index: 1; }
.ssmp-badge { display: inline-flex; align-items: center; gap: 3px; padding: 3px 9px; border-radius: 100px; font-size: 0.68rem; font-weight: 700; backdrop-filter: blur(8px); white-space: nowrap; font-family: var(--ssmp-font); }
.ssmp-badge-featured { background: rgba(255,184,48,0.9); color: #000; }
.ssmp-badge-urgent   { background: rgba(255,71,87,0.9); color: #fff; }
.ssmp-badge-new      { background: rgba(0,198,255,0.9); color: #000; }
.ssmp-badge-sold     { background: rgba(0,0,0,0.7); color: #fff; }
.ssmp-badge-verified { background: rgba(0,214,143,0.9); color: #000; }
.ssmp-badge-free     { background: rgba(0,214,143,0.85); color: #000; }
.ssmp-badge-video    { background: rgba(255,71,87,0.85); color: #fff; }

/* ── SIDEBAR WIDGETS ── */
.ssmp-sidebar-widget {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(0,198,255,0.12) !important;
  border-radius: var(--ssmp-radius) !important;
  padding: 20px !important; margin-bottom: 16px !important;
}
.ssmp-sidebar-widget h4 {
  color: #fff !important; font-size: 0.88rem !important;
  margin-bottom: 14px !important; padding-bottom: 10px !important;
  border-bottom: 1px solid rgba(0,198,255,0.1) !important;
}
.ssmp-cat-list { list-style: none !important; display: flex; flex-direction: column; gap: 6px; }
.ssmp-cat-list li a { display: flex; align-items: center; justify-content: space-between; color: var(--ssmp-muted) !important; font-size: 0.84rem; transition: var(--ssmp-t); padding: 3px 0; text-decoration: none; }
.ssmp-cat-list li a:hover, .ssmp-cat-list li a.active { color: var(--ssmp-primary) !important; padding-left: 4px; }
.ssmp-cat-count { background: rgba(0,198,255,0.1); border-radius: 100px; font-size: 0.7rem; padding: 2px 8px; color: var(--ssmp-primary); }
.ssmp-checkbox-list { display: flex; flex-direction: column; gap: 8px; }
.ssmp-checkbox-list label { display: flex; align-items: center; gap: 9px; color: var(--ssmp-muted) !important; font-size: 0.84rem; cursor: pointer; font-weight: 400 !important; text-transform: none !important; letter-spacing: 0 !important; }
.ssmp-checkbox-list input[type=checkbox] { accent-color: var(--ssmp-primary); width: 16px; height: 16px; }

/* ── POST LISTING FORM ── */
.ssmp-post-form { max-width: 820px; margin: 0 auto; padding: 30px 24px; }
.ssmp-form-section {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(0,198,255,0.12) !important;
  border-radius: var(--ssmp-radius) !important;
  padding: 26px !important; margin-bottom: 20px !important;
}
.ssmp-form-section h3 { color: #fff !important; margin-bottom: 18px !important; font-size: 1rem !important; display: flex; align-items: center; gap: 8px; }
.ssmp-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.ssmp-form-field { display: flex; flex-direction: column; gap: 6px; }
.ssmp-form-full { grid-column: 1 / -1; }
/* Upload zone */
.ssmp-upload-zone {
  border: 2px dashed rgba(0,198,255,0.3) !important;
  border-radius: 12px !important; padding: 36px 20px !important;
  text-align: center !important; cursor: pointer !important;
  background: rgba(0,198,255,0.02) !important; transition: var(--ssmp-t) !important;
}
.ssmp-upload-zone:hover, .ssmp-upload-zone.drag-over {
  border-color: var(--ssmp-primary) !important;
  background: rgba(0,198,255,0.06) !important;
}
.ssmp-upload-zone p { color: var(--ssmp-muted) !important; font-size: 0.86rem; margin: 6px 0 0; }
.ssmp-upload-zone strong { color: #fff !important; }
.ssmp-preview-grid { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.ssmp-preview-item { position: relative; display: inline-block; }
.ssmp-preview-img { width: 90px; height: 70px; border-radius: 8px; object-fit: cover; border: 2px solid rgba(0,198,255,0.3); }
.ssmp-preview-remove { position: absolute; top: -6px; right: -6px; background: #ff4757; color: #fff; border: none; border-radius: 50%; width: 20px; height: 20px; font-size: 0.7rem; cursor: pointer; display: flex; align-items: center; justify-content: center; font-family: var(--ssmp-font); }

/* ── SUBMIT BUTTON ── */
.ssmp-submit-btn {
  background: linear-gradient(135deg, var(--ssmp-primary), var(--ssmp-secondary)) !important;
  color: #fff !important; border: none !important;
  border-radius: var(--ssmp-btn-radius) !important;
  padding: 14px 40px !important; font-size: 0.95rem !important;
  font-weight: 700 !important; cursor: pointer !important;
  transition: var(--ssmp-t) !important; font-family: var(--ssmp-font) !important;
}
.ssmp-submit-btn:hover { filter: brightness(1.1) !important; transform: translateY(-2px) !important; }
.ssmp-submit-btn:disabled { opacity: 0.6 !important; cursor: not-allowed !important; transform: none !important; }

/* ── FORM MESSAGES ── */
.ssmp-toast-success {
  background: rgba(0,214,143,0.12) !important; border: 1px solid rgba(0,214,143,0.3) !important;
  color: var(--ssmp-success) !important; padding: 14px 18px !important;
  border-radius: 10px !important; font-size: 0.88rem !important; margin-top: 14px !important;
}
.ssmp-toast-error {
  background: rgba(255,71,87,0.1) !important; border: 1px solid rgba(255,71,87,0.3) !important;
  color: #ff4757 !important; padding: 14px 18px !important;
  border-radius: 10px !important; font-size: 0.88rem !important; margin-top: 14px !important;
}
.ssmp-upgrade-link { color: var(--ssmp-accent) !important; font-weight: 700 !important; margin-left: 8px !important; }

/* ── PACKAGES ── */
.ssmp-packages-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-top: 36px; }
.ssmp-package-card {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(0,198,255,0.15) !important;
  border-radius: var(--ssmp-radius) !important;
  padding: 30px 22px !important; display: flex; flex-direction: column; position: relative;
  transition: var(--ssmp-t) !important;
}
.ssmp-package-card:hover { transform: translateY(-6px) !important; border-color: rgba(0,198,255,0.4) !important; box-shadow: 0 20px 60px rgba(0,0,0,0.3) !important; }
.ssmp-package-card.popular { border-color: var(--ssmp-primary) !important; }
.ssmp-package-badge { position: absolute; top: -13px; left: 50%; transform: translateX(-50%); background: linear-gradient(135deg,var(--ssmp-primary),var(--ssmp-secondary)); color: #fff; font-size: 0.7rem; font-weight: 700; padding: 4px 16px; border-radius: 100px; white-space: nowrap; font-family: var(--ssmp-font); }
.ssmp-package-name { font-size: 1.1rem; font-weight: 700; color: #fff !important; margin-bottom: 5px; }
.ssmp-package-price { font-size: 2.4rem; font-weight: 800; color: var(--ssmp-primary) !important; line-height: 1; margin: 14px 0; }
.ssmp-package-price span { font-size: 0.9rem; color: var(--ssmp-muted) !important; font-weight: 400; }
.ssmp-package-features { list-style: none !important; margin-bottom: 24px; flex-grow: 1; }
.ssmp-package-features li { display: flex; align-items: center; gap: 9px; font-size: 0.85rem; color: var(--ssmp-muted) !important; margin-bottom: 9px; padding: 4px 0; border-bottom: 1px solid rgba(255,255,255,0.04); }
.ssmp-package-features li::before { content: '✔'; color: var(--ssmp-success); font-size: 0.75rem; flex-shrink: 0; }
.ssmp-package-features li.disabled { opacity: 0.4; }
.ssmp-package-features li.disabled::before { content: '✕'; color: var(--ssmp-danger); }

/* ── DASHBOARD ── */
.ssmp-dashboard-wrap { max-width: 1200px; margin: 0 auto; padding: 36px 24px; display: grid; grid-template-columns: 230px 1fr; gap: 28px; }
.ssmp-dash-sidebar { background: rgba(255,255,255,0.03) !important; border: 1px solid rgba(0,198,255,0.12) !important; border-radius: var(--ssmp-radius) !important; padding: 22px !important; height: fit-content; }
.ssmp-dash-name { text-align: center; font-weight: 700; color: #fff !important; margin-bottom: 4px; }
.ssmp-dash-email { text-align: center; font-size: 0.76rem; color: var(--ssmp-muted) !important; margin-bottom: 18px; }
.ssmp-dash-nav { list-style: none !important; display: flex; flex-direction: column; gap: 3px; }
.ssmp-dash-nav a { display: flex; align-items: center; gap: 9px; padding: 10px 12px; border-radius: 10px; color: var(--ssmp-muted) !important; font-size: 0.86rem; font-weight: 600; transition: var(--ssmp-t); text-decoration: none; }
.ssmp-dash-nav a:hover, .ssmp-dash-nav a.active { background: rgba(0,198,255,0.1) !important; color: var(--ssmp-primary) !important; }
.ssmp-dash-stats { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; margin-bottom: 24px; }
.ssmp-dash-stat { background: rgba(255,255,255,0.03) !important; border: 1px solid rgba(0,198,255,0.12) !important; border-radius: 12px !important; padding: 16px !important; text-align: center; }
.ssmp-dash-stat .n { font-size: 1.6rem; font-weight: 800; color: var(--ssmp-primary) !important; }
.ssmp-dash-stat .l { font-size: 0.74rem; color: var(--ssmp-muted) !important; margin-top: 4px; }

/* ── CHECKOUT ── */
.ssmp-checkout-wrap { max-width: 860px; margin: 0 auto; padding: 36px 24px; }
.ssmp-payment-method { background: rgba(255,255,255,0.04) !important; border: 2px solid rgba(0,198,255,0.12) !important; border-radius: 12px !important; padding: 16px !important; text-align: center; cursor: pointer; transition: var(--ssmp-t); }
.ssmp-payment-method:hover { border-color: rgba(0,198,255,0.35) !important; }
.ssmp-payment-method.selected { border-color: var(--ssmp-primary) !important; background: rgba(0,198,255,0.08) !important; }
.ssmp-payment-method .method-icon { font-size: 1.6rem; margin-bottom: 6px; }
.ssmp-payment-method .method-name { font-size: 0.82rem; font-weight: 700; color: #fff !important; }
.ssmp-payment-method .method-desc { font-size: 0.7rem; color: var(--ssmp-muted) !important; margin-top: 2px; }
.ssmp-pay-btn { background: linear-gradient(135deg, var(--ssmp-primary), var(--ssmp-secondary)) !important; color: #fff !important; border: none !important; border-radius: var(--ssmp-btn-radius) !important; padding: 14px 40px !important; font-size: 0.95rem !important; font-weight: 700 !important; cursor: pointer !important; width: 100% !important; margin-top: 18px !important; font-family: var(--ssmp-font) !important; transition: var(--ssmp-t) !important; }
.ssmp-pay-btn:hover { filter: brightness(1.1) !important; transform: translateY(-2px) !important; }
.ssmp-pay-btn:disabled { opacity: 0.6 !important; cursor: not-allowed !important; transform: none !important; }

/* ── CART ── */
.ssmp-cart-wrap { max-width: 900px; margin: 0 auto; padding: 36px 24px; }
.ssmp-cart-item { display: flex; align-items: center; gap: 16px; background: rgba(255,255,255,0.03) !important; border: 1px solid rgba(0,198,255,0.1) !important; border-radius: 12px !important; padding: 16px !important; margin-bottom: 12px !important; }
.ssmp-cart-item-title { font-weight: 600; color: #fff !important; margin-bottom: 3px; }
.ssmp-cart-item-price { color: var(--ssmp-primary) !important; font-weight: 700; }
.ssmp-cart-remove { background: rgba(255,71,87,0.1) !important; border: 1px solid rgba(255,71,87,0.3) !important; color: #ff4757 !important; border-radius: 8px !important; padding: 6px 12px !important; cursor: pointer !important; font-size: 0.78rem !important; transition: var(--ssmp-t) !important; }

/* ── AUTH FORMS ── */
.ssmp-marketplace #ssmp-tab-login,
.ssmp-marketplace #ssmp-tab-register { color: #fff !important; }
.ssmp-auth-tab { font-family: var(--ssmp-font) !important; font-size: 0.88rem !important; cursor: pointer !important; }

/* ── AUTOCOMPLETE ── */
.ssmp-autocomplete { background: var(--ssmp-mid) !important; border: 1px solid rgba(0,198,255,0.2) !important; border-radius: 14px !important; overflow: hidden; z-index: 1000; box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important; }
.ssmp-autocomplete-item { display: flex; align-items: center; gap: 12px; padding: 11px 16px !important; transition: var(--ssmp-t); cursor: pointer; border-bottom: 1px solid rgba(255,255,255,0.04); text-decoration: none; }
.ssmp-autocomplete-item:hover { background: rgba(0,198,255,0.08) !important; }
.ssmp-autocomplete-title { color: #fff !important; font-weight: 600; font-size: 0.88rem; }
.ssmp-autocomplete-price { color: var(--ssmp-primary) !important; font-weight: 700; font-size: 0.82rem; }

/* ── PAGINATION ── */
.ssmp-page-btn { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(0,198,255,0.2) !important; color: #fff !important; padding: 8px 16px !important; border-radius: 8px !important; cursor: pointer !important; font-size: 0.84rem !important; font-weight: 600 !important; transition: var(--ssmp-t) !important; font-family: var(--ssmp-font) !important; }
.ssmp-page-btn.active, .ssmp-page-btn:hover { background: var(--ssmp-primary) !important; border-color: var(--ssmp-primary) !important; color: #000 !important; }

/* ── NOTIFICATION BELL ── */
.ssmp-notif-bell { background: rgba(255,255,255,0.06) !important; border: 1px solid rgba(255,255,255,0.1) !important; border-radius: 50% !important; width: 36px !important; height: 36px !important; display: flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; font-size: 0.9rem !important; }
.ssmp-notif-dropdown { background: var(--ssmp-mid) !important; border: 1px solid rgba(0,198,255,0.2) !important; border-radius: 14px !important; box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important; }
.ssmp-notif-item { padding: 12px 16px !important; border-bottom: 1px solid rgba(255,255,255,0.04) !important; cursor: pointer !important; }
.ssmp-notif-item:hover { background: rgba(0,198,255,0.05) !important; }
.ssmp-notif-msg { font-size: 0.82rem !important; color: var(--ssmp-muted) !important; line-height: 1.5 !important; }
.ssmp-notif-item.unread { border-left: 3px solid var(--ssmp-primary) !important; }

/* ── CONTACT CARD ── */
.ssmp-contact-card { background: rgba(255,255,255,0.03) !important; border: 1px solid rgba(0,198,255,0.15) !important; border-radius: var(--ssmp-radius) !important; padding: 22px !important; }
.ssmp-contact-price { font-size: 1.9rem; font-weight: 800; color: var(--ssmp-primary) !important; margin-bottom: 14px; }
.ssmp-contact-btn { display: flex; align-items: center; justify-content: center; gap: 9px; padding: 12px !important; border-radius: var(--ssmp-btn-radius) !important; font-weight: 700 !important; font-size: 0.88rem !important; cursor: pointer !important; transition: var(--ssmp-t) !important; border: none !important; font-family: var(--ssmp-font) !important; text-decoration: none !important; }
.ssmp-contact-btn-primary { background: linear-gradient(135deg,var(--ssmp-primary),var(--ssmp-secondary)) !important; color: #fff !important; }
.ssmp-contact-btn-wa { background: #25D366 !important; color: #fff !important; }
.ssmp-contact-btn-phone { background: rgba(0,198,255,0.1) !important; color: var(--ssmp-primary) !important; border: 1px solid rgba(0,198,255,0.3) !important; }
.ssmp-contact-btn-cart { background: var(--ssmp-accent) !important; color: #000 !important; }
.ssmp-contact-btn:hover { transform: translateY(-2px) !important; filter: brightness(1.08) !important; }

/* ── SKELETON LOADERS ── */
.ssmp-skeleton { background: linear-gradient(90deg,rgba(255,255,255,0.05) 25%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.05) 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; border-radius: 8px; }
@keyframes shimmer { 0%{background-position:200% 0} 100%{background-position:-200% 0} }

/* ── RESPONSIVE ── */
@media(max-width:1024px){ .ssmp-listing-grid{grid-template-columns:repeat(2,1fr)!important;} .ssmp-packages-grid{grid-template-columns:1fr!important;} .ssmp-dashboard-wrap{grid-template-columns:1fr!important;} }
@media(max-width:768px){ .ssmp-layout{flex-direction:column!important;} .ssmp-sidebar{width:100%!important;} .ssmp-listing-grid{grid-template-columns:repeat(2,1fr)!important;} .ssmp-form-grid{grid-template-columns:1fr!important;} .ssmp-dash-stats{grid-template-columns:repeat(2,1fr)!important;} }
@media(max-width:480px){ .ssmp-listing-grid{grid-template-columns:1fr!important;} }

/* ════ CRITICAL GRID FIX — prevents cards stacking ════ */
.ssmp-listing-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:20px!important;width:100%!important;}
.ssmp-listing-list{display:flex!important;flex-direction:column!important;gap:14px!important;}
.ssmp-card{width:100%!important;float:none!important;display:flex!important;flex-direction:column!important;position:relative!important;}
.ssmp-layout{display:flex!important;gap:26px!important;max-width:1200px!important;margin:0 auto!important;padding:28px 24px!important;}
.ssmp-main{flex:1!important;min-width:0!important;}
.ssmp-sidebar{width:260px!important;flex-shrink:0!important;}
.ssmp-card-img{height:200px!important;overflow:hidden!important;background:var(--ssmp-mid,#071D3E)!important;position:relative!important;}
.ssmp-card-img img{width:100%!important;height:100%!important;object-fit:cover!important;}
.ssmp-card-body{padding:16px!important;flex:1!important;display:flex!important;flex-direction:column!important;gap:8px!important;}
@media(max-width:1024px){.ssmp-listing-grid{grid-template-columns:repeat(2,1fr)!important;}}
@media(max-width:768px){.ssmp-layout{flex-direction:column!important;}.ssmp-sidebar{width:100%!important;}.ssmp-listing-grid{grid-template-columns:repeat(2,1fr)!important;}}
@media(max-width:480px){.ssmp-listing-grid{grid-template-columns:1fr!important;}}