:root {
  --cc-font-family: "Fira Sans", Arial, sans-serif;
  --cc-bg: #fff;
  --cc-primary-color: #222;
  --cc-secondary-color: #4f5f73;
  --cc-btn-primary-bg: #ec5b00;
  --cc-btn-primary-color: #fff;
  --cc-btn-primary-hover-bg: #c94d00;
  --cc-btn-primary-hover-color: #fff;
  --cc-btn-secondary-bg: #eef3f8;
  --cc-btn-secondary-color: #23364d;
  --cc-btn-secondary-hover-bg: #dfe8f1;
  --cc-btn-secondary-hover-color: #17283c;
  --cc-toggle-on-bg: #ec5b00;
  --cc-toggle-off-bg: #6f7d8d;
  --cc-cookie-category-block-bg: #f3f6f9;
  --cc-cookie-category-block-border: #e3e8ee;
  --cc-cookie-category-block-hover-bg: #eaf0f5;
  --cc-cookie-category-block-hover-border: #d4dde7;
  --cc-separator-border-color: #dce3ea;
  --cc-footer-border-color: #dce3ea;
}

#cc-main {
  font-size: 15px;
  line-height: 1.45;
}

#cc-main .cm {
  max-width: min(760px, calc(100vw - 32px));
  box-shadow: 0 8px 34px rgb(22 39 58 / 24%);
}

#cc-main .cm__title {
  color: #00529b;
  font-size: 1.15rem;
}

#cc-main .cm__desc {
  max-width: 62ch;
}

#cc-main .cm__btns,
#cc-main .pm__footer {
  gap: 8px;
}

#cc-main a {
  color: #00529b;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.tg-cookie-settings {
  appearance: none;
  border: 0;
  background: transparent;
  color: #00529b;
  cursor: pointer;
  font: inherit;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 2px;
}

@media (max-width: 600px) {
  #cc-main {
    font-size: 14px;
  }

  #cc-main .cm {
    bottom: 8px;
    box-sizing: border-box;
    max-height: calc(100dvh - 16px);
    max-width: calc(100vw - 16px) !important;
    overflow-y: auto;
    width: calc(100vw - 16px) !important;
  }

  #cc-main .cm__body {
    padding: 1.05rem 1rem 0.8rem;
  }

  #cc-main .cm__btns {
    grid-template-columns: 1fr;
    padding: 0.8rem 1rem 1rem;
  }

  #cc-main .cm__btn {
    min-height: 44px;
  }

  #cc-main .pm {
    max-width: 100vw;
    width: 100vw;
  }
}
