/* ICCAC Community registration page. Scoped to body.registration. */

body.registration{--bg:#F2F3EE;--surface:#FFFFFF;--ink:#1B2636;--muted:#55606E;--accent:#A3202A;--accent-strong:#861A22;--deep:#13233A;--line:#D5D8D0;--line-strong:#B9BDB4;--focus:rgba(163,32,42,.35);--gold:#C99A2E;--on-deep:#E9ECF1;--on-deep-muted:#AEB9C8;--display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;--body:"Source Sans 3",ui-sans-serif,system-ui,sans-serif;background:var(--bg)}
body.registration .site-sub-header{display:none}
body.registration .site-wrapper,body.registration .site-main,body.registration .entry-content{background:transparent;box-shadow:none;border:0;padding:0;margin:0;max-width:none;width:100%}
body.registration #buddypress.buddypress-wrap.extended-default-reg{max-width:1180px;width:100%;margin:clamp(24px,4vw,56px) auto clamp(48px,6vw,88px);padding:0;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.25fr);gap:clamp(24px,4vw,56px);align-items:start;font-family:var(--body);color:var(--ink)}
body.registration #buddypress > *:not(.pr-aside){grid-column:2;min-width:0}

/* Welcome panel */
.pr-aside{grid-column:1;grid-row:1 / span 6;position:sticky;top:96px;background:var(--deep);color:var(--on-deep);border-radius:14px;overflow:hidden}
.pr-kente{height:24px;margin-top:10px;background:var(--gold);-webkit-mask:url(uli-band.svg) repeat-x center/96px 24px;mask:url(uli-band.svg) repeat-x center/96px 24px;opacity:.6}
.pr-aside-in{padding:clamp(24px,3vw,36px)}
.pr-logo{width:76px;height:76px;object-fit:contain;display:block}
.pr-aside h1{margin:22px 0 0;font:760 clamp(30px,3vw,40px)/1.06 var(--display);letter-spacing:-0.02em;color:#fff}
.pr-aside h1 em{font-style:normal;color:#D9B254;display:block}
.pr-lede{margin:16px 0 0;color:var(--on-deep-muted);font-size:16px;line-height:1.6;max-width:38ch}
.pr-points{list-style:none;margin:24px 0 0;padding:0}
.pr-points li{margin:0;padding:13px 0;border-top:1px solid rgba(233,236,241,.14);font-size:15px;line-height:1.5;color:var(--on-deep)}
.pr-points li:last-child{border-bottom:1px solid rgba(233,236,241,.14)}
.pr-photo{margin:24px 0 0;border-radius:10px;overflow:hidden;aspect-ratio:16/9}
.pr-photo img{width:100%;height:100%;object-fit:cover;display:block}
.pr-login{margin:22px 0 0;font-size:15px;color:var(--on-deep-muted)}
.pr-login a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.55);text-decoration:none}
.pr-login a:hover{border-bottom-color:#fff}

/* Notices */
body.registration #buddypress .bp-feedback{display:flex;gap:12px;align-items:flex-start;margin:0 0 18px;padding:14px 18px;border-radius:12px;border:1px solid var(--line);background:var(--surface);box-shadow:none;color:var(--ink);font-size:15px}
body.registration #buddypress .bp-feedback.info{border-color:#E2E6EE;background:#F7F7F3}
body.registration #buddypress .bp-feedback .bp-icon{display:none}
body.registration #buddypress .bp-feedback p{margin:0;padding:0;color:inherit;font-size:15px;line-height:1.5;background:none}
body.registration #buddypress .bp-feedback.error,body.registration #buddypress div.error{border-color:#E7B4A8;background:#FBEFEC;color:#7A2716}

/* Form card */
body.registration #register-page{margin:0;padding:0;width:100%}
body.registration #signup-form{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:clamp(22px,3.4vw,40px);margin:0;width:100%;max-width:none;box-shadow:0 24px 48px -36px rgba(19,35,58,.35)}
body.registration #signup-form .layout-wrap{display:block;margin:0;padding:0;border:0;width:auto}
body.registration #signup-form .register-section{float:none;width:100%;max-width:none;margin:0 0 30px;padding:0 0 30px;border:0;border-bottom:1px solid var(--line);background:none}
body.registration #signup-form h2.bp-heading,body.registration #signup-form .reg_groups_title{margin:0 0 18px;padding:0;border:0;background:none;font:720 22px/1.2 var(--display);letter-spacing:-0.01em;color:var(--ink);text-transform:none}

/* Labels and inputs */
body.registration #signup-form label,body.registration #signup-form legend{display:block;margin:0 0 6px;padding:0;font:600 14px/1.35 var(--body);color:var(--ink);background:none;border:0;width:auto;float:none;text-transform:none}
body.registration #signup-form fieldset{margin:0;padding:0;border:0;min-width:0}
body.registration #signup-form input[type=text],body.registration #signup-form input[type=email],body.registration #signup-form input[type=password],body.registration #signup-form select{width:100%;max-width:none;height:48px;margin:0 0 4px;padding:0 14px;border:1px solid var(--line-strong);border-radius:10px;background:#fff;color:var(--ink);font:400 16px/1.2 var(--body);box-shadow:none;transition:border-color .15s ease,box-shadow .15s ease}
body.registration #signup-form select{appearance:none;-webkit-appearance:none;padding-right:38px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236B5A4C' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 14px center}
body.registration #signup-form input:focus,body.registration #signup-form select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(163,32,42,.15)}
body.registration #signup-form p.description,body.registration #signup-form .indicator-hint,body.registration #signup-form .field-visibility-settings-header{margin:6px 0 0;padding:0;font-size:13px;line-height:1.5;color:var(--muted);background:none;border:0}
body.registration #signup-form .field-visibility-settings-header .visibility-toggle-link,body.registration #signup-form .field-visibility-settings-toggle a,body.registration #signup-form .field-visibility-settings-toggle button{color:var(--accent-strong);font-weight:600;background:none;border:0;padding:0;text-decoration:underline}
body.registration #signup-form .field-visibility-settings{margin-top:8px;padding:12px 14px;border:1px solid var(--line);border-radius:10px;background:#F7F7F3}

/* Account details grid: username and email side by side */
body.registration #basic-details-section{display:grid;grid-template-columns:1fr 1fr;column-gap:18px;row-gap:0;align-items:start}
body.registration #basic-details-section > *{grid-column:1 / -1}
body.registration #basic-details-section > label[for=signup_username]{grid-column:1;grid-row:2}
body.registration #basic-details-section > #signup_username{grid-column:1;grid-row:3}
body.registration #basic-details-section > label[for=signup_email]{grid-column:2;grid-row:2}
body.registration #basic-details-section > #signup_email{grid-column:2;grid-row:3}
body.registration #basic-details-section > label[for=pass1]{margin-top:18px}
body.registration #basic-details-section .user-pass1-wrap,body.registration #basic-details-section .user-pass2-wrap{margin:0}

/* Password */
body.registration #signup-form .password-input-wrapper{display:flex;gap:8px;align-items:center}
body.registration #signup-form .password-input-wrapper input{flex:1;margin:0}
body.registration #signup-form .wp-hide-pw{flex:none;width:48px;height:48px;margin:0;padding:0;border-radius:10px;border:1px solid var(--line-strong);background:#fff;color:var(--ink);display:grid;place-items:center}
body.registration #signup-form .wp-hide-pw:hover{border-color:var(--ink);background:#fff}
body.registration #signup-form .wp-hide-pw .dashicons{color:var(--ink)}
body.registration #signup-form #pass-strength-result{display:inline-block;width:auto;min-width:0;margin:10px 0 0;padding:4px 12px;border-radius:999px;border:0;font:600 13px/1.4 var(--body);background:#E7EAE2;color:var(--muted)}
body.registration #signup-form #pass-strength-result.strong{background:#E2E6EE;color:#13233A}
body.registration #signup-form #pass-strength-result.good{background:#F6EED8;color:#7A5A12}
body.registration #signup-form #pass-strength-result.short,body.registration #signup-form #pass-strength-result.bad{background:#FBEFEC;color:#7A2716}

/* Profile fields grid */
body.registration #profile-details-section{display:grid;grid-template-columns:1fr 1fr;gap:20px 18px;align-items:start}
body.registration #profile-details-section > h2,body.registration #profile-details-section > input[type=hidden]{grid-column:1 / -1}
body.registration #profile-details-section > h2{margin-bottom:0}
body.registration #profile-details-section .editfield{margin:0;padding:0;background:none;border:0;min-width:0}
body.registration #profile-details-section .editfield legend{font:600 14px/1.35 var(--body)}
body.registration .datebox-selects{display:grid;grid-template-columns:1fr 1.4fr;gap:0 10px}
body.registration .datebox-selects label{grid-row:1;font-weight:500!important;color:var(--muted)!important;font-size:13px!important}
body.registration .datebox-selects select{grid-row:2}
body.registration .datebox-selects label[for$=_year],body.registration .datebox-selects select[id$=_year]{display:none!important}
body.registration #signup-form .field_type_birthdate p.description{margin:0 0 12px}

/* Groups */
body.registration #registration-groups-section{border-bottom:0;padding-bottom:6px;margin-bottom:22px}
body.registration #registration-groups-section .reg_groups_description{margin:-10px 0 16px;padding:0;color:var(--muted);font-size:15px}
body.registration .reg_groups_fieldset{margin:0;padding:0;border:0}
body.registration .pr-group-label{margin:18px 0 10px;font:600 13px/1.3 var(--body);color:var(--muted)}
body.registration .pr-group-label:first-child{margin-top:0}
body.registration ul.reg_groups_list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:0;padding:0;list-style:none}
body.registration #signup-form li.reg_groups_item{position:relative;margin:0;padding:0;list-style:none}
body.registration #signup-form li.reg_groups_item input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px;margin:0}
body.registration #signup-form li.reg_groups_item label.reg_groups_group_label{display:flex!important;align-items:center;gap:12px;min-height:60px;margin:0;padding:10px 40px 10px 10px;border:1px solid var(--line-strong);border-radius:12px;background:#fff;font:600 14px/1.3 var(--body);color:var(--ink);cursor:pointer;transition:border-color .15s ease,background-color .15s ease}
body.registration #signup-form li.reg_groups_item label.reg_groups_group_label:hover{border-color:var(--accent)}
body.registration #signup-form li.reg_groups_item .pr-av{flex:none;width:38px;height:38px;border-radius:50%;overflow:hidden;background:var(--deep);color:#fff;display:grid;place-items:center;font:700 13px/1 var(--display)}
body.registration #signup-form li.reg_groups_item .pr-av img{width:100%;height:100%;object-fit:cover;display:block}
body.registration #signup-form li.reg_groups_item label.reg_groups_group_label::after{content:"";position:absolute;right:14px;top:50%;width:18px;height:18px;margin-top:-9px;border:1.5px solid var(--line-strong);border-radius:5px;background:#fff center/12px no-repeat}
body.registration #signup-form li.reg_groups_item input:checked + label.reg_groups_group_label{border-color:var(--accent);background:#F6EEDB}
body.registration #signup-form li.reg_groups_item input:checked + label.reg_groups_group_label::after{border-color:var(--accent);background-color:var(--accent);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10'%3E%3Cpath d='M1 5l3.5 3.5L11 1' fill='none' stroke='white' stroke-width='2'/%3E%3C/svg%3E")}
body.registration #signup-form li.reg_groups_item input:focus-visible + label.reg_groups_group_label{box-shadow:0 0 0 3px rgba(163,32,42,.3)}

/* Privacy and submit */
body.registration #signup-form .privacy-policy-accept{margin:0 0 20px;padding:0;font-size:15px}
body.registration #signup-form .privacy-policy-accept label{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px;line-height:1.5}
body.registration #signup-form .privacy-policy-accept input[type=checkbox]{width:18px;height:18px;margin:2px 0 0;accent-color:var(--accent);flex:none}
body.registration #signup-form .privacy-policy-accept a{color:var(--accent-strong);font-weight:600;text-decoration:underline}
body.registration #signup-form .submit{margin:0;padding:0;text-align:left}
body.registration #signup-form .submit input#submit{width:100%;height:54px;margin:0;padding:0 28px;border:0;border-radius:999px;background:var(--accent);color:#fff;font:600 17px/1 var(--body);letter-spacing:0;text-transform:none;cursor:pointer;box-shadow:none;transition:background-color .15s ease,transform .15s ease}
body.registration #signup-form .submit input#submit:hover,body.registration #signup-form .submit input#submit:focus-visible{background:var(--accent-strong)}
body.registration #signup-form .submit input#submit:active{transform:translateY(1px)}
body.registration #signup-form .submit input#submit:focus-visible{outline:3px solid var(--focus);outline-offset:3px}

@media (max-width:900px){
  body.registration #buddypress.buddypress-wrap.extended-default-reg{grid-template-columns:1fr;margin-top:16px;padding:0 16px}
  body.registration #buddypress > *:not(.pr-aside){grid-column:1}
  .pr-aside{grid-column:1;grid-row:auto;position:static}
  .pr-points,.pr-photo{display:none}
  .pr-aside-in{display:grid;grid-template-columns:auto 1fr;gap:4px 16px;align-items:center}
  .pr-logo{width:52px;height:52px;grid-row:span 2}
  .pr-aside h1{margin:0;font-size:26px}
  .pr-lede{grid-column:1 / -1;margin-top:10px;font-size:15px}
  .pr-login{grid-column:1 / -1;margin-top:10px}
}
@media (max-width:640px){
  body.registration #basic-details-section,body.registration #profile-details-section{grid-template-columns:1fr}
  body.registration #basic-details-section > label[for=signup_email],body.registration #basic-details-section > #signup_email{grid-column:1;grid-row:auto}
  body.registration #basic-details-section > label[for=signup_username],body.registration #basic-details-section > #signup_username{grid-row:auto}
  body.registration #basic-details-section > label[for=signup_email]{margin-top:16px}
  body.registration ul.reg_groups_list{grid-template-columns:1fr}
  .pr-aside h1 em{display:inline}
}
@media (prefers-reduced-motion:reduce){body.registration #signup-form *{transition:none!important}}

body.registration .pr-age{margin:18px 0 0;padding:12px 14px;border-radius:10px;background:rgba(201,154,46,.12);border:1px solid rgba(201,154,46,.3);font-size:14px;line-height:1.5;color:var(--on-deep)}
body.registration .field_age-confirmation .option-label,body.registration .field_age-confirmation label.option-label{display:flex!important;gap:10px;align-items:center;font-weight:600}

/* Fixes: full-width notes on mobile; caps lock warning hidden until WordPress shows it, and small */
@media (max-width:900px){.pr-aside-in > .pr-age,.pr-aside-in > .pr-login,.pr-aside-in > .pr-kente{grid-column:1 / -1}.pr-aside-in > .pr-age{margin-top:14px}}
