/* =====================================================
   PREMIUM DEEP BLUE + GLASSMORPHISM THEME
   SADECE TASARIM – LOGIC DOKUNULMAZ
   ===================================================== */

:root {
  --bg-main: radial-gradient(
    1200px 600px at 50% -200px,
    #2a2f5f 0%,
    #14183a 45%,
    #0b0e22 100%
  );

  --glass-bg: rgba(24, 30, 64, 0.88);
  --glass-border: rgba(255,255,255,0.06);

  --text-main: #e9edff;
  --text-muted: #8f97c9;

  --accent-blue: #37c3ff;
  --accent-yellow: #ffc107;
  --accent-yellow-hover: #ffb300;

  --radius-lg: 20px;
  --radius-md: 14px;
}

/* ================= GLOBAL ================= */
html, body {
  background: var(--bg-main) !important;
  color: var(--text-main);
}

* {
  scrollbar-width: thin;
  scrollbar-color: #2f3a7a transparent;
}

/* ================= CONTAINERS ================= */
.container,
.main,
.wrapper,
.content {
  background: transparent !important;
}

/* ================= CARDS ================= */
.card,
.product-card,
.menu-card,
.cart-box,
.order-box,
.payment-box,
.modal-content,
.panel {
  background: var(--glass-bg) !important;
  border-radius: var(--radius-lg);
  border: 1px solid var(--glass-border);
  box-shadow:
    0 20px 45px rgba(0,0,0,0.55),
    inset 0 1px 0 rgba(255,255,255,0.04);
}

/* ================= HEADINGS ================= */
h1, h2, h3, h4 {
  color: var(--text-main);
}

.section-title,
.title,
.header-title {
  color: var(--accent-yellow);
  font-weight: 700;
}

/* ================= CATEGORY BUTTONS ================= */
.category-btn,
.filter-btn,
.tab {
  background: rgba(21,25,58,0.9);
  color: #fff;
  border: 1px solid var(--glass-border);
  border-radius: 10px;
}

.category-btn.active,
.filter-btn.active {
  background: var(--accent-blue);
  color: #001;
}

/* ================= PRODUCT IMAGE ================= */
.product-card img,
.menu-card img {
  border-radius: 14px;
}

/* ================= TAGS ================= */
.tag,
.badge,
.label {
  background: rgba(255,255,255,0.06);
  color: var(--accent-blue);
  border-radius: 6px;
  font-size: 11px;
  padding: 2px 6px;
}

/* ================= PRICE ================= */
.price,
.total-price,
.amount {
  color: var(--accent-yellow);
  font-weight: 700;
}

/* ================= INPUTS ================= */
input,
textarea,
select {
  background: #15193a !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
}

input::placeholder,
textarea::placeholder {
  color: var(--text-muted);
}

input:focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--accent-blue);
}

/* ================= CHECKBOX / RADIO ================= */
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--accent-blue);
}

/* ================= BUTTONS ================= */
button,
.btn,
.action-btn {
  background: linear-gradient(
    135deg,
    var(--accent-yellow),
    var(--accent-yellow-hover)
  );
  color: #1a1400;
  border: none;
  border-radius: var(--radius-md);
  font-weight: 700;
  transition: all .25s ease;
}

button:hover,
.btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
}

/* ================= SECONDARY BUTTON ================= */
.btn-secondary,
.cancel-btn {
  background: #15193a;
  color: #fff;
  border: 1px solid var(--glass-border);
}

/* ================= CART ================= */
.cart,
.cart-panel,
.cart-container {
  background: var(--glass-bg);
}

.cart-item {
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* ================= TOTAL ================= */
.cart-total,
.grand-total {
  color: var(--accent-yellow);
  font-size: 1.4rem;
  font-weight: 700;
}

/* ================= MODAL BACKDROP ================= */
.modal,
.dialog,
.overlay {
  background: rgba(6, 9, 28, 0.75) !important;
}

/* ================= LINKS ================= */
a {
  color: var(--accent-blue);
}

a:hover {
  text-decoration: underline;
}


/* =========================================
   TURUNCU / AMBER BUTON YAZILARI SİYAH
   ========================================= */

button,
.btn,
.action-btn {
  color: #000000 !important;
}

button svg,
.btn svg,
.action-btn svg {
  fill: #000000 !important;
  stroke: #000000 !important;
}

/* Eğer <a> tag'ı buton gibi kullanıldıysa */
a.btn,
a.action-btn {
  color: #000000 !important;
}

.checkout-button,
.confirm-button,
.submit-button {
  color: #000 !important;
}

/* =====================================================
   HEADER – SİTE İLE UYUMLU DEEP BLUE + TURUNCU YAZI
   ===================================================== */

header,
.site-header,
.top-header,
.navbar {
  background: linear-gradient(
    180deg,
    #14183a 0%,
    #0b0e22 100%
  ) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06);
}

/* Header içindeki TÜM yazılar turuncu */
header *,
.site-header *,
.top-header *,
.navbar * {
  color: #ffc107 !important;
}

/* Header link hover */
header a:hover,
.navbar a:hover {
  color: #ffdd55 !important;
}

/* =====================================================
   SAĞ SEPET – ÜRÜN SATIRI ARKAPLANI (SARIYI KALDIR)
   ===================================================== */

.cart-item,
.sepet-item,
.cart-row {
  background: rgba(21, 25, 58, 0.85) !important;
  border-radius: 10px;
  padding: 8px 10px;
  margin-bottom: 6px;
  border: 1px solid rgba(255,255,255,0.06);
}

/* Sepet ürün ismi */
.cart-item .product-name,
.sepet-item .product-name,
.cart-row span:first-child {
  color: #e9edff !important;
  font-weight: 600;
}

/* Sepet fiyat */
.cart-item .price,
.sepet-item .price {
  color: #ffc107 !important;
}

/* Sil (X) butonu – küçük sarı kutu kalsın */
.cart-item button,
.sepet-item button {
  background: #ffc107 !important;
  color: #000 !important;
  border-radius: 6px;
}


