﻿ :root {
    --cc-bg:#fffcfa; 
	--cc-color: #002542;
	 
	--cc-button-bg: #002542;
	--cc-button-color:#fffcfa;
	--cc-button-bg-hover: #cccccc;
	--cc-button-color-hover:#002542;
	 
	--cc-fg:#d6ceb9; 
	
    --cc-panel-bg:#fffcfa;
	--cc-panel-color: #002542;
	 
	--cc-panel-group-bg:#002542;
	--cc-panel-group-color: #fffcfa;
	--cc-panel-group-border-color: #fffcfa;
	
	--cc-shadow:0 10px 30px rgba(0,0,0,.35);
    --cc-panel-border-radius:14px; 
	--cc-boredr-radius:10px;
	 
	--cc-input-bg: #dad9d7;
	--cc-input-color: #002542;
 }
 
 .cc-banner{
	 position:fixed;
	 left:0;
	 right:0;
	 bottom:0;
	 background:var(--cc-bg);
	 color:var(--cc-color);
     padding:16px;
	 box-shadow:var(--cc-shadow);
	 z-index:2147483000;
 }
 .cc-wrap{
	 max-width:1100px;
	 margin:0 auto;
	 display:grid;
	 gap:12px;
}
 
@media (min-width:720px){
  .cc-wrap{
		grid-template-columns:1fr auto;
		align-items:center;
	}

}
  .cc-text{
	  font:14px/1.5 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  }
  .cc-actions{
	  display:flex;
	  gap:8px;
	  flex-wrap:wrap;
  }
  .cc-btn{
	  border:0;
	  padding:10px 14px;
	  border-radius:var(--cc-boredr-radius);
	  cursor:pointer;
	  font:600 14px/1 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
	  background:var(--cc-button-bg);
	  color: var(--cc-button-color);
	  transition: 120ms;
	  
	  &:hover {
		background:var(--cc-button-bg-hover);
	    color: var(--cc-button-color-hover);  
	  }
	  &:active {
		background:var(--cc-button-bg-hover);
	    color: var(--cc-button-color-hover);  
	  }
  }
  .cc-link{
	  background:transparent;
	  color:#9dd0ff;
	  text-decoration:underline;
  }

  

  /* Modal */
  .cc-backdrop{
	  position:fixed;
	  inset:0;
	  background:rgba(0,0,0,.55);
	  display:none;
	  z-index:2147483646;
  }
  .cc-backdrop[aria-hidden="false"]{
	  display:block;
  }
  .cc-modal{
	  position:fixed;
	  inset:0;
	  display:none;
	  place-items:center;
	  z-index:2147483647;
	  padding:24px;
  }
  .cc-modal[aria-hidden="false"]{
	  display:grid;
  }
  .cc-panel{
	  width:min(740px,100%);
	  background:var(--cc-panel-bg);
	  color:var(--cc-panel-color);
	  border-radius:var(--cc-panel-border-radius);
      box-shadow:var(--cc-shadow);
	  padding:20px;
  }
  .cc-header{
	  display:flex;
	  justify-content:space-between;
	  align-items:center;
	  margin-bottom:8px;
   }
  .cc-title{
	  font:600 18px/1.2 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  }
  .cc-close{
	  border:0;
	  background:transparent;
	  color:var(--cc-panel-color);
	  cursor:pointer;
	  font-size:20px;
	  padding:6px;
  }
  .cc-desc{
	  color:var(--cc-muted);
	  font:14px/1.5 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
	  margin-bottom:16px;
  }
  .cc-group{
	  background: var(--cc-panel-group-bg);
	  color: var(--cc-panel-group-color);
	  border:1px solid var(--cc-panel-group-border-color);
	  border-radius:var(--cc-panel-border-radius);
	  padding:14px;
	  display:grid;
	  gap:8px;
	  margin-bottom:12px;
  }
  .cc-group h3{
	  margin:0;
	  font:600 15px/1.2 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  }
  .cc-group p{
	  margin:0;
	  font-size:14px;
  }
  .cc-switch{
	  display:flex;
	  align-items:center;
	  gap:10px;
	  justify-self:end;
  }
  .cc-switch input{
	  appearance:none;
	  width:42px;
	  height:24px;
	  border-radius:999px;
	  background:#334155;
	  position:relative;
	  outline:0;
	  cursor:pointer
   }
  .cc-switch input::after{
	  content:"";
	  position:absolute;
	  top:3px;
	  right:3px;
	  width:18px;
	  height:18px;
	  border-radius:999px;
	  background:var(--cc-input-color);
	  transition:transform .2s
   }
  .cc-switch input:checked{
	  background:var(--cc-input-bg);
  }
  .cc-switch input:checked::after{
	  transform:translateX(-18px);
  }
  .cc-switch input:disabled{
	  opacity:.5;
	  cursor:not-allowed;
  }
  .cc-switch-label{
	  font:600 13px/1 Assistant,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  }
  .cc-footer{
	  display:flex;
	  gap:8px;
	  justify-content:flex-start;
	  margin-top:10px;
	  flex-wrap:wrap;
  }