/* ============================================================
   AIMDUK — register.css
   Page-specific styles for register.php ONLY.
   All selectors prefixed with .register- — no global classes
   are overridden here. Colors/fonts/radii/shadows are pulled
   from theme.css tokens to match the site's maroon + gold
   identity, consistent with login.css.
   ============================================================ */
html,
body{
    min-height:100%;
    margin:0;
    padding:0;
    overflow-x:hidden;
}

/* ════════════════════════════════════════════
   SECTION SHELL
   ════════════════════════════════════════════ */
.register-section{
    position:relative;
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:60px 15px;
    overflow:hidden;
    background:var(--grad-hero);
}

.register-card{
    width:100%;
    max-width:760px;
    margin:auto;
}

.register-section__orb-1,
.register-section__orb-2 {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    pointer-events: none;
}

.register-section__orb-1 {
    width: 380px;
    height: 380px;
    top: -120px;
    right: -100px;
    background: radial-gradient(circle, rgba(184,150,62,.25), transparent 70%);
}

.register-section__orb-2 {
    width: 420px;
    height: 420px;
    bottom: -140px;
    left: -120px;
    background: radial-gradient(circle, rgba(184,150,62,.18), transparent 70%);
}


/* ════════════════════════════════════════════
   CARD
   ════════════════════════════════════════════ */
.register-card {
    background: #fff;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    /* padding: 3rem 2.5rem; */
    position: relative;
}

.register-card{
    padding:3rem;
}

@media (max-width:768px){

.register-card{
    padding:2rem;
}

}

@media (max-width:576px){

.register-card{
    padding:1.5rem;
}

}

.register-card__brand {
    text-align: center;
    margin-bottom: 2rem;
}

.register-card__brand-mark {
    width: 66px;
    height: 66px;
    margin-inline: auto;
    border-radius: 50%;
    /* background: var(--grad-maroon); */
    display: flex;
    align-items: center;
    justify-content: center;
    /* box-shadow: var(--shadow-gold); */
    margin-bottom: 1rem;
}

.register-card__brand-mark img {
    width: 66px;
    height: 66px;
    object-fit: contain;
}

.register-card__brand-mark i {
    font-size: 1.4rem;
    color: var(--gold-light);
}

.register-card__title {
    font-family: var(--font-serif);
    font-size:clamp(1.5rem,3vw,2rem);
    font-weight: 700;
    color: var(--primary);
    line-height: 1.1;
}

.register-card__subtitle {
    font-size:clamp(.8rem,2vw,.95rem);
    color: var(--text-muted);
    margin-top: .85rem;
}


/* ════════════════════════════════════════════
   FIELDS — icon + underline style
   ════════════════════════════════════════════ */
.register-field__label {
    display: block;
    font-family: var(--font-sans);
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--text-mid);
    margin-bottom: .4rem;
}

.register-field__req {
    color: var(--primary);
}

.register-field {
    display: flex;
    align-items: center;
    width: 100%;
    gap: .75rem;
    border-bottom: 1.5px solid rgba(184,150,62,.3);
    padding: .55rem .1rem;
    transition: border-color .2s ease;
}

.register-field:focus-within {
    border-bottom-color: var(--primary);
}

.register-field__icon {
    font-size: .95rem;
    color: var(--gold);
    flex-shrink: 0;
    width: 18px;
    text-align: center;
}

.register-field__input {
    flex: 1;
    border: none;
    outline: none;
    width: 100%;
    background: transparent;
    font-family: var(--font-sans);
    font-size: .88rem;
    color: var(--text-dark);
    padding: .2rem 0;
    min-width: 0;
}

.register-field__input::placeholder {
    color: var(--text-muted);
    opacity: .7;
}

/* Native date/number chrome kept minimal so it blends with the underline style */
.register-field__input[type="date"] {
    color: var(--text-dark);
}

.register-field__toggle {
    background: none;
    border: none;
    color: var(--text-muted);
    font-size: .95rem;
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
    transition: color .2s ease;
}

.register-field__toggle:hover {
    color: var(--primary);
}

.register-field--invalid {
    border-bottom-color: #b3261e;
}

.register-field__error {
    font-size: .7rem;
    color: #b3261e;
    margin-top: .35rem;
    display: none;
}

.register-field__error.is-visible {
    display: block;
}


/* ════════════════════════════════════════════
   SUBMIT BUTTON
   ════════════════════════════════════════════ */
.register-card__submit {
    width: 100%;
    margin-top: .75rem;
    background: var(--grad-maroon);
    color: #fff;
    font-family: var(--font-sans);
    font-size:15px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    padding: .95rem 1.5rem;
    border: none;
    border-radius: var(--radius-sm);
    box-shadow: 0 6px 20px rgba(74,10,24,.3);
    transition: var(--transition);
}

.register-card__submit:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 28px rgba(74,10,24,.4);
}

.register-card__submit:active {
    transform: translateY(0);
}


/* ════════════════════════════════════════════
   FOOTNOTE
   ════════════════════════════════════════════ */
.register-card__footnote {
    text-align: center;
    font-size: .8rem;
    color: var(--text-muted);
    margin-top: 1.75rem;
}

.register-card__footnote a {
    color: var(--primary);
    font-weight: 600;
    text-decoration: none;
}

.register-card__footnote a:hover {
    text-decoration: underline;
}


/* ════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════ */
@media (max-width: 575.98px) {
    .register-card {
        padding: 2.25rem 1.5rem;
    }
}

@media (max-width:991px){

.register-section{
    padding:50px 20px;
}

.register-card{
    max-width:680px;
}

}

@media (max-width:576px){

.register-card__brand{
    margin-bottom:1.5rem;
}

.register-card__title{
    margin-top:.5rem;
}

.register-card__footnote{
    margin-top:1.25rem;
}

}

@media(max-width:768px){

.register-section__orb-1,
.register-section__orb-2{

width:220px;
height:220px;
filter:blur(45px);

}

}