/* ======================================================================
   CASI -- der Cookie-Hinweis (SureCookie) im Gestaltungssystem der Seite.
   Eingebunden von novamira-sandbox/casi-cookie.php, nach dem Stylesheet
   des Plugins. Die Ids der beiden Wurzeln geben den Regeln den Vorrang.

   Hinweis: Karte unten links (Plugin: Banner-Typ "box", Position
   "bottom-left"), in der Kastenfarbe der Website. Accept All bordeaux
   gefuellt, Decline bordeaux als Linie, Only Essential dunkelgruen als
   Linie, Preferences als Textlink.
   Auswahl: wie "Today's practices are fragmented" -- hellgrauer Kasten,
   die Kategorien als weisse Karten, das Plus der News zum Aufklappen.
   Hover wie ueberall: Linie kippt die Flaeche, Voll leert sie, Textlink
   unterstreicht. Texte kommen unveraendert aus dem Plugin.
   ====================================================================== */

:root{
  --ck-tinte:#0E4D49; --ck-akzent:#8B1538; --ck-kasten:#EEF2F1; --ck-rand:#C5D4D3;
  --ck-linie:#E1E7E5; --ck-leise:#54626A; --ck-text:#29363D; --ck-papier:#fff;
}

/* ---------------------------------------------------------- gemeinsam */
:is(#surecookie-public-root,#surecookie-preferences-root) button{
  font-family:'Mori',system-ui,sans-serif !important;letter-spacing:normal !important;
  box-shadow:none !important;}
:is(#surecookie-public-root,#surecookie-preferences-root) button:hover{filter:none !important;opacity:1 !important;transform:none !important;}
:is(#surecookie-public-root,#surecookie-preferences-root) button:focus{outline:none !important;box-shadow:none !important;}
/* Fokusrahmen nur, wenn mit der Tastatur gearbeitet wird (html.ck-tastatur,
   gesetzt in casi-cookie.php) -- nicht beim automatischen Fokus beim Oeffnen. */
:is(#surecookie-public-root,#surecookie-preferences-root) button:focus-visible{outline:none !important;}
html.ck-tastatur :is(#surecookie-public-root,#surecookie-preferences-root) button:focus-visible{outline:2px solid #93AFAD !important;outline-offset:3px;}

/* Knoepfe: Masse und Uebergang der Website (Mori 16, 10/19, Ecke 8, .2 s) */
#surecookie-public-root .surecookie-btn-base,
#surecookie-preferences-root .surecookie-btn-outline,
#surecookie-preferences-root .surecookie-btn-outline-secondary,
#surecookie-preferences-root .surecookie-btn-primary{
  font-size:16px !important;font-weight:400 !important;line-height:1.6 !important;
  padding:10px 19px !important;height:auto !important;min-width:0 !important;
  border-radius:8px !important;border:1px solid transparent !important;
  transition:background-color .2s,color .2s,border-color .2s !important;cursor:pointer;}

/* Voll bordeaux: Hover leert die Flaeche, der Rand bleibt ("Learn more") */
#surecookie-public-root .surecookie-accept-all-btn,
#surecookie-preferences-root .surecookie-btn-primary{
  background:var(--ck-akzent) !important;color:var(--ck-papier) !important;border-color:var(--ck-akzent) !important;}
#surecookie-public-root .surecookie-accept-all-btn:hover,
#surecookie-preferences-root .surecookie-btn-primary:hover{
  background:transparent !important;color:var(--ck-akzent) !important;}
/* Linie bordeaux: Hover fuellt */
#surecookie-public-root .surecookie-decline-btn{
  background:transparent !important;color:var(--ck-akzent) !important;border-color:var(--ck-akzent) !important;}
#surecookie-public-root .surecookie-decline-btn:hover{
  background:var(--ck-akzent) !important;color:var(--ck-papier) !important;}
/* Linie dunkelgruen: Hover fuellt ("Get in touch") */
#surecookie-public-root .surecookie-accept-btn,
#surecookie-preferences-root .surecookie-btn-outline,
#surecookie-preferences-root .surecookie-btn-outline-secondary{
  background:transparent !important;color:var(--ck-tinte) !important;border-color:var(--ck-tinte) !important;}
#surecookie-public-root .surecookie-accept-btn:hover,
#surecookie-preferences-root .surecookie-btn-outline:hover,
#surecookie-preferences-root .surecookie-btn-outline-secondary:hover{
  background:var(--ck-tinte) !important;color:var(--ck-papier) !important;}
/* Textlink: Unterstreichung erscheint ("Read more") */
#surecookie-public-root .surecookie-preferences-btn{
  background:transparent !important;border-color:transparent !important;color:var(--ck-tinte) !important;
  text-decoration:none !important;padding-left:8px !important;padding-right:8px !important;}
#surecookie-public-root .surecookie-preferences-btn:hover{
  text-decoration:underline !important;text-decoration-thickness:1px !important;text-underline-offset:3px !important;}

/* "Powered by SureCookie" ausgeblendet */
#surecookie-public-root .surecookie-branding,
#surecookie-preferences-root .surecookie-modal-footer-branding{display:none !important;}

/* ---------------------------------------------------------- Hinweis */
#surecookie-public-root .surecookie-public-banner{
  background-color:var(--ck-kasten) !important;color:var(--ck-tinte) !important;
  border:0 !important;border-radius:10px !important;box-shadow:none !important;}
#surecookie-public-root .surecookie-banner-description,
#surecookie-public-root .surecookie-banner-description div{
  font-family:'Serife',Georgia,serif !important;font-size:16px !important;line-height:1.55 !important;
  color:var(--ck-tinte) !important;}
/* die vier Knoepfe zu zweit, gleich breit */
#surecookie-public-root .surecookie-banner-buttons{display:grid !important;grid-template-columns:1fr 1fr;gap:8px !important;}
#surecookie-public-root .surecookie-banner-buttons button{width:100% !important;margin:0 !important;}
@media (max-width:760px){
  #surecookie-public-root .surecookie-banner-description,
  #surecookie-public-root .surecookie-banner-description div{font-size:15px !important;}
  #surecookie-public-root .surecookie-banner-buttons button{padding-left:8px !important;padding-right:8px !important;}
}

/* ---------------------------------------------------------- Auswahl */
/* Der Hintergrund dunkelt in Tinte ab statt in Grau */
#surecookie-preferences-root .surecookie-modal-backdrop{background:rgba(14,77,73,.32) !important;backdrop-filter:none !important;}
/* der Kasten: hellgrau, 10 px Ecke, kein Schatten */
#surecookie-preferences-root .surecookie-preferences-modal{
  background-color:var(--ck-kasten) !important;color:var(--ck-tinte) !important;
  border:0 !important;border-radius:10px !important;box-shadow:none !important;
  max-width:720px !important;width:calc(100% - 36px) !important;}
#surecookie-preferences-root .surecookie-modal-header{padding:40px 40px 8px !important;border:0 !important;align-items:flex-start !important;gap:24px;}
#surecookie-preferences-root .surecookie-modal-title{
  font-family:'Mori',system-ui,sans-serif !important;font-size:30px !important;line-height:1.15 !important;
  font-weight:600 !important;color:var(--ck-tinte) !important;letter-spacing:normal !important;margin:0 0 16px !important;}
#surecookie-preferences-root .surecookie-modal-description{
  font-family:'Serife',Georgia,serif !important;font-size:17px !important;line-height:1.6 !important;
  color:var(--ck-tinte) !important;}
/* Schliessen: wie das Schliessen der Abbildungen (38 px, Linie, kippt) */
#surecookie-preferences-root .surecookie-modal-close-btn{
  flex:0 0 auto;width:38px !important;height:38px !important;display:grid !important;place-items:center;
  padding:0 !important;background:transparent !important;border:1px solid var(--ck-tinte) !important;
  border-radius:8px !important;color:var(--ck-tinte) !important;transition:background-color .2s,color .2s !important;}
#surecookie-preferences-root .surecookie-modal-close-btn:hover{background:var(--ck-tinte) !important;color:var(--ck-papier) !important;}
#surecookie-preferences-root .surecookie-modal-close-btn svg{width:18px;height:18px;}
#surecookie-preferences-root .surecookie-modal-close-btn svg *{stroke:currentColor !important;}
/* die Kategorien als weisse Karten auf dem Kasten */
#surecookie-preferences-root .surecookie-categories-wrapper{padding:16px 40px 0 !important;}
#surecookie-preferences-root .surecookie-categories-list{display:flex !important;flex-direction:column;gap:12px;}
#surecookie-preferences-root .surecookie-category-item{
  background:var(--ck-papier) !important;border:0 !important;border-radius:8px !important;padding:0 !important;}
#surecookie-preferences-root .surecookie-category-header{padding:16px 20px 16px 14px !important;}
#surecookie-preferences-root .surecookie-category-trigger{gap:10px !important;cursor:pointer;}
#surecookie-preferences-root .surecookie-category-name{
  font-family:'Mori',system-ui,sans-serif !important;font-size:17px !important;font-weight:400 !important;
  color:var(--ck-tinte) !important;}
#surecookie-preferences-root .surecookie-category-trigger:hover .surecookie-category-name{
  text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;}
#surecookie-preferences-root .surecookie-category-details{
  font-family:'Serife',Georgia,serif !important;font-size:16px !important;line-height:1.55 !important;
  color:var(--ck-text) !important;padding:0 20px 18px 50px !important;}
#surecookie-preferences-root .surecookie-category-details *{font-family:inherit !important;color:inherit !important;}
#surecookie-preferences-root .surecookie-always-active{
  font-family:'Mori',system-ui,sans-serif !important;font-size:14px !important;color:var(--ck-leise) !important;}
/* Aufklappen mit dem Plus der News: dreht sich offen zum Kreuz, wird beim Zeigen bordeaux */
#surecookie-preferences-root .surecookie-expand-icon{
  width:26px;height:26px;flex:0 0 26px;display:grid !important;place-items:center;transform:none !important;
  color:var(--ck-tinte) !important;transition:color .2s;}
#surecookie-preferences-root .surecookie-expand-icon svg{display:none !important;}
#surecookie-preferences-root .surecookie-expand-icon::before{
  content:"";width:24px;height:24px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.2 5.4A.8 .8 0 0 1 12.8 5.4V11.2H18.6A.8 .8 0 0 1 18.6 12.8H12.8V18.6A.8 .8 0 0 1 11.2 18.6V12.8H5.4A.8 .8 0 0 1 5.4 11.2H11.2Z'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11.2 5.4A.8 .8 0 0 1 12.8 5.4V11.2H18.6A.8 .8 0 0 1 18.6 12.8H12.8V18.6A.8 .8 0 0 1 11.2 18.6V12.8H5.4A.8 .8 0 0 1 5.4 11.2H11.2Z'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform .34s cubic-bezier(.4,0,.2,1);}
#surecookie-preferences-root .surecookie-category-trigger[aria-expanded="true"] .surecookie-expand-icon::before{transform:rotate(45deg);}
#surecookie-preferences-root .surecookie-category-trigger:hover .surecookie-expand-icon{color:var(--ck-akzent) !important;}
@media (prefers-reduced-motion:reduce){#surecookie-preferences-root .surecookie-expand-icon::before{transition:none;}}
/* Schalter in Tinte: aus hell, an dunkelgruen */
#surecookie-preferences-root .surecookie-toggle-btn{transition:background-color .2s !important;}
#surecookie-preferences-root .surecookie-toggle-btn[aria-checked="true"]{background-color:var(--ck-tinte) !important;}
#surecookie-preferences-root .surecookie-toggle-btn[aria-checked="false"]{background-color:var(--ck-rand) !important;}
#surecookie-preferences-root .surecookie-toggle-btn[aria-disabled="true"]{opacity:.55;cursor:default;}
#surecookie-preferences-root .surecookie-toggle-knob{box-shadow:none !important;background:var(--ck-papier) !important;}
/* Fuss */
#surecookie-preferences-root .surecookie-modal-footer{padding:28px 40px 40px !important;border:0 !important;gap:12px !important;}
#surecookie-preferences-root .surecookie-footer-actions{gap:12px !important;}
@media (max-width:760px){
  #surecookie-preferences-root .surecookie-modal-header{padding:24px 20px 4px !important;}
  #surecookie-preferences-root .surecookie-modal-title{font-size:24px !important;}
  #surecookie-preferences-root .surecookie-modal-description{font-size:16px !important;}
  #surecookie-preferences-root .surecookie-categories-wrapper{padding:12px 20px 0 !important;}
  #surecookie-preferences-root .surecookie-category-details{padding-left:20px !important;}
  #surecookie-preferences-root .surecookie-modal-footer{padding:20px !important;flex-direction:column-reverse;align-items:stretch !important;}
  #surecookie-preferences-root .surecookie-footer-actions{display:grid !important;grid-template-columns:1fr 1fr;}
  #surecookie-preferences-root .surecookie-modal-footer button{width:100% !important;}
}

/* ---------------------------------------------------------- Nachtrag */
/* Karte: links buendig mit dem Logo (Rand der Seite), unten wie die Seitenluft */
@media (min-width:761px){
  #surecookie-public-root .surecookie-public-banner{left:max(18px,calc((100vw - 1300px) / 2)) !important;bottom:24px !important;}
}
/* Auswahl: das ganze Fenster rollt, die Liste wird nicht abgeschnitten */
#surecookie-preferences-root .surecookie-preferences-modal{max-height:calc(100vh - 48px) !important;max-height:calc(100dvh - 48px) !important;overflow-y:auto !important;display:block !important;}
#surecookie-preferences-root .surecookie-categories-scroll{max-height:none !important;overflow:visible !important;padding:0 !important;margin:0 !important;}
#surecookie-preferences-root .surecookie-categories-list{padding:0 !important;margin:0 !important;}
#surecookie-preferences-root .surecookie-category-controls{gap:12px !important;flex:0 0 auto;}
@media (max-width:760px){
  #surecookie-preferences-root .surecookie-category-header{padding:14px 16px 14px 10px !important;gap:8px;}
  #surecookie-preferences-root .surecookie-category-name{font-size:16px !important;}
  #surecookie-preferences-root .surecookie-always-active{font-size:13px !important;}
}