/*
  Humsari Cookie Banner Overrides
  ================================
  This file is intentionally placed in public/ so it is served as-is
  and is NEVER processed by Vite / Tailwind / LightningCSS.
  That prevents the build tool from stripping backdrop-filter or
  merging vendor-prefixed properties incorrectly.

  Load order in HTML:
    1. silktide-consent-manager.css  (silktide base styles)
    2. this file                     (our overrides — always wins by source order)
*/

/* ── Theme variables ─────────────────────────────────────────────── */
#silktide-wrapper {
  --primaryColor: #a31d1d;
  --textColor: #111827;
  --cookieIconColor: #a31d1d;
  --cookieIconBackgroundColor: #ffffff;
}

/* ── Hide the dim backdrop so glassmorphism shows page content ────── */
#silktide-backdrop {
  display: none !important;
}

/* ── Remove the default Silktide attribution link in the modal ── */
#silktide-wrapper #silktide-modal a[href^="https://silktide.com/consent-manager"],
#silktide-wrapper #silktide-modal a[href*="silktide.com/consent-manager"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

/* ── Glassmorphic banner ─────────────────────────────────────────── */
#silktide-wrapper #silktide-banner {
  background-color: rgba(255, 255, 255, 0.72) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  -webkit-backdrop-filter: blur(28px) saturate(160%) !important;
  backdrop-filter: blur(28px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.14), 0 2px 8px rgba(163, 29, 29, 0.06) !important;
  border-radius: 18px !important;
}

/* Force banner to bottom-left (RTL doc sets right:16px by default) */
#silktide-wrapper #silktide-banner.bottomLeft {
  left: 16px !important;
  right: auto !important;
}

/* ── Glassmorphic preferences modal ─────────────────────────────── */
#silktide-wrapper #silktide-modal {
  background-color: rgba(255, 255, 255, 0.88) !important;
  background: rgba(255, 255, 255, 0.88) !important;
  -webkit-backdrop-filter: blur(40px) saturate(160%) !important;
  backdrop-filter: blur(40px) saturate(160%) !important;
  border: 1px solid rgba(255, 255, 255, 0.45) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18), 0 4px 16px rgba(163, 29, 29, 0.06) !important;
  border-radius: 20px !important;  width: min(92vw, 720px) !important;
  max-width: 92vw !important;
  max-height: calc(100vh - 32px) !important;
  margin: 16px auto !important;
  overflow-y: auto !important;
  box-sizing: border-box !important;
}

@media (max-width: 640px) {
  #silktide-wrapper #silktide-modal {
    width: calc(100vw - 22px) !important;
    max-height: calc(100vh - 14px) !important;
    margin: 8px auto !important;
    padding: 10px !important;
  }
  #silktide-wrapper #silktide-modal h1 {
    font-size: 17px !important;
    line-height: 22px !important;
    margin-bottom: 6px !important;
  }
  #silktide-wrapper #silktide-modal p,
  #silktide-wrapper #silktide-modal .cookie-type-description,
  #silktide-wrapper #silktide-modal a {
    font-size: 12px !important;
    line-height: 16px !important;
    margin: 0 0 6px 0 !important;
  }
  #silktide-wrapper #silktide-modal legend {
    font-size: 13px !important;
    line-height: 18px !important;
    margin-bottom: 2px !important;
  }
  #silktide-wrapper #silktide-modal fieldset,
  #silktide-wrapper #silktide-modal .cookie-type-description,
  #silktide-wrapper #silktide-modal .cookie-type {
    margin-bottom: 6px !important;
    padding-bottom: 0 !important;
  }
  #silktide-wrapper #silktide-modal .st-button,
  #silktide-wrapper #silktide-modal .preferences-accept-all,
  #silktide-wrapper #silktide-modal .preferences-reject-all {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: center !important;
    padding: 6px 12px !important;
    font-size: 12px !important;
    line-height: 16px !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  #silktide-wrapper #silktide-modal .preferences-accept-all {
    margin-bottom: 8px !important;
  }
  #silktide-wrapper #silktide-modal .preferences-reject-all {
    margin-top: 0 !important;
  }
  #silktide-wrapper #silktide-modal a {
    display: inline-block !important;
    margin: 0 !important;
    padding: 4px 0 !important;
  }
  #silktide-wrapper #silktide-modal .cookie-type-description {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }
}

/* ── Cookie icon — 40 px, bottom-left ───────────────────────────── */
#silktide-cookie-icon {
  width: 40px !important;
  height: 40px !important;
  bottom: 14px !important;
  left: 14px !important;
  right: auto !important;
}
#silktide-cookie-icon svg {
  width: 20px !important;
  height: 20px !important;
}

/* ── Remove Silktide branding logo ──────────────────────────────── */
#silktide-banner a.silktide-logo {
  display: none !important;
}

/* ── Hide the default Silktide attribution link in the modal ── */
#silktide-modal a[href*="silktide.com/consent-manager"] {
  display: none !important;
}

/* ── Transparent link backgrounds so glassmorphism shows through ── */
#silktide-banner a,
#silktide-modal a {
  background-color: transparent !important;
}