/* Light theme — brighter, warmer tones */
:root{
  --bg: #fbfbfb;
  --text: #1f2933;
  --muted: #6b7280;
  --card-bg: #ffffff;
  --header-bg: #057437; /* keep dark header for contrast */
  --footer-bg: #057437;
  --primary: #0d9488; /* teal accent */
  /* product title color (theme-controlled) */
  --product-title-color: #1f2933;
  /* header/footer variables used by main stylesheet */
  --site-header-bg: var(--header-bg);
  --site-header-color: #ffffff;
  --site-footer-bg: var(--footer-bg);
  --site-footer-color: #e6eef0;
  --shop-link-color: #0d6efd; /* bootstrap primary for light theme */
  /* checkout / input backgrounds for light theme (semi-transparent) */
  --input-bg: rgba(255,255,255,0.92);
  --input-border: rgba(0,0,0,0.06);
  --feature-band-color: #1BE069; /* green accent for feature band */
}

body { background-color: var(--bg); color: var(--text); }
.navbar-brand { color: #e6f6f5; }
.bg-dark, .navbar-dark { background-color: var(--header-bg) !important; }
.card { background-color: var(--card-bg); color: var(--text); }
.text-muted { color: var(--muted) !important; }
footer.footer { background-color: var(--footer-bg); }

.btn-primary { background-color: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background-color: #0b7b71; }

/* category button tweaks */
.category-link.btn-outline-secondary { color: var(--text); }
.category-link.btn-outline-secondary:hover { color: #fff; background-color: #6c757d; }

/* a few more subtle brightening rules */
.table-light { background-color: #ffffff; }

/* Ensure header/nav/footer use the theme's variables and cannot be overridden by Bootstrap defaults */
header, .navbar, .bg-dark, .navbar-dark {
  background-color: var(--site-header-bg) !important;
  color: var(--site-header-color) !important;
}
header .nav-link, .navbar .nav-link {
  color: var(--site-header-color) !important;
}
header .nav-link:hover, .navbar .nav-link:hover {
  color: var(--shop-link-color) !important;
}
footer.footer {
  background-color: var(--site-footer-bg) !important;
  color: var(--site-footer-color) !important;
}

/* Table border color for themed outlines */
:root{
  --table-border-color: rgba(0,0,0,0.12);
}

/* Make bordered tables visually transparent but keep the outline colored by theme */
.table.table-bordered {
  background-color: transparent !important;
  border-color: var(--table-border-color) !important;
}
.table.table-bordered thead,
.table.table-bordered tbody,
.table.table-bordered tfoot,
.table.table-bordered th,
.table.table-bordered td {
  background-color: transparent !important;
  border-color: var(--table-border-color) !important;
}

/* Slightly stronger outline for focus areas like the cart totals box */
.border, .card, .table-bordered {
  box-shadow: none;
}

/* Ensure table cell text follows the theme text color */
.table.table-bordered, .table.table-bordered th, .table.table-bordered td {
  color: var(--text) !important;
}
.table.table-bordered a { color: var(--shop-link-color) !important; }

/* Make quantity inputs blend into the transparent table */
.form-control.qty-input, .form-control.qty-input:focus {
  background-color: transparent !important;
  color: var(--text) !important;
  border-color: var(--table-border-color) !important;
  box-shadow: none !important;
}
.form-control.qty-input::placeholder { color: var(--muted) !important; opacity: 1; }

/* Compact theme switch styling and navbar housekeeping */
.theme-switch { display:inline-flex; align-items:center; gap:0.4rem; }
.theme-switch .theme-icon { width:18px; height:18px; color: var(--site-header-color); }
.theme-switch .form-check-input { width:2.0rem; height:1.1rem; padding:0; margin:0; -webkit-appearance:none; appearance:none; background:transparent; border:0; position:relative; }
.theme-switch .form-check-input { cursor:pointer; }
.theme-switch .form-check-input::before { content:''; display:block; width:36px; height:20px; background:#222; border-radius:999px; border:1px solid rgba(0,0,0,0.12); box-shadow: inset 0 1px 0 rgba(255,255,255,0.02); transition:background .15s ease, border-color .15s ease; }
.theme-switch .form-check-input::after { content:''; position:relative; display:block; width:16px; height:16px; border-radius:50%; background:#fff; margin-top:-18px; margin-left:2px; transform:translateX(0); transition:transform .18s ease, background .18s ease; box-shadow:0 1px 3px rgba(0,0,0,0.25); }
.theme-switch .form-check-input:checked::before { background: var(--primary); border-color: var(--primary); }
.theme-switch .form-check-input:checked::after { transform: translateX(16px); background:#fff; }
.theme-switch .theme-label { display:none; }

/* remove stray list markers in navbar */
.navbar-nav, .navbar-nav li, .navbar .nav-item { list-style: none !important; }

/* smaller icon sizing in compact header */
.theme-switch .theme-icon { width:16px; height:16px; }

/* pull the sun icon closer to the toggle and nudge the moon */
.theme-switch .theme-icon:first-child { margin-right: 0.08rem; }
.theme-switch .theme-icon:last-child { margin-left: 0.15rem; }

/* Checkout page: semi-transparent form fields to match shop/article style */
#checkout-form .form-control, #checkout-form textarea, #checkout-form .form-select {
  background-color: var(--input-bg) !important;
  border: 1px solid var(--input-border) !important;
  color: var(--text) !important;
  box-shadow: none !important;
}
#checkout-form .form-control::placeholder { color: var(--muted) !important; opacity: 1; }

/* Product titles controlled by theme variables and remove link underlines */
.product-name, .product-name a, .product-title, .product-title a {
  color: var(--product-title-color) !important;
  text-decoration: none !important;
}

/* also ensure card-title anchors follow theme */
.card-title a { color: var(--product-title-color) !important; text-decoration: none !important; }
