/*
Theme Name: Muffin Break Members
Description: WordPress port of the Muffin Break members portal.
Version: 0.3.3
Requires PHP: 8.4
Text Domain: muffinbreak-members
*/

:root {
    --mb-burgundy: #98233f;
    --mb-burgundy-dark: #59162a;
    --mb-gold: #c9a962;
}

html { scroll-behavior: smooth; }
body { margin: 0; }
button, input, select, textarea { border-radius: 0; }
a { text-decoration: none; }

.c-mobile-nav-header__burger,
.c-nav-main-aside__close {
    border: 0;
    background: transparent;
    cursor: pointer;
}

.c-content-tile-form section[hidden],
.c-login-tile__form section[hidden] { display: none !important; }

.c-form .form-group,
.c-form-input { position: relative; }

.c-password-toggle {
    width: 22px;
    height: 22px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.c-password-toggle svg { display: block; width: 22px; height: 22px; }

.c-member-form-message {
    margin: 20px 0 0;
    padding: 14px 16px;
    background: #f4efeb;
    color: #4a4a4a;
    font-size: 14px;
}

.c-member-form-message.is-error {
    color: #f7941e;
    font-weight: 600;
}

.form-group.has-error .help-block label { font-weight: 400; }

/* Live floats the error over the label's line, where long labels collide with it; show it under the field instead. */
.c-form .form-group.has-error .c-form-input { display: flex; flex-direction: column; }
.c-form .form-group.has-error .c-form-input .help-block {
    position: static;
    order: 2;
    margin: 6px 0 0;
    text-align: right;
}
.c-form .form-group.has-error .c-form-input .form-control { padding-right: 40px; }
.c-form .form-group .c-form-input .form-control-feedback { width: 40px; height: 60px; }
.c-form .form-group.has-error > .help-block { position: static; margin: 6px 0 0 55px; text-align: left; }

.c-login-tile__tab { cursor: pointer; }


.c-member-page__section-title { margin-top: 35px; }
.c-recovery-tile { margin-top: 35px; }
.c-recovery-tile .c-content-tile-copy { margin-bottom: 30px; }
.c-profile-form { max-width: 760px; }
.admin-bar .c-header-holder { top: 32px; }

@media (max-width: 782px) {
    .admin-bar .c-header-holder { top: 46px; }
}

@media (max-width: 600px) {
    .admin-bar .c-header-holder { top: 0; }
}