/* Cookie banner */

div.cookies-banner.cookies-banner-bottom {
  background-color: var(--neutrals-white, #ffffff);
  box-shadow: var(--box-shadow-lg);
}

/* override default cookie banner layout to work better on mobile */
@media only screen and (max-width: 540px) {
  #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerPortlet_ {
    padding: 0 var(--spacer-2, 0.5rem);
  }

  #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerPortlet_ .autofit-row.autofit-padded-no-gutters.autofit-row-center {
    flex-wrap: wrap;
  }
}

/* Modal header and footer */

html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .btn.close {
  color: var(--neutrals-black, #000000);
}

html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-footer .btn-secondary {
  --btn-active-border-color: var(--color-action-neutral-active);
  --btn-active-color: var(--color-action-neutral-active);
  --btn-default-border-color: var(--color-action-neutral-default);
  --btn-default-color: var(--color-action-neutral-default);
  --btn-disabled-border-color: var(--color-action-neutral-disabled);
  --btn-hover-background-color: var(--color-action-neutral-inverted-hover);
  --btn-hover-border-color: var(--color-action-neutral-hover);
  --btn-hover-color: var(--color-action-neutral-hover);
  background-color: transparent;
  color: var(--neutrals-black, #000000);
}

html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-footer .btn-secondary:hover {
  background-color: var(--btn-hover-background-color, var(--btn-default-background-color));
  border-color: var(--btn-hover-border-color, var(--btn-default-border-color));
  color: var(--btn-hover-color, var(--btn-default-color));
  text-decoration: none;
}

html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-footer,
html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-body,
html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-header {
  border: none;
}

/* Modal body and cookie configuration portlet */

html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-content {
  box-shadow: var(--box-shadow-lg);
}

html:not(#__):not(#___) .portal-popup #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_ .portlet-body,
html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .modal-content,
html:not(#__):not(#___) .cadmin #cookiesBannerConfiguration .portal-popup .portlet-body,
html:not(#__):not(#___) .cadmin div#_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_cookiesBannerConfigurationForm {
  background-color: var(--neutrals-white, #ffffff);
  color: var(--typography-body-text, #1b1b1b);
}

html:not(#__):not(#___) .cadmin #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_ a {
  color: var(--link-color, #227724);
}

html:not(#__):not(#___) .cadmin #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_ a:hover {
  color: var(--link-hover-color, #1b5f1d);
}

html:not(#__):not(#___) .cadmin #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_ .text-primary {
  color: var(--color-brand-primary, #227724) !important;
}

html:not(#__):not(#___)
  .cadmin
  #p_p_id_com_liferay_cookies_banner_web_portlet_CookiesBannerConfigurationPortlet_
  .toggle-switch-check:checked
  ~ .toggle-switch-bar::before {
  background-color: var(--color-brand-primary, #227724);
  border-color: var(--color-brand-primary, #227724);
}
