:root{
  --primary-color:var(--store-primary-color,#F2882C);
  --primary-blue:#4348DB;
  --primary-orange:#F2882C;
  --primary-red:#FC2234;
  --bg-color:#ffffff;
  --card-color:#ffffff;
  --text-color:#1f2937;
  --muted-text:#64748b;
  --border-color:#e5e7eb;
}

body{
  background-color:var(--bg-color);
  color:var(--text-color);
}

a,
button,
input,
select,
textarea{
  font-family:inherit;
}

.theme-color-options{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

.theme-color-option{
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border:1px solid var(--border-color);
  border-radius:8px;
  background:var(--card-color);
  color:var(--text-color);
  cursor:pointer;
}

.theme-color-option input{
  accent-color:var(--primary-color);
}

.theme-swatch{
  width:28px;
  height:28px;
  border-radius:50%;
  border:2px solid #fff;
  box-shadow:0 0 0 1px var(--border-color);
  display:inline-block;
}

.store-primary-text{
  color:var(--primary-color);
}

.store-primary-bg{
  background:var(--primary-color);
  color:#fff;
}

/* Dark mode and shared color system */
:root {
  --primary-color: var(--store-primary-color, #ff5c00);
  --primary-hover: color-mix(in srgb, var(--primary-color) 86%, #000000);
  --bg-color: #ffffff;
  --surface-color: #ffffff;
  --surface-soft: #f8fafc;
  --card-color: #ffffff;
  --text-color: #1f2937;
  --muted-text: #64748b;
  --border-color: #e5e7eb;
  --shadow-color: rgba(15, 23, 42, 0.08);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg-color: #111827;
  --surface-color: #182230;
  --surface-soft: #0f172a;
  --card-color: #1f2937;
  --text-color: #f8fafc;
  --muted-text: #cbd5e1;
  --border-color: #334155;
  --shadow-color: rgba(0, 0, 0, 0.35);
}

body,
.product_content,
.public-pagination,
.cart-container,
.checkout-wrapper,
.dashboard-shell {
  background: var(--bg-color) !important;
  color: var(--text-color) !important;
}

.main-desktop-header,
.site-header-panel,
.categories-nav-bar,
.last_post,
.market-hero,
.market-features,
.category-item,
.product,
.product_img,
.empty-products-message,
.panel,
.billing-details,
.cart-table,
.total-section,
.user_container,
.news-item-card,
.promo-banner-container,
.responsive-table,
.responsive-table tr,
.responsive-table th,
.responsive-table td {
  background-color: var(--card-color) !important;
  color: var(--text-color) !important;
  border-color: var(--border-color) !important;
}

.market-hero,
.market-features,
.last_post,
.search_bar form,
.rating-box,
.payment-option,
.wallet-panel,
.wallet-number,
.responsive-table th {
  background-color: var(--surface-soft) !important;
}

.logo-text .site-name,
.market-hero__content h1 span,
.categories-bar__title .line,
.product_section a,
.product_section span,
.store-primary-text,
a:hover,
.category-item:hover h4,
.categories-nav-bar .sections li:hover a,
.categories-nav-bar .sections li.active a {
  color: var(--primary-color) !important;
}

.top-bar,
.button_search,
.btn-primary,
.addToCart,
.stock-label,
.cart-count,
.public-page-link.active,
.empty-products-message a,
.copy-btn,
.btn-confirm,
.update-btn,
.add-cart,
.action-btn,
.theme-toggle,
.site-menu-toggle {
  background-color: var(--primary-color) !important;
  border-color: var(--primary-color) !important;
  color: #ffffff !important;
}

.button_search:hover,
.btn-primary:hover,
.addToCart:hover,
.add-cart:hover,
.action-btn:hover,
.back-btn:hover,
.theme-toggle:hover {
  background-color: var(--primary-hover) !important;
}

.search_bar form:focus-within,
.category-item:hover,
.product:hover,
.news-item-card:hover,
.public-page-link.active,
.payment-option:has(input:checked),
.theme-color-option:has(input:checked) {
  border-color: var(--primary-color) !important;
  box-shadow: 0 8px 22px color-mix(in srgb, var(--primary-color) 18%, transparent) !important;
}

.product_name a,
.product_name span,
.category-item h4,
.feature-box h4,
.market-hero__content h1,
.empty-products-message h1,
.empty-products-message h2,
.checkout-title,
.product-title,
.logo-text p,
.action-item a,
.categories-nav-bar .sections li a,
.search_input,
.form-group label,
.profile-form label {
  color: var(--text-color) !important;
}

.market-hero__content p,
.product_description p,
.product_description a,
.rating-count,
.category,
.description,
.feature-box p,
.input_signup a,
.empty-products-message p,
.logo-text p {
  color: var(--muted-text) !important;
}

input,
select,
textarea,
.qty_input button,
.qty_input input,
.profile-form input,
.form-group input,
.form-group textarea,
.form-group select,
.input_signup input {
  background-color: var(--surface-color) !important;
  color: var(--text-color) !important;
  border-color: var(--border-color) !important;
}

.product-badge,
.discount-percent,
.cart-count {
  border-color: var(--primary-color) !important;
}

.theme-toggle {
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  cursor: pointer;
  font-family: inherit;
}

.theme-toggle .action-label {
  font-size: 11px;
}

html[data-theme="dark"] .action-item > a[href*="user/login.php"] img,
html[data-theme="dark"] .admin-indicator img,
html[data-theme="dark"] .cart-icon-wrapper img {
  filter: invert(1) brightness(1.35);
}


@media (max-width: 480px) {
  .product_content { grid-template-columns: 1fr !important; padding: 18px 10px !important; gap: 16px !important; }
  .market-hero { margin: 10px !important; padding: 24px 14px !important; border-radius: 8px !important; }
  .market-hero__content h1 { font-size: 28px !important; }
  .market-hero__buttons { flex-direction: column !important; }
  .market-hero__buttons .btn { width: 100% !important; height: 48px !important; font-size: 15px !important; }
  .market-features { grid-template-columns: 1fr !important; margin: 24px 10px !important; padding: 16px !important; }
  .category-item { min-width: 108px !important; }
  .cart-container { padding: 24px 10px !important; }
  .total-section { align-items: stretch !important; }
  .total-section .actions, .checkout-btn { width: 100% !important; text-align: center !important; }
  .user_container { max-width: calc(100% - 20px) !important; padding: 24px 18px !important; }
}

@media (min-width: 480px) and (max-width: 768px) {
  .product_content { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; padding: 24px 14px !important; gap: 18px !important; }
  .market-hero { margin: 14px !important; padding: 32px 20px !important; }
  .market-features { grid-template-columns: repeat(2, 1fr) !important; margin: 30px 14px !important; }
}

@media (min-width: 768px) and (max-width: 992px) {
  .product_content { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; padding: 30px 20px !important; }
  .main-desktop-header { grid-template-columns: 1fr !important; }
}

@media (min-width: 1200px) {
  .product_content { grid-template-columns: repeat(4, minmax(0, 1fr)); max-width: 1440px; margin: 0 auto; }
}
.login-error-message {
  color: #b91c1c;
  background: #fef2f2;
  border: 1px solid #fecaca;
  border-radius: 8px;
  padding: 10px 12px;
  line-height: 1.7;
  margin-bottom: 14px;
}

html[data-theme="dark"] .login-error-message {
  color: #fecaca;
  background: #3f1d1d;
  border-color: #7f1d1d;
}
