/* Fable GDPR - public styles.
   Checkbox markup is the same as in the GDPR Plugin by MB Themes (#gdpr-check,
   .input-box-check), so the theme rules for it keep working: the publish form
   (style-child.css .fp-publish #gdpr-check), the Font Awesome check mark
   (style.css) and dark mode (dark-mode-plugins.css). The consent window reuses
   the theme's .auth-modal-* component; only its container is defined here,
   with an id selector because this file loads before style-child.min.css. */

/* CHECKBOXES */
#gdpr-check {display:inline-block;clear:both;width:100%;position:relative;padding:0;}
form[name="register"] #gdpr-check {padding:5px 0;}
#gdpr-check .input-box-check {float:left;width:100%;clear:both;margin:0 0 8px 0;position:relative;}
#gdpr-check.styled .input-box-check input[type="checkbox"] {opacity:0.1;position:absolute;visibility:visible;left:0;top:0;border:none!important;z-index:1;overflow:hidden;padding:0!important;width:1px!important;height:1px!important;margin:0!important;box-shadow:none!important;}
#gdpr-check.styled .input-box-check label {cursor:pointer;position:relative;float:left;padding:0 0 0 26px!important;line-height:20px;font-size:14px;width:auto;clear:both;}
#gdpr-check.styled .input-box-check label a {text-decoration:underline;}
#gdpr-check.styled .input-box-check label a:hover {text-decoration:none;}
#gdpr-check.styled .input-box-check label:before {cursor:pointer;content:"";width:18px;height:18px;border:1px solid #ccc;position:absolute;top:0;left:0;box-shadow:1px 1px 1px rgba(0,0,0,0.06);border-radius:2px;transition:0.1s linear all;}
#gdpr-check.styled .input-box-check label:hover:before {border-color:#aaa;}
#gdpr-check.styled .input-box-check label:after {cursor:pointer;text-indent:1px;font-family:"FontAwesome","Font Awesome 5 Free";content:"\f00c";color:transparent;font-size:14px;width:18px;height:18px;line-height:19px;text-align:center;font-weight:900;position:absolute;top:0;left:0;border-radius:2px;transition:0.1s linear all;}
#gdpr-check.styled .input-box-check input[type="checkbox"]:checked + label:before {border-color:#03a9f4;background-color:#03a9f4;}
#gdpr-check.styled .input-box-check input[type="checkbox"]:checked + label:after {color:#fff;}
#gdpr-check.styled .input-box-check input[type="checkbox"]:focus-visible + label:before {outline:2px solid #0a66c2;outline-offset:2px;}

/* CHECKBOXES IN auth-* FORMS (registration, consent window): the theme's
   .auth-remember row; selectors are one class more specific than the theme's
   !important rules, because this file loads first. Labels may wrap. */
.fgdpr-consent {margin:4px 0 18px;clear:both;}
.fgdpr-consent .auth-remember {margin:0 0 10px!important;align-items:flex-start!important;}
.fgdpr-consent .auth-remember:last-child {margin-bottom:0!important;}
/* The checkbox itself looks like every other one on the site: theme css/checkbox.css. */
.fgdpr-consent .auth-remember label.auth-label-inline {display:block!important;line-height:1.45!important;}
.fgdpr-consent .auth-remember label.auth-label-inline a {text-decoration:underline;}
.fgdpr-consent .auth-remember label.auth-label-inline a:hover {text-decoration:none;}

/* NEWSLETTER ROW IN ACCOUNT SETTINGS */
.gdpr-user-profile#gdpr-check {margin:4px 0 6px;}
.gdpr-user-profile#gdpr-check label.control-label {padding-top:0;margin-top:0;}
.setrow-edit .fgdpr-hint {clear:both;margin:0 0 12px;font-size:13px;line-height:1.45;color:#8b8b90;}

/* CONSENT WINDOW (same container as the theme's #fable-confirm) */
#fgdpr-modal {display:none;position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999;align-items:center;justify-content:center;padding:20px;box-sizing:border-box;}
#fgdpr-modal.open {display:flex;}
#fgdpr-modal .auth-modal-box {max-width:460px;padding:36px 40px 34px;}
#fgdpr-modal .auth-title {margin-bottom:12px!important;padding-right:24px;}
#fgdpr-modal .fgdpr-modal-text {margin:0 0 18px;font-size:15px;line-height:1.5;color:#444;}
#fgdpr-modal .auth-modal-backdrop {cursor:default;}
#fgdpr-modal .auth-btn-primary:disabled {opacity:.5;cursor:not-allowed!important;}
#fgdpr-modal .fgdpr-modal-exits {margin:16px 0 0;text-align:center;font-size:13px;line-height:1.4;color:#999;}
#fgdpr-modal .fgdpr-modal-exits a {color:#666;text-decoration:underline;}
#fgdpr-modal .fgdpr-modal-exits a:hover {color:#111;}
#fgdpr-modal .fgdpr-modal-exits span {margin:0 6px;}
html[data-theme="dark"] #fgdpr-modal .fgdpr-modal-exits a {color:var(--fd-text-muted, #a6adb6);}
html.fgdpr-lock, html.fgdpr-lock body {overflow:hidden;}
html[data-theme="dark"] #fgdpr-modal .fgdpr-modal-text,
html[data-theme="dark"] .setrow-edit .fgdpr-hint {color:var(--fd-text-muted, #a6adb6);}
@media (max-width:480px) {
  #fgdpr-modal .auth-modal-box {padding:30px 22px 24px;}
}

/* RTL */
html[dir="rtl"] #gdpr-check .input-box-check {float:right;}
html[dir="rtl"] #gdpr-check.styled .input-box-check input[type="checkbox"] {right:0;left:auto;}
html[dir="rtl"] #gdpr-check.styled .input-box-check label {float:right;padding:0 26px 0 0!important;}
html[dir="rtl"] #gdpr-check.styled .input-box-check label:before,
html[dir="rtl"] #gdpr-check.styled .input-box-check label:after {right:0;left:auto;}
