/* Çerez rızası bandı — site tema değişkenlerini (theme.css) kullanır. */
.mg-consent {
  position: fixed; z-index: 60; left: 12px; right: 12px; bottom: 12px;
  max-width: 720px; margin: 0 auto;
  border: 1px solid var(--mg-line); border-radius: 16px;
  background: var(--mg-surface); color: var(--mg-text);
  box-shadow: 0 18px 48px rgba(4, 7, 11, .32);
  /* Görünürlük JS sınıfına BAĞLI DEĞİL: Blazor devresi bağlanınca DOM yeniden
     çizilir ve sınıflar kaybolur; giriş animasyonu CSS'te. */
  animation: mg-consent-in .28s cubic-bezier(.22, .7, .3, 1) both;
}
@keyframes mg-consent-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.mg-consent[hidden] { display: none; }
@media (min-width: 1200px) { .mg-consent { left: calc(var(--mg-spine-w, 0px) + 16px); right: 16px; margin: 0; max-width: 680px; } }

.mg-consent-form { display: grid; gap: 12px; padding: 16px 16px 14px; }
.mg-consent-copy { display: grid; gap: 6px; min-width: 0; }
.mg-consent-copy b { font-size: 14.5px; font-weight: 800; letter-spacing: .01em; }
.mg-consent-copy p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--mg-muted); }
.mg-consent-copy p a { color: var(--mg-accent-ink); text-decoration: underline; text-underline-offset: 2px; }

.mg-consent-details { margin-top: 2px; }
.mg-consent-details summary {
  cursor: pointer; font-size: 13px; font-weight: 700; color: var(--mg-text);
  list-style: none; display: inline-flex; align-items: center; gap: 6px;
}
.mg-consent-details summary::-webkit-details-marker { display: none; }
.mg-consent-details summary::before { content: "▸"; font-size: 11px; color: var(--mg-faint); transition: transform .15s ease; }
.mg-consent-details[open] summary::before { transform: rotate(90deg); }

.mg-consent-cats { display: grid; gap: 8px; margin-top: 10px; }
.mg-consent-cat {
  display: grid; grid-template-columns: 18px 1fr; gap: 10px; align-items: start;
  padding: 10px 12px; border: 1px solid var(--mg-line); border-radius: 12px;
  background: var(--mg-surface-2); cursor: pointer;
}
.mg-consent-cat.is-locked { cursor: default; opacity: .85; }
.mg-consent-cat input { margin-top: 2px; accent-color: var(--mg-accent); width: 16px; height: 16px; }
.mg-consent-cat span { display: grid; gap: 2px; min-width: 0; }
.mg-consent-cat b { font-size: 13px; font-weight: 700; }
.mg-consent-cat small { font-size: 12px; line-height: 1.45; color: var(--mg-faint); }
.mg-consent-details-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }

.mg-consent-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.mg-consent-btn {
  height: 38px; padding: 0 16px; border-radius: 10px; cursor: pointer;
  border: 1px solid var(--mg-line-strong); background: var(--mg-surface-2); color: var(--mg-text);
  font-size: 13px; font-weight: 700; font-family: inherit;
  transition: background .16s ease, border-color .16s ease, color .16s ease;
}
.mg-consent-btn:hover { border-color: var(--mg-accent); }
.mg-consent-btn.primary { background: var(--mg-accent); border-color: var(--mg-accent); color: #fff; }
.mg-consent-btn.primary:hover { filter: brightness(1.08); }
.mg-consent-btn.ghost { background: transparent; }
.mg-consent-btn:disabled { opacity: .6; cursor: progress; }
.mg-consent-btn:focus-visible { outline: 2px solid var(--mg-accent); outline-offset: 2px; }

/* Alt rıhtım varken bant onun üstüne otursun (uygulama şeridiyle aynı kural). */
body:has(.floating-dock) .mg-consent { bottom: 76px; }
@media (max-width: 480px) {
  .mg-consent-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .mg-consent-btn { padding: 0 10px; }
}
