/* ===========================================================================
   Churchfront Account
   Midnight #090E14, Grey #E6E7E8, Refresh #CAE7F9. Figtree 300/600/700 only.
   Those are the whole palette and the whole type scale. Do not add a fourth
   weight or a fifth colour; the brand guide calls for size and case to carry
   hierarchy instead.

   Scoped to body.cfa-page and .cfa so nothing here can reach another page.
   =========================================================================== */

.cfa-page{
  --cfa-midnight:#090E14;
  --cfa-grey:#E6E7E8;
  --cfa-refresh:#CAE7F9;
  --cfa-body:rgba(230,231,232,.78);
  --cfa-mute:rgba(230,231,232,.55);
  --cfa-rule:rgba(230,231,232,.18);
  --cfa-surface:rgba(230,231,232,.045);
  --cfa-alert:#EF4136;
  background:var(--cfa-midnight) !important;
  font-family:Figtree,Inter,Arial,sans-serif;
  color:var(--cfa-grey);
}

/* GeneratePress draws the page shell. Flatten it so the account area owns the
   full width and its own rhythm, rather than sitting in an article card. */
.cfa-page #page,
.cfa-page #content,
.cfa-page .site-main,
.cfa-page .inside-article,
.cfa-page .entry-content{
  background:transparent !important;
  max-width:100% !important;
}
.cfa-page .inside-article{padding:0 !important;}
.cfa-page .entry-header,
.cfa-page .entry-title{display:none !important;}

/* The site header is fixed and transparent until scrolled. Over a dark page it
   needs pinning or the nav sits invisibly on top of the member's name. */
.cfa-page .cf-sh{
  background:rgba(9,14,20,.96) !important;
  box-shadow:0 1px 0 rgba(230,231,232,.14);
}

/* ---- Shell --------------------------------------------------------------- */
.cfa{
  max-width:1060px;
  margin-left:auto;margin-right:auto;
  padding-left:clamp(20px,4.5vw,48px);
  padding-right:clamp(20px,4.5vw,48px);
  padding-top:clamp(110px,13vw,156px);
  padding-bottom:clamp(60px,8vw,110px);
  font-family:Figtree,Inter,Arial,sans-serif;
  color:var(--cfa-grey);
}
/* box-sizing has to be set on the wrapper as well as its children: `.x *`
   excludes the element it is written on, and that exact mismatch put a heading
   and a form 24px out of line on the login page. */
.cfa,.cfa *,.cfa *::before,.cfa *::after{box-sizing:border-box;}

.cfa-eyebrow{
  font-weight:700;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--cfa-refresh);margin:0 0 16px;
}
.cfa-h2{
  font-weight:700;font-size:.82rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--cfa-grey);margin:0 0 6px;
}
.cfa-lede{
  font-weight:300;font-size:.95rem;line-height:1.65;color:var(--cfa-mute);
  margin:0 0 26px;max-width:58ch;
}
.cfa-empty{
  font-weight:300;font-size:.95rem;line-height:1.65;color:var(--cfa-mute);margin:0;
}

/* ---- Member header ------------------------------------------------------- */
.cfa-hdr{padding-bottom:clamp(24px,3.4vw,34px);}
.cfa-ident{display:flex;align-items:center;gap:clamp(18px,3vw,30px);}
.cfa-ident-txt{min-width:0;}
.cfa-ident h1{
  font-weight:700;font-size:clamp(1.7rem,4.6vw,2.6rem);line-height:1.02;
  letter-spacing:-.015em;text-transform:uppercase;color:var(--cfa-grey);margin:0;
}
.cfa-ident-meta{
  font-weight:300;font-size:clamp(.92rem,2.4vw,1.02rem);line-height:1.55;
  color:var(--cfa-body);margin:10px 0 0;
}
.cfa-pill{
  display:inline-block;margin:12px 0 0;padding:5px 13px;
  border:1px solid rgba(202,231,249,.45);color:var(--cfa-refresh);
  font-weight:700;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;
}

/* ---- Avatar -------------------------------------------------------------- */
.cfa-av{
  position:relative;flex:none;display:block;border-radius:50%;overflow:hidden;
  width:clamp(74px,16vw,104px);height:clamp(74px,16vw,104px);
  background:var(--cfa-refresh);
}
.cfa-av-initials{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:clamp(1.5rem,4vw,2rem);letter-spacing:.02em;
  color:var(--cfa-midnight);
}
/* Portraits run black and white across the site, and a member's own photo is no
   exception. It is one line to remove if that ever changes. */
.cfa-av img{
  position:relative;z-index:1;width:100%;height:100%;object-fit:cover;
  filter:grayscale(1);display:none;
}
.cfa-av.has-photo img{display:block;}
.cfa-av-big{width:120px;height:120px;}

/* ---- Notices ------------------------------------------------------------- */
.cfa-notices{margin:0 0 30px;}
.cfa-notice{
  margin:0 0 10px;padding:13px 16px;
  font-weight:600;font-size:.9rem;line-height:1.5;
  border-left:2px solid var(--cfa-refresh);
  background:rgba(202,231,249,.09);color:var(--cfa-refresh);
}
.cfa-notice-error{
  border-left-color:var(--cfa-alert);
  background:rgba(239,65,54,.08);color:var(--cfa-alert);
}

/* ---- Tabs ---------------------------------------------------------------- */
.cfa-tabs-row{
  display:flex;align-items:flex-end;gap:18px;
  border-bottom:1px solid var(--cfa-rule);
}
.cfa-tabs{
  display:flex;gap:clamp(18px,3vw,38px);
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.cfa-tabs::-webkit-scrollbar{display:none;}
.cfa-tab{
  display:inline-block;white-space:nowrap;text-decoration:none;
  padding:0 0 14px;margin-bottom:-1px;
  font-weight:700;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cfa-mute);border-bottom:2px solid transparent;
  transition:color .15s ease,border-color .15s ease;
}
.cfa-tab:hover,.cfa-tab:focus{color:var(--cfa-grey);}
.cfa-tab[aria-selected="true"]{color:var(--cfa-grey);border-bottom-color:var(--cfa-refresh);}

.cfa-util{display:flex;gap:clamp(14px,2vw,24px);margin-left:auto;padding-bottom:14px;}
.cfa-util a{
  font-weight:700;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cfa-mute);text-decoration:none;white-space:nowrap;
}
.cfa-util a:hover{color:var(--cfa-grey);}

/* Between about 640px and 860px the four tabs and the two utility links fight
   over one row, and the rail starts clipping BILLING while SUPPORT sits beside
   it looking fine. Below 860 the utility links move to their own hairline row
   at the foot rather than disappearing, which is what hiding them would do on
   every phone. */
.cfa-foot{
  display:none;gap:clamp(18px,4vw,28px);
  padding:22px 0 0;margin-top:10px;border-top:1px solid var(--cfa-rule);
}
.cfa-foot a{
  font-weight:700;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cfa-mute);text-decoration:none;
}
.cfa-foot a:hover{color:var(--cfa-grey);}

/* ---- Panels -------------------------------------------------------------- */
.cfa-panel{display:none;}
.cfa-panel.is-on{display:block;}
.cfa-sec{padding:clamp(30px,4vw,46px) 0;border-bottom:1px solid var(--cfa-rule);}
.cfa-sec:last-child{border-bottom:0;}
.cfa-form .cfa-sec:last-of-type{border-bottom:0;}

/* ---- Buttons ------------------------------------------------------------- */
/* Geometry measured off the brand mockups: semicircular left cap, right edge
   slanted top-wide to bottom-narrow, inset 0.211 x height, about 12 degrees.
   Rounding all four corners is the mistake to avoid; the right end becomes a
   semicircle and the cut has nothing to bite into. */
.cfa .cfa-btn{
  --btn-h:46px;
  --btn-cut:calc(var(--btn-h) * .211);
  display:inline-flex;align-items:center;justify-content:center;
  height:var(--btn-h);cursor:pointer;
  font-family:inherit;font-weight:700;font-size:.76rem;letter-spacing:.09em;
  text-transform:uppercase;text-decoration:none;line-height:1;
  border:0;box-shadow:none;
  padding:0 calc(26px + var(--btn-cut)) 0 26px;
  border-radius:999px 0 0 999px;
  clip-path:polygon(0 0,100% 0,calc(100% - var(--btn-cut)) 100%,0 100%);
  background:var(--cfa-grey);color:var(--cfa-midnight);
  transition:background .18s ease,color .18s ease;white-space:nowrap;
}
.cfa .cfa-btn:hover{background:var(--cfa-refresh);color:var(--cfa-midnight);}
.cfa .cfa-btn-sm{--btn-h:38px;font-size:.7rem;}
.cfa .cfa-btn-ghost{
  background:none;color:var(--cfa-grey);border:1px solid var(--cfa-rule);
  border-radius:0;clip-path:none;padding:0 22px;
}
.cfa .cfa-btn-ghost:hover{background:rgba(230,231,232,.08);color:var(--cfa-grey);}
.cfa-btns{display:flex;flex-wrap:wrap;gap:16px;align-items:center;}

.cfa .cfa-link{
  font-weight:700;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cfa-refresh);text-decoration:none;
  border-bottom:1px solid rgba(202,231,249,.4);padding-bottom:2px;
}
.cfa .cfa-link:hover{border-bottom-color:var(--cfa-refresh);}
.cfa .cfa-link-sm{font-size:.64rem;display:inline-block;margin-top:5px;}

/* The Remove control is a checkbox wearing a button, so removing a photo is
   part of the same save rather than a second destructive request. */
.cfa-remove{position:relative;}
.cfa-remove input{position:absolute;opacity:0;width:0;height:0;}
.cfa-remove input:checked + span{text-decoration:line-through;}
.cfa-remove:focus-within{outline:2px solid var(--cfa-refresh);outline-offset:2px;}

/* ---- Forms --------------------------------------------------------------- */
.cfa-grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px clamp(20px,3vw,30px);}
.cfa-span2{grid-column:1 / -1;}
.cfa-field label{
  display:block;margin:0 0 8px;
  font-weight:700;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cfa-mute);
}
.cfa .cfa-field input,
.cfa .cfa-field select{
  width:100%;display:block;max-width:100%;
  font-family:inherit;font-size:1rem;font-weight:300;color:var(--cfa-grey);
  background:var(--cfa-surface);
  border:1px solid var(--cfa-rule);border-radius:0;
  padding:13px 15px;
}
.cfa .cfa-field input:focus,
.cfa .cfa-field select:focus{
  outline:2px solid var(--cfa-refresh);outline-offset:-1px;
  background:rgba(230,231,232,.08);
}
/* A native select draws its own arrow in the OS colour, which reads as a light
   control dropped onto a dark field. Draw ours instead. */
.cfa .cfa-field select{
  -webkit-appearance:none;appearance:none;padding-right:40px;
  background-image:linear-gradient(45deg,transparent 50%,var(--cfa-mute) 50%),
                   linear-gradient(135deg,var(--cfa-mute) 50%,transparent 50%);
  background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;
}
.cfa-hint{font-weight:300;font-size:.8rem;line-height:1.5;color:var(--cfa-mute);margin:8px 0 0;}
.cfa-picked{color:var(--cfa-refresh);}

.cfa-photo{display:flex;align-items:center;gap:clamp(20px,3vw,32px);flex-wrap:wrap;}
.cfa-photo-actions{min-width:0;}

/* ---- Password fold ------------------------------------------------------- */
.cfa-fold{border:1px solid var(--cfa-rule);background:var(--cfa-surface);}
.cfa-fold summary{
  list-style:none;cursor:pointer;padding:16px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-weight:700;font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cfa-grey);
}
.cfa-fold summary::-webkit-details-marker{display:none;}
.cfa-fold summary::after{content:"+";color:var(--cfa-refresh);font-weight:700;font-size:1.1rem;}
.cfa-fold[open] summary::after{content:"\2212";}
.cfa-fold-body{padding:0 18px 20px;}

/* ---- Save bar ------------------------------------------------------------ */
.cfa-savebar{
  position:sticky;bottom:0;z-index:40;margin-top:26px;
  display:none;align-items:center;gap:16px;flex-wrap:wrap;
  padding:14px 18px;background:rgba(202,231,249,.1);
  border:1px solid rgba(202,231,249,.4);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
}
.cfa-savebar.is-on{display:flex;}
.cfa-savebar p{margin:0;font-weight:600;font-size:.9rem;color:var(--cfa-refresh);}
.cfa-savebar .cfa-btns{margin-left:auto;}

/* ---- Hairline rows ------------------------------------------------------- */
.cfa-rows{border-top:1px solid var(--cfa-rule);}
.cfa-row{
  display:flex;align-items:center;gap:16px clamp(16px,2.4vw,28px);
  padding:18px 0;border-bottom:1px solid var(--cfa-rule);
}
.cfa-row-main{flex:1;min-width:0;}
.cfa-row-t{font-weight:600;font-size:.98rem;line-height:1.35;color:var(--cfa-grey);margin:0;}
.cfa-row-s{font-weight:300;font-size:.84rem;line-height:1.5;color:var(--cfa-mute);margin:5px 0 0;}
.cfa-row-r{text-align:right;flex:none;}
.cfa-amt{font-weight:600;font-size:.98rem;color:var(--cfa-grey);}
.cfa-amt .woocommerce-Price-amount,
.cfa-amt bdi{color:inherit;font-weight:inherit;}

/* ---- Course cards -------------------------------------------------------- */
.cfa-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,26px);}
.cfa-card{
  display:flex;flex-direction:column;
  border:1px solid var(--cfa-rule);background:var(--cfa-surface);padding:20px;
  text-decoration:none;color:inherit;
  transition:border-color .18s ease,background .18s ease;
}
.cfa-card:hover{border-color:rgba(202,231,249,.5);background:rgba(230,231,232,.075);}
.cfa-card-t{font-weight:600;font-size:1rem;line-height:1.35;color:var(--cfa-grey);margin:0 0 auto;}
.cfa-card-m{font-weight:300;font-size:.8rem;color:var(--cfa-mute);margin:16px 0 8px;}

.cfa-bar{height:3px;background:rgba(230,231,232,.16);overflow:hidden;}
.cfa-bar i{display:block;height:100%;background:var(--cfa-refresh);}

/* ---- Resume -------------------------------------------------------------- */
.cfa-resume{
  display:flex;align-items:center;gap:clamp(20px,3vw,34px);flex-wrap:wrap;
  border:1px solid rgba(202,231,249,.4);background:rgba(202,231,249,.07);
  padding:clamp(22px,3vw,30px);margin:0 0 clamp(30px,4vw,44px);
}
.cfa-resume[hidden]{display:none;}
.cfa-resume-main{flex:1;min-width:230px;}
.cfa-resume h3{
  font-weight:700;font-size:clamp(1.15rem,2.8vw,1.45rem);line-height:1.2;
  color:var(--cfa-grey);margin:0;
}
.cfa-resume p{font-weight:300;font-size:.92rem;line-height:1.55;color:var(--cfa-body);margin:10px 0 16px;}

/* ---- Tags and pairs ------------------------------------------------------ */
.cfa-tag{
  display:inline-block;padding:4px 11px;
  font-weight:700;font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;
}
.cfa-tag-on{background:rgba(202,231,249,.16);color:var(--cfa-refresh);}
.cfa-tag-off{background:rgba(230,231,232,.1);color:var(--cfa-mute);}

.cfa-pairs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,34px);margin:0;}
.cfa-pair dt{
  font-weight:700;font-size:.68rem;letter-spacing:.13em;text-transform:uppercase;
  color:var(--cfa-mute);margin:0 0 8px;
}
.cfa-pair dd{font-weight:600;font-size:1.06rem;line-height:1.4;color:var(--cfa-grey);margin:0;}
.cfa-pair dd small{display:block;font-weight:300;font-size:.82rem;color:var(--cfa-mute);margin-top:5px;}
.cfa-pair dd .woocommerce-Price-amount,
.cfa-pair dd bdi{color:inherit;font-weight:inherit;}

/* ---- Handoff ------------------------------------------------------------- */
.cfa-handoff{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px dashed var(--cfa-rule);padding:16px 18px;margin-top:22px;
}
.cfa-handoff p{
  margin:0;font-weight:300;font-size:.87rem;line-height:1.55;
  color:var(--cfa-mute);flex:1;min-width:200px;
}

/* ---- Signed out ---------------------------------------------------------- */
.cfa-signedout h1{
  font-weight:700;font-size:clamp(1.8rem,5vw,2.6rem);line-height:1.02;
  letter-spacing:-.015em;text-transform:uppercase;margin:0 0 14px;
}

/* ---- The raw shortcode output -------------------------------------------- */
/* MemberPress's own course list is the data source for the cards above. It is
   left in the page and only hidden by the script once at least one card has
   rendered, so a script error or a markup change leaves the member with their
   ordinary list rather than an empty panel. */
.cfa-courses-src.is-consumed{display:none;}
.cfa-courses-src a{color:var(--cfa-grey);}
.cfa-courses-src .mpcs-course-list .grid{
  display:flex;align-items:center;gap:16px;
  padding:16px 0;border-bottom:1px solid var(--cfa-rule);
}
.cfa-courses-src .col-1-2{width:auto;padding:0;float:none;}
.cfa-courses-src .col-1-2:first-child{flex:1 1 auto;min-width:0;}
.cfa-courses-src progress{width:clamp(90px,14vw,170px);height:6px;
  -webkit-appearance:none;appearance:none;border:0;background:rgba(230,231,232,.16);}
.cfa-courses-src progress::-webkit-progress-bar{background:rgba(230,231,232,.16);}
.cfa-courses-src progress::-webkit-progress-value{background:var(--cfa-refresh);}
.cfa-courses-src progress::-moz-progress-bar{background:var(--cfa-refresh);}

/* ---- WooCommerce endpoint fallback --------------------------------------- */
.cfa-backrow{margin:0 0 26px;}
.cfa-woo .woocommerce-MyAccount-navigation ul{
  list-style:none;margin:0 0 30px;padding:0 0 2px;
  display:flex;flex-wrap:wrap;gap:12px clamp(18px,2.4vw,34px);
  border-bottom:1px solid var(--cfa-rule);
}
.cfa-woo .woocommerce-MyAccount-navigation li{margin:0;padding:0;background:none;}
.cfa-woo .woocommerce-MyAccount-navigation a{
  display:inline-block;padding:0 0 13px;text-decoration:none;
  font-weight:700;font-size:.74rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--cfa-mute);border-bottom:2px solid transparent;margin-bottom:-2px;
}
.cfa-woo .woocommerce-MyAccount-navigation li.is-active a{
  color:var(--cfa-grey);border-bottom-color:var(--cfa-refresh);
}
.cfa-woo table.shop_table,.cfa-woo .woocommerce-table{
  width:100%;border-collapse:collapse;border:0;background:none;
}
.cfa-woo table th{
  text-align:left;padding:0 14px 12px 0;border:0;border-bottom:1px solid var(--cfa-rule);
  font-weight:700;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cfa-mute);
}
.cfa-woo table td{
  padding:16px 14px 16px 0;border:0;border-bottom:1px solid var(--cfa-rule);
  font-weight:300;font-size:.96rem;color:var(--cfa-body);vertical-align:middle;
}
.cfa-woo table td a{color:var(--cfa-grey);}
.cfa-woo .button,.cfa-woo button.button,.cfa-woo input[type="submit"]{
  --btn-h:44px;
  --btn-cut:calc(var(--btn-h) * .211);
  display:inline-block;height:var(--btn-h);cursor:pointer;
  font-family:inherit;font-weight:700;font-size:.74rem;letter-spacing:.09em;
  text-transform:uppercase;line-height:var(--btn-h);
  color:var(--cfa-midnight) !important;background:var(--cfa-grey) !important;
  border:0 !important;box-shadow:none !important;
  border-radius:999px 0 0 999px !important;
  clip-path:polygon(0 0,100% 0,calc(100% - var(--btn-cut)) 100%,0 100%);
  padding:0 calc(26px + var(--btn-cut)) 0 26px;text-decoration:none;
}
.cfa-woo label{
  font-weight:700;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--cfa-mute);
}
.cfa-woo input.input-text,.cfa-woo select,.cfa-woo textarea{
  width:100%;font-family:inherit;font-size:1rem;font-weight:300;
  color:var(--cfa-grey);background:var(--cfa-surface);
  border:1px solid var(--cfa-rule);border-radius:0;padding:13px 15px;
}
.cfa-woo mark{background:none;color:var(--cfa-refresh);font-weight:600;}

/* ===========================================================================
   Narrow
   =========================================================================== */
@media(max-width:900px){
  .cfa-cards{grid-template-columns:repeat(2,1fr);}
  .cfa-pairs{grid-template-columns:1fr 1fr;}
}
@media(max-width:860px){
  .cfa-util{display:none;}
  .cfa-foot{display:flex;}
}
@media(max-width:640px){
  .cfa-grid2,.cfa-cards,.cfa-pairs{grid-template-columns:1fr;}
  .cfa-ident h1{font-size:1.5rem;}
  .cfa-hdr .cfa-av{width:64px;height:64px;}
  .cfa-hdr .cfa-av-initials{font-size:1.25rem;}
  .cfa-row{flex-wrap:wrap;}
  .cfa-row-r{text-align:left;width:100%;}
  .cfa-woo table.shop_table thead{display:none;}
  .cfa-woo table.shop_table tr{
    display:block;padding:16px 0;border-bottom:1px solid var(--cfa-rule);
  }
  .cfa-woo table.shop_table td{
    display:block;padding:2px 0;border:0;
  }
  .cfa-woo table.shop_table td::before{
    content:attr(data-title) ": ";
    font-weight:700;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--cfa-mute);
  }
}

@media(prefers-reduced-motion:reduce){
  .cfa *{transition:none !important;}
}

/* ---- Team ---------------------------------------------------------------- */
.cfa-seats{display:flex;align-items:baseline;gap:12px;margin:0 0 8px;}
.cfa-seats b{font-weight:700;font-size:2rem;line-height:1;color:var(--cfa-grey);}
.cfa-seats span{font-weight:300;font-size:.92rem;color:var(--cfa-mute);}
.cfa-seats-bar{max-width:280px;}
.cfa-team-rows{margin-top:30px;}
.cfa-av-face{width:38px;height:38px;}
.cfa-av-face .cfa-av-initials{font-size:.72rem;}

/* ---- Team: signup link and invite form ----------------------------------- */
.cfa-copy{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.cfa .cfa-copy input{
  flex:1;min-width:240px;
  font-family:inherit;font-size:.92rem;font-weight:300;color:var(--cfa-grey);
  background:var(--cfa-surface);border:1px solid var(--cfa-rule);border-radius:0;
  padding:12px 15px;
}
.cfa .cfa-copy input:focus{outline:2px solid var(--cfa-refresh);outline-offset:-1px;}
.cfa .cfa-btn[disabled]{background:var(--cfa-refresh);cursor:default;}

.cfa-check{display:flex;align-items:flex-start;gap:11px;margin-top:20px;cursor:pointer;}
.cfa-check input{
  width:17px;height:17px;margin:2px 0 0;flex:none;accent-color:var(--cfa-refresh);
}
.cfa-check span{font-weight:300;font-size:.92rem;line-height:1.5;color:var(--cfa-body);}

/* Remove reads as an action, not a warning. The confirm dialog carries the weight. */
.cfa .cfa-link-quiet{
  background:none;border:0;padding:0 0 2px;cursor:pointer;font-family:inherit;
  color:var(--cfa-mute);border-bottom:1px solid transparent;
}
.cfa .cfa-link-quiet:hover{color:var(--cfa-grey);border-bottom-color:var(--cfa-rule);}
.cfa .cfa-link-quiet[disabled]{opacity:.45;cursor:default;}

/* ---- MemberPress subscription actions -----------------------------------
   The Billing tab renders the payment gateway's own cancel, resume and
   update-card links via print_user_account_subscription_row_actions(). Their
   markup is MemberPress's and is not rewritten, so everything here is styling
   applied over the top. Keep these selectors loose: they belong to MemberPress
   and a version bump can rename them, at which point the links go back to
   looking like plain links rather than disappearing.
   ------------------------------------------------------------------------ */
.cfa-mepr-actions{
  display:flex;flex-wrap:wrap;gap:14px 20px;align-items:center;margin-top:28px;
}
.cfa-mepr-actions a,
.cfa-mepr-actions .mepr-account-row-action{
  display:inline-flex;align-items:center;height:38px;padding:0 22px;
  font-family:inherit;font-weight:700;font-size:.7rem;letter-spacing:.09em;
  text-transform:uppercase;text-decoration:none;line-height:1;
  color:var(--cfa-grey);background:none;
  border:1px solid var(--cfa-rule);
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}
.cfa-mepr-actions a:hover,
.cfa-mepr-actions .mepr-account-row-action:hover{
  background:rgba(230,231,232,.08);border-color:rgba(202,231,249,.5);color:var(--cfa-grey);
}
/* Their icon font ships arrows and crosses into these links. At button size they
   read as noise beside an all-caps label, so they are dropped rather than styled. */
.cfa-mepr-actions i,
.cfa-mepr-actions .mp-icon,
.cfa-mepr-actions [class^="mp-icon-"],
.cfa-mepr-actions [class*=" mp-icon-"]{display:none !important;}

/* The confirm popup magnific opens. It is appended to <body>, outside .cfa, so
   these selectors cannot be scoped under .cfa-page's wrapper and are scoped to
   MemberPress's own popup classes instead. */
.mfp-bg{background:#090E14 !important;opacity:.88 !important;}
.mfp-content .mepr-popup,
.mfp-content .mepr-confirm,
.mfp-content > .white-popup,
.mfp-content > div[id*="mepr"]{
  background:#090E14;border:1px solid rgba(230,231,232,.2);
  color:#E6E7E8;font-family:Figtree,Inter,Arial,sans-serif;font-weight:300;
  max-width:520px;margin:0 auto;padding:clamp(24px,4vw,36px);
}
.mfp-content div[id*="mepr"] h2,
.mfp-content div[id*="mepr"] h3{
  font-weight:700;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;
  color:#E6E7E8;margin:0 0 12px;
}
.mfp-content div[id*="mepr"] a,
.mfp-content div[id*="mepr"] button{
  font-weight:700;font-size:.72rem;letter-spacing:.09em;text-transform:uppercase;
  cursor:pointer;
}
.mfp-content .mepr-confirm-yes{color:#CAE7F9;}
.mfp-content .mepr-confirm-no{color:rgba(230,231,232,.55);}

/* ---- The confirm popup must never show inline --------------------------
   MemberPress renders its cancel/resume confirm content into the page and
   relies on magnific popup's .mfp-hide to keep it out of sight until opened.
   That stylesheet is MemberPress's and is enqueued by CFA_Render::mepr_assets(),
   but this account area must not depend on another plugin's CSS loading in
   order to avoid showing "Are you sure you want to cancel this subscription?"
   sitting in the middle of the page. One line, no dependency.
   ---------------------------------------------------------------------- */
.mfp-hide{display:none !important;}

/* An admin-only note explaining why a section did not render. Members never
   see these; they exist so a missing section can be diagnosed on the page
   instead of from the server. */
.cfa-adminnote{
  margin:18px 0 0;padding:12px 15px;
  border:1px dashed rgba(202,231,249,.45);
  background:rgba(202,231,249,.06);
  font-weight:300;font-size:.82rem;line-height:1.55;color:var(--cfa-refresh);
}
.cfa-adminnote strong{font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.7rem;}