/* =====================================================================
   MSP Influencer — Winners Circle member pages (Ultimate Member)
   Shared skin for: Login, Register, Password Reset, Logout,
                    Account, Profile, Directory.
   Palette matches the ForzaDash listicle (teams-wifi-takeaways.css).

   Loaded by inc/templates/winners-circle.php on the template-wc-*.php pages.
   Scope: everything lives under .mspi-um so the site header/footer and
   any other UM form on the site are never touched.
   ===================================================================== */
.mspi-um{
  --navy:#2B3F56;
  --ink:#192635;
  --blue:#0C6DB2;
  --blue-dk:#055a96;
  --green:#019147;
  --green-br:#02ad55;
  --cream:#eef0ee;
  --paper:#eef1f4;
  --card:#fff;
  --line:#e1e6ec;
  --muted:#69788a;
  --head:'Schibsted Grotesk',system-ui,sans-serif;
  --body:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'DM Mono',ui-monospace,monospace;
  --wrap:1180px;
}
.mspi-um,.mspi-um *{box-sizing:border-box}
.mspi-um{background:var(--paper);font-family:var(--body);color:#27313d;line-height:1.6;-webkit-font-smoothing:antialiased}
.mspi-um img{display:block;max-width:100%}
.mspi-um a{color:inherit;text-decoration:none}

/* break out of Astra's content container (same trick as the listicle) */
body.mspi-um-page #content,
body.mspi-um-page #content .ast-container,
body.mspi-um-page #primary,
body.mspi-um-page .entry-content{max-width:none;width:100%;margin:0;padding:0;background:transparent}
body.mspi-um-page #content .ast-container{display:block!important}
body.mspi-um-page #primary{flex:1 1 100%;border:0;float:none}
body.mspi-um-page .site-content{background:transparent}
body.mspi-um-page #secondary{display:none}

/* ---------------------------------------------------------------
   SPLIT SHELL — brand panel (left) + form card (right)
   --------------------------------------------------------------- */
.mspi-um .auth{max-width:var(--wrap);margin:0 auto;padding:46px 26px 70px;
  display:grid;grid-template-columns:1.02fr .98fr;gap:0;align-items:stretch}
@media(max-width:900px){.mspi-um .auth{grid-template-columns:1fr;padding:26px 18px 46px}}

/* --- left: brand panel --- */
.mspi-um .brand{position:relative;overflow:hidden;color:#fff;border-radius:22px 0 0 22px;
  padding:48px 46px;display:flex;flex-direction:column;justify-content:space-between;
  background:linear-gradient(135deg,#284057 0%,var(--navy) 42%,var(--ink) 100%)}
.mspi-um .brand::before{content:"";position:absolute;inset:0;background:
   radial-gradient(90% 120% at 88% -10%,rgba(12,109,178,.45),transparent 55%),
   radial-gradient(70% 90% at 6% 110%,rgba(1,145,71,.32),transparent 55%)}
.mspi-um .brand > *{position:relative}
@media(max-width:900px){.mspi-um .brand{border-radius:18px 18px 0 0;padding:34px 26px}}

.mspi-um .brand__crumb{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;
  letter-spacing:.06em;color:#9fb6cf;margin:0 0 30px}
.mspi-um .brand__crumb a{color:#cbd8e5;transition:color .15s}
.mspi-um .brand__crumb a:hover{color:var(--green-br)}
.mspi-um .brand__sep{color:#5f7da0}

.mspi-um .brand__kick{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:11px;
  letter-spacing:.18em;text-transform:uppercase;color:#bcd4e8}
.mspi-um .brand__kick .seg{width:22px;height:1px;background:var(--green-br)}
.mspi-um .brand__h{font-family:var(--head);font-weight:800;color:#fff;letter-spacing:-.025em;line-height:1.07;
  margin:18px 0 0;font-size:clamp(30px,3.6vw,44px);max-width:13ch}
.mspi-um .brand__sub{margin:16px 0 0;max-width:44ch;font-size:16.5px;color:#cbd8e5;line-height:1.6}

.mspi-um .brand__list{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:14px}
.mspi-um .brand__list li{position:relative;padding-left:32px;font-size:15.5px;color:#dbe6f0;line-height:1.5}
.mspi-um .brand__list li::before{content:"";position:absolute;left:0;top:7px;width:9px;height:9px;border-radius:50%;
  background:var(--green-br);box-shadow:0 0 0 5px rgba(2,173,85,.16)}

.mspi-um .brand__foot{margin-top:38px;padding-top:22px;border-top:1px solid rgba(255,255,255,.14);
  font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#86a7c6;line-height:1.7}
.mspi-um .brand__foot a{color:#cbd8e5;border-bottom:1px solid rgba(203,216,229,.35)}
.mspi-um .brand__foot a:hover{color:var(--green-br);border-color:var(--green-br)}

/* --- right: form card --- */
.mspi-um .card{background:var(--card);border:1px solid var(--line);border-left:0;border-radius:0 22px 22px 0;
  padding:48px 46px;display:flex;flex-direction:column;justify-content:center;
  box-shadow:0 30px 70px -40px rgba(25,38,53,.45)}
@media(max-width:900px){.mspi-um .card{border-left:1px solid var(--line);border-radius:0 0 18px 18px;padding:32px 24px}}

.mspi-um .card__lab{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--green)}
.mspi-um .card__h{font-family:var(--head);font-weight:800;color:var(--ink);font-size:clamp(24px,2.6vw,30px);
  letter-spacing:-.02em;line-height:1.15;margin:8px 0 8px}
.mspi-um .card__p{font-size:15.5px;color:var(--muted);margin:0 0 26px;max-width:44ch}
.mspi-um .card__p a{color:var(--blue);font-weight:600}
.mspi-um .card__p a:hover{color:var(--blue-dk);text-decoration:underline}

/* ---------------------------------------------------------------
   ULTIMATE MEMBER FORM RESKIN
   Targets UM's own output classes so no plugin templates are forked.
   --------------------------------------------------------------- */
.mspi-um .um{max-width:none!important;margin:0!important}
.mspi-um .um .um-form{padding:0!important}
.mspi-um .um-form form{margin:0}

/* field block */
.mspi-um .um-field{padding:0 0 18px!important;margin:0!important}
.mspi-um .um-field-label{margin:0 0 7px!important;padding:0!important;border:0!important}
.mspi-um .um-field-label label,
.mspi-um .um-field > label{font-family:var(--mono)!important;font-size:10.5px!important;letter-spacing:.14em!important;
  text-transform:uppercase!important;color:var(--muted)!important;font-weight:500!important;margin:0!important}
.mspi-um .um-field-label .um-field-label-icon{display:none!important}
.mspi-um .um-field-area{position:relative}

/* inputs */
.mspi-um .um-form input[type=text],
.mspi-um input[type=search].um-search-line,
.mspi-um .um-search input[type=text],
.mspi-um .um-form input[type=email],
.mspi-um .um-form input[type=password],
.mspi-um .um-form input[type=tel],
.mspi-um .um-form input[type=number],
.mspi-um .um-form select,
.mspi-um .um-form textarea{
  width:100%!important;height:auto!important;font-family:var(--body)!important;font-size:16px!important;color:var(--ink)!important;
  background:#fbfcfd!important;border:1px solid var(--line)!important;border-radius:12px!important;
  padding:14px 16px!important;line-height:1.4!important;box-shadow:none!important;transition:border-color .15s,box-shadow .15s,background .15s}
.mspi-um .um-form input::placeholder,
.mspi-um .um-form textarea::placeholder{color:#9aa8b7!important}
.mspi-um .um-form input:focus,
.mspi-um .um-form select:focus,
.mspi-um .um-form textarea:focus{
  background:#fff!important;border-color:var(--blue)!important;outline:0!important;
  box-shadow:0 0 0 4px rgba(12,109,178,.12)!important}
.mspi-um .um-form input.um-error,
.mspi-um .um-form .um-error input{border-color:#d94848!important;box-shadow:0 0 0 4px rgba(217,72,72,.10)!important}

/* password show/hide toggle UM injects */
.mspi-um .um-field-area .um-field-icon,
.mspi-um .um-field-area i.um-icon-eye,
.mspi-um .um-field-area i.um-icon-eye-off{color:var(--muted)!important;right:14px!important}

/* remember-me + forgot row */
.mspi-um .um-col-alt{padding:0!important;margin:0 0 20px!important}
.mspi-um .um-col-alt-b{padding:0!important;text-align:left!important}
.mspi-um .authrow{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:2px 0 24px}
.mspi-um .um-field-checkbox{display:inline-flex!important;align-items:center;gap:9px;font-size:14.5px!important;
  color:var(--navy)!important;cursor:pointer;margin:0!important;padding:0!important;border:0!important;background:none!important}
.mspi-um .um-field-checkbox input[type=checkbox]{width:17px!important;height:17px!important;accent-color:var(--green);
  margin:0!important;cursor:pointer}
.mspi-um .um-field-checkbox-state{display:none!important}   /* UM's icon-based fake box */
.mspi-um .um-field-checkbox-option{font-size:14.5px!important;color:var(--navy)!important}
.mspi-um .um-link-alt,
.mspi-um a.forgot{font-family:var(--head);font-weight:600;font-size:14px;color:var(--blue)}
.mspi-um .um-link-alt:hover,
.mspi-um a.forgot:hover{color:var(--blue-dk);text-decoration:underline}

/* buttons */
.mspi-um .um-button,
.mspi-um input[type=submit].um-button,
.mspi-um a.um-button{
  display:flex!important;align-items:center;justify-content:center;gap:9px;width:100%!important;
  font-family:var(--head)!important;font-weight:700!important;font-size:15.5px!important;line-height:1!important;
  padding:16px 22px!important;border-radius:999px!important;border:1px solid transparent!important;
  background:var(--green)!important;color:#fff!important;text-shadow:none!important;
  box-shadow:0 10px 26px -12px rgba(1,145,71,.85)!important;transition:.16s;cursor:pointer;height:auto!important}
.mspi-um .um-button:hover,
.mspi-um input[type=submit].um-button:hover,
.mspi-um a.um-button:hover{background:var(--green-br)!important;transform:translateY(-1px)}
.mspi-um .um-button.um-alt,
.mspi-um a.um-button.um-alt{background:#fff!important;color:var(--navy)!important;border-color:var(--line)!important;box-shadow:none!important}
.mspi-um .um-button.um-alt:hover,
.mspi-um a.um-button.um-alt:hover{border-color:var(--blue)!important;color:var(--blue)!important;transform:none}
/* UM puts login + register side by side in halves — stack them */
.mspi-um .um-left.um-half,
.mspi-um .um-right.um-half{width:100%!important;float:none!important;margin:0 0 12px!important}
.mspi-um .um-clear{clear:both}

/* notices */
.mspi-um .um-notice{border-radius:12px!important;padding:14px 16px 14px 44px!important;font-size:14.5px!important;
  position:relative;margin:0 0 20px!important;border:1px solid var(--line)!important;line-height:1.5}
.mspi-um .um-notice::before{content:"!";position:absolute;left:15px;top:14px;width:18px;height:18px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-family:var(--mono);font-size:12px;font-weight:500;color:#fff}
.mspi-um .um-notice.err{background:#fdf2f2!important;border-color:#f3cccc!important;color:#8f2020!important}
.mspi-um .um-notice.err::before{background:#d94848}
.mspi-um .um-notice.success{background:#f0f8f3!important;border-color:#c8e6d4!important;color:#0d5c33!important}
.mspi-um .um-notice.success::before{content:"\2713";background:var(--green)}

/* footer of the card */
.mspi-um .card__alt{margin-top:24px;padding-top:20px;border-top:1px solid var(--line);
  font-size:14.5px;color:var(--muted);text-align:center}
.mspi-um .card__alt a{color:var(--blue);font-weight:600}
.mspi-um .card__alt a:hover{color:var(--blue-dk);text-decoration:underline}
.mspi-um .card__note{margin-top:14px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:#9aa8b7;text-align:center;line-height:1.8}

/* divider */
.mspi-um .sep{display:flex;align-items:center;gap:14px;margin:24px 0;
  font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#9aa8b7}
.mspi-um .sep::before,.mspi-um .sep::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---------------------------------------------------------------
   REAL UM OUTPUT — details the static preview didn't cover
   --------------------------------------------------------------- */
.mspi-um .card__h,.mspi-um .brand__h,.mspi-um .acct-hero__h{padding:0;border:0}
.mspi-um .card__note a{color:inherit;text-decoration:underline}

/* UM hides the native checkbox/radio behind an icon font — show the native
   control (accent-coloured) and hide the fake icon instead */
.mspi-um .um-field-checkbox,
.mspi-um .um-field-radio{display:inline-flex!important;align-items:center;gap:9px;position:relative;
  margin:0 0 8px!important;padding:0!important;min-height:0!important;line-height:1.4!important;cursor:pointer}
.mspi-um .um-field-checkbox input[type=checkbox],
.mspi-um .um-field-radio input[type=radio]{display:inline-block!important;position:static!important;opacity:1!important;
  width:17px!important;height:17px!important;margin:0!important;accent-color:var(--green);cursor:pointer}
.mspi-um .um-field-radio-state{display:none!important}
.mspi-um .um-field-radio-option{font-size:14.5px!important;color:var(--navy)!important;padding:0!important}
.mspi-um .um-field-checkbox-option{padding:0!important;line-height:1.4!important}
.mspi-um .um-field-half{width:auto!important;float:none!important;display:inline-flex;margin-right:22px!important}

/* login: "remember me" + "forgot password" row (built by inline JS) */
.mspi-um .authrow .um-field{padding:0!important}
.mspi-um .authrow .um-field-checkbox{margin:0!important}
.mspi-um .authrow .um-col-alt-b{margin:0!important}
.mspi-um .authrow + .um-clear{display:none}
.mspi-um .um-col-alt-b{margin-top:6px!important;text-align:center!important}
.mspi-um .um-center,
.mspi-um .um-left,
.mspi-um .um-right{float:none!important;width:100%!important;text-align:left}

/* field errors, help text, dividers */
.mspi-um .um-field-error{position:relative!important;background:#fdf2f2!important;color:#8f2020!important;
  border:1px solid #f3cccc;border-radius:10px!important;padding:8px 12px!important;margin:8px 0 0!important;
  font-size:13.5px!important;line-height:1.45!important;box-shadow:none!important;text-align:left!important}
.mspi-um .um-field-arrow{display:none!important}
.mspi-um .um-field-block,
.mspi-um .um-field-block div{text-align:left!important;font-size:15px;color:var(--muted);line-height:1.55}
.mspi-um .um-field-type_block{padding-bottom:14px!important}
.mspi-um .um-field-divider{border-color:var(--line)!important;margin:10px 0 22px!important}
.mspi-um .um-field-divider-text span{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:#fff!important}
.mspi-um .um-row,.mspi-um .um-col-1{margin:0!important;padding:0!important}
.mspi-um .um-row._um_row_1{margin:0!important}
.mspi-um .um-row .um-col-121,.mspi-um .um-row .um-col-122{width:100%!important;float:none!important;padding:0!important}
.mspi-um .um-form select{appearance:none;-webkit-appearance:none;padding-right:40px!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%2369788a' stroke-width='1.6' d='M1 1.5l5 5 5-5'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;background-position:right 16px center!important}
.mspi-um .select2-container .select2-selection--single{height:auto!important;border:1px solid var(--line)!important;border-radius:12px!important;padding:10px 12px!important;background:#fbfcfd!important}

/* UM "you are logged in" block */
.mspi-um .um-logout{text-align:center}
.mspi-um .um-logout .um-avatar img{width:80px;height:80px;border-radius:50%;margin:0 auto 12px}
.mspi-um .um-logout .um-name a{font-family:var(--head);font-weight:700;font-size:18px;color:var(--ink)}
.mspi-um .um-misc-ul{list-style:none;margin:14px 0 0;padding:0;display:flex;justify-content:center;gap:18px}
.mspi-um .um-misc-ul a{color:var(--blue);font-weight:600}

/* our own signed-in card */
.mspi-um .signed{text-align:center;display:flex;flex-direction:column;align-items:center}
.mspi-um .signed__av img{width:72px;height:72px;border-radius:50%;box-shadow:0 0 0 5px rgba(1,145,71,.14);margin:0 0 16px}
.mspi-um .signed .card__p{margin-left:auto;margin-right:auto}
.mspi-um .signed .um-button{margin:0 0 10px}

/* brand panel with an admin-selected background image */
.mspi-um .brand[style]::before{opacity:.75}

/* ---------------------------------------------------------------
   ACCOUNT PAGE — header band + account card
   --------------------------------------------------------------- */
.mspi-um--band{padding-bottom:70px}

.mspi-um .acct-hero{position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(135deg,#284057 0%,var(--navy) 42%,var(--ink) 100%)}
.mspi-um .acct-hero::before{content:"";position:absolute;inset:0;background:
   radial-gradient(60% 140% at 92% -20%,rgba(12,109,178,.45),transparent 60%),
   radial-gradient(50% 120% at 0% 120%,rgba(1,145,71,.30),transparent 60%)}
.mspi-um .acct-hero[style]::before{opacity:.75}
.mspi-um .acct-hero__in{position:relative;max-width:var(--wrap);margin:0 auto;padding:40px 26px 96px}
.mspi-um .acct-hero .brand__crumb{margin-bottom:26px}
.mspi-um .acct-hero__row{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.mspi-um .acct-hero__av img{width:88px;height:88px;border-radius:50%;border:3px solid rgba(255,255,255,.9);
  box-shadow:0 0 0 6px rgba(2,173,85,.28),0 18px 40px -16px rgba(0,0,0,.6)}
.mspi-um .acct-hero__txt{flex:1 1 320px;min-width:0}
.mspi-um .acct-hero__h{font-family:var(--head);font-weight:800;color:#fff;letter-spacing:-.025em;line-height:1.08;
  margin:10px 0 0;font-size:clamp(28px,3.4vw,42px)}
.mspi-um .acct-hero__sub{margin:10px 0 0;color:#cbd8e5;font-size:16px;max-width:56ch}
.mspi-um .acct-hero__actions{display:flex;gap:10px;flex-wrap:wrap}
.mspi-um .acct-hero__chips{list-style:none;margin:28px 0 0;padding:20px 0 0;border-top:1px solid rgba(255,255,255,.14);
  display:flex;flex-wrap:wrap;gap:10px 34px}
.mspi-um .acct-hero__chips li{font-family:var(--head);font-weight:700;font-size:15px;color:#fff;margin:0;word-break:break-all}
.mspi-um .acct-hero__chips span{display:block;font-family:var(--mono);font-weight:400;font-size:10px;letter-spacing:.16em;
  text-transform:uppercase;color:#86a7c6;margin-bottom:4px}
@media(max-width:700px){.mspi-um .acct-hero__in{padding:28px 18px 84px}.mspi-um .acct-hero__av img{width:68px;height:68px}}

.mspi-um .acct-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--head);font-weight:700;font-size:14.5px;
  line-height:1;padding:12px 20px;border-radius:999px;border:1px solid transparent;transition:.16s;white-space:nowrap}
.mspi-um .acct-btn--ghost{background:#fff;color:var(--ink)}
.mspi-um .acct-btn--ghost:hover{background:var(--green-br);color:#fff}
.mspi-um .acct-btn--line{color:#fff;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.06)}
.mspi-um .acct-btn--line:hover{border-color:#fff;background:rgba(255,255,255,.14)}
.mspi-um .acct-btn--line-dk{color:var(--navy);border-color:var(--line);background:#fff}
.mspi-um .acct-btn--line-dk:hover{color:var(--blue);border-color:var(--blue)}

.mspi-um .acct{position:relative;max-width:var(--wrap);margin:-64px auto 0;padding:0 26px}
@media(max-width:700px){.mspi-um .acct{padding:0 14px}}
.mspi-um .acct__card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:28px;
  box-shadow:0 30px 70px -40px rgba(25,38,53,.45)}
@media(max-width:700px){.mspi-um .acct__card{padding:18px;border-radius:18px}}
.mspi-um .acct__card--guest{max-width:520px;margin:0 auto;text-align:center;padding:44px 36px}
.mspi-um .acct__card--guest .card__p{margin-left:auto;margin-right:auto}

.mspi-um .acct__help{margin-top:18px;display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap;
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:16px;padding:20px 24px}
.mspi-um .acct__help-h{font-family:var(--head);font-weight:700;color:var(--ink);font-size:17px;margin:4px 0 4px;padding:0;border:0}
.mspi-um .acct__help p{margin:0;color:var(--muted);font-size:15px}
.mspi-um .acct__help p a{color:var(--blue);font-weight:600}
.mspi-um .acct__help p a:hover{text-decoration:underline}

/* --- UM account: side nav + main panel --- */
.mspi-um .um-account{max-width:none!important;margin:0!important}
.mspi-um .um-account .um-form{padding:0!important}
.mspi-um .um-account .um-form > form{display:flex;align-items:flex-start;gap:28px}
.mspi-um .um-account .um-form > form > .um-clear{display:none}
.mspi-um .um-account.uimob500 .um-form > form{flex-direction:column;gap:0}

.mspi-um .um-account-side{flex:0 0 270px;width:auto!important;float:none!important;padding:16px!important;margin:0!important;
  background:var(--paper);border:1px solid var(--line);border-radius:16px;position:sticky;top:24px}
.mspi-um .um-account.uimob800 .um-account-side{flex-basis:78px}
.mspi-um .um-account-meta{display:flex!important;align-items:center;gap:12px;background:none!important;
  padding:4px 4px 16px!important;margin:0 0 10px!important;border-bottom:1px solid var(--line);text-align:left!important}
.mspi-um .um-account-meta-img{margin:0!important;float:none!important}
.mspi-um .um-account-meta img{width:48px!important;height:48px!important;border-radius:50%!important;display:block}
.mspi-um .um-account-name{padding:0!important;float:none!important;min-width:0}
.mspi-um .um-account-name a{font-family:var(--head);font-weight:700;font-size:15.5px;color:var(--ink)!important;line-height:1.25;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mspi-um .um-account-profile-link a{font-size:13px!important;color:var(--blue)!important;font-weight:600}

.mspi-um .um-account-side ul{list-style:none!important;margin:0!important;padding:0!important;display:grid;gap:3px}
.mspi-um .um-account-side li{margin:0!important;padding:0!important;background:none!important}
.mspi-um .um-account-side li a{display:flex!important;align-items:center;gap:12px;height:auto!important;padding:11px 12px!important;
  border-radius:11px;background:transparent!important;color:var(--navy)!important;line-height:1.3!important;transition:.15s}
.mspi-um .um-account-side li a:hover{background:#fff!important;color:var(--blue)!important}
.mspi-um .um-account-side li a.current,
.mspi-um .um-account-side li a.current:hover{background:var(--ink)!important;color:#fff!important;box-shadow:0 10px 24px -14px rgba(25,38,53,.8)}
.mspi-um .um-account-side li a span{float:none!important;width:auto!important;height:auto!important;line-height:1!important;
  padding:0!important;margin:0!important;color:inherit!important;background:none!important}
.mspi-um .um-account-side li a .um-account-icon{font-size:18px!important;width:22px!important;text-align:center}
.mspi-um .um-account-side li a .um-account-title{flex:1;font-family:var(--head);font-weight:600;font-size:15px!important}
.mspi-um .um-account-side li a .um-account-arrow{opacity:.45;font-size:16px!important}
.mspi-um .um-account-side li a.current .um-account-arrow{opacity:1;color:var(--green-br)!important}

.mspi-um .um-account-main{flex:1 1 auto;min-width:0;width:auto!important;float:none!important;padding:6px 6px 0!important;margin:0!important}
.mspi-um .um-account.uimob500 .um-account-main{padding:0!important}
.mspi-um .um-account-heading{display:flex!important;align-items:center;gap:12px;font-family:var(--head);font-weight:800;
  font-size:24px!important;letter-spacing:-.015em;color:var(--ink)!important;line-height:1.2!important;
  margin:0 0 24px!important;padding:0 0 18px!important;border-bottom:1px solid var(--line)}
.mspi-um .um-account-heading i{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;
  border-radius:12px;background:rgba(1,145,71,.1);color:var(--green);font-size:20px!important;margin:0!important;flex:0 0 auto}
.mspi-um .um-account-tab .um-field{max-width:620px}
.mspi-um .um-account-tab .um-col-alt{margin:8px 0 0!important;padding:22px 0 0!important;border-top:1px solid var(--line)}
.mspi-um .um-account .um-button,
.mspi-um .um-account input[type=submit].um-button{width:auto!important;display:inline-flex!important;padding:15px 30px!important}
.mspi-um .um-account-tab-delete .um-button{background:#d94848!important;box-shadow:0 10px 26px -12px rgba(217,72,72,.8)!important}
.mspi-um .um-account-tab-delete .um-button:hover{background:#c23a3a!important}
.mspi-um .um-account-tab .um-field-label{margin-bottom:9px!important}
.mspi-um .um-account-tab .um-field-radio,
.mspi-um .um-account-tab .um-field-checkbox{margin-right:22px!important}

/* mobile tab list UM shows instead of the side nav */
.mspi-um .um-account-nav a{display:flex!important;align-items:center;justify-content:space-between;padding:14px 16px!important;
  margin:0 0 8px!important;border:1px solid var(--line)!important;border-radius:12px;background:#fff!important;
  font-family:var(--head);font-weight:600;color:var(--navy)!important;height:auto!important;line-height:1.3!important}
.mspi-um .um-account-nav a.current{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.mspi-um .um-account-nav a span{float:none!important;position:static!important;color:inherit!important}
.mspi-um .um-account-meta.uimob500-show,
.mspi-um .um-account-meta.uimob340-show{margin-bottom:14px!important}

/* compact header band (directory / profile / signed-out account) */
.mspi-um .acct-hero--compact .acct-hero__in{padding-top:32px;padding-bottom:88px}
.mspi-um .acct-hero--compact .acct-hero__h{font-size:clamp(26px,3vw,36px)}

/* logout: tick badge */
.mspi-um .signed__ico{width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  margin:0 0 16px;background:rgba(1,145,71,.1);color:var(--green);font-size:28px;font-weight:700;
  box-shadow:0 0 0 6px rgba(1,145,71,.06)}
.mspi-um .signed .card__note{margin-top:18px}

/* ---------------------------------------------------------------
   UM MEMBER DIRECTORY
   Card positions are set by UM's masonry JS — only skin, never move.
   --------------------------------------------------------------- */
.mspi-um .um-directory{max-width:none!important;margin:0!important}
.mspi-um .um-member-directory-header{padding:0!important;margin:0 0 22px!important}
.mspi-um .um-member-directory-header-row{margin:0 0 12px!important}
.mspi-um .um-member-directory-search-line{display:flex!important;gap:10px;align-items:stretch;max-width:none!important}
.mspi-um .um-member-directory-search-line label{flex:1;margin:0!important;display:block}
.mspi-um .um-member-directory-search-line label > span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mspi-um .um-member-directory-search-line .um-do-search{width:auto!important;padding:0 28px!important;flex:0 0 auto}
.mspi-um .um-member-directory-nav-line{display:flex!important;align-items:center;flex-wrap:wrap;gap:10px 18px;
  font-size:14px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}
.mspi-um .um-member-directory-sorting select{width:auto!important;padding:9px 38px 9px 14px!important;font-size:14px!important}
.mspi-um .um-member-directory-filters-a a,
.mspi-um .um-member-directory-view-type a{color:var(--blue)!important;font-weight:600}
.mspi-um .um-member-directory-view-type a.um-member-directory-view-type-a{border:1px solid var(--line);border-radius:10px;padding:6px 9px;color:var(--navy)!important}
.mspi-um .um-search-filter{padding:0 8px 10px 0!important}
.mspi-um .um-members-filter-tag{background:rgba(12,109,178,.08)!important;color:var(--blue)!important;border-radius:999px!important;padding:5px 12px!important;font-size:13px!important}
.mspi-um .um-clear-filters-a{color:#d94848!important;font-weight:600}

.mspi-um .um-members .um-member{background:#fff!important;border:1px solid var(--line)!important;border-radius:18px!important;
  overflow:hidden;box-shadow:0 1px 0 rgba(25,38,53,.03);transition:border-color .16s,box-shadow .16s}
.mspi-um .um-members .um-member:hover{border-color:var(--blue)!important;box-shadow:0 18px 40px -24px rgba(25,38,53,.45)}
.mspi-um .um-member-cover{border-radius:0!important;background:linear-gradient(135deg,var(--navy),var(--ink))!important}
.mspi-um .um-member-photo{padding-top:26px!important}
.mspi-um .um-member-photo img{border:3px solid #fff!important;box-shadow:0 0 0 4px rgba(1,145,71,.18),0 10px 24px -12px rgba(25,38,53,.5)!important}
.mspi-um .um-member-card{padding:10px 20px 20px!important}
.mspi-um .um-member-name a{font-family:var(--head)!important;font-weight:700!important;font-size:17px!important;color:var(--ink)!important;letter-spacing:-.01em}
.mspi-um .um-member-name a:hover{color:var(--blue)!important}
.mspi-um .um-member-tagline{font-size:14px!important;color:var(--muted)!important;padding:4px 0 0!important;line-height:1.45}
.mspi-um .um-member-meta{border-top:1px solid var(--line)!important;margin-top:14px!important;padding-top:12px!important}
.mspi-um .um-member-metaline{font-size:13.5px!important;color:#4a5b6d!important;padding:3px 0!important}
.mspi-um .um-member-metaline strong{font-family:var(--mono);font-weight:500;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mspi-um .um-member-more a,.mspi-um .um-member-less a{color:var(--muted)!important}
.mspi-um .um-member-status{border-radius:0 0 10px 10px!important;font-family:var(--mono);font-size:10px!important;letter-spacing:.1em}
.mspi-um .um-members-none,.mspi-um .um-members-intro{font-size:15.5px;color:var(--muted);text-align:center;padding:30px 0}

.mspi-um .um-members-pagination-box{margin-top:26px!important}
.mspi-um .um-members-pagi{display:flex!important;justify-content:center;flex-wrap:wrap;gap:6px}
.mspi-um .um-members-pagi .pagi{min-width:38px;height:38px;display:inline-flex!important;align-items:center;justify-content:center;
  padding:0 10px!important;border:1px solid var(--line)!important;border-radius:999px!important;background:#fff!important;
  color:var(--navy)!important;font-family:var(--head);font-weight:600;font-size:14px!important;margin:0!important;cursor:pointer}
.mspi-um .um-members-pagi .pagi:hover{border-color:var(--blue)!important;color:var(--blue)!important}
.mspi-um .um-members-pagi .pagi.current{background:var(--ink)!important;border-color:var(--ink)!important;color:#fff!important}
.mspi-um .um-members-pagi .pagi.disabled{opacity:.4;cursor:default}

/* ---------------------------------------------------------------
   UM PROFILE
   --------------------------------------------------------------- */
.mspi-um .um-profile{max-width:none!important;margin:0!important}
.mspi-um .acct__card--profile{padding:0;overflow:hidden}
.mspi-um .acct__card--profile .um-profile .um-form{padding:0!important}
.mspi-um .um-profile .um-cover{background:linear-gradient(135deg,#284057,var(--navy) 45%,var(--ink))!important}
.mspi-um .um-profile .um-cover-add{color:#cbd8e5!important}
.mspi-um .um-profile .um-header{border-bottom:1px solid var(--line)!important;padding:0 28px 22px!important;min-height:0!important}
.mspi-um .um-profile .um-profile-photo a.um-profile-photo-img{border-radius:50%!important;border:4px solid #fff!important;
  box-shadow:0 0 0 5px rgba(1,145,71,.18),0 16px 34px -16px rgba(25,38,53,.55)!important;background:#fff}
.mspi-um .um-profile .um-name a{font-family:var(--head)!important;font-weight:800!important;font-size:26px!important;
  letter-spacing:-.02em;color:var(--ink)!important;line-height:1.15!important}
.mspi-um .um-profile .um-meta,
.mspi-um .um-profile .um-meta span{font-size:14.5px!important;color:var(--muted)!important}
.mspi-um .um-profile .um-meta-text{font-size:15.5px!important;color:#4a5b6d!important;line-height:1.6!important;max-width:70ch}
.mspi-um .um-profile .um-profile-edit a{color:var(--muted)!important}
.mspi-um .um-profile .um-profile-edit a:hover{color:var(--blue)!important}
.mspi-um .um-dropdown{border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:0 20px 40px -20px rgba(25,38,53,.45)!important;overflow:hidden}
.mspi-um .um-dropdown li a{font-size:14px!important;color:var(--navy)!important;padding:10px 16px!important}
.mspi-um .um-dropdown li a:hover{background:var(--paper)!important;color:var(--blue)!important}

.mspi-um .um-profile-nav{background:transparent!important;padding:12px 22px!important;border-bottom:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:6px}
.mspi-um .um-profile-nav-item{float:none!important;margin:0!important}
.mspi-um .um-profile-nav-item a[class*="-hide"]{display:inline-flex!important;align-items:center;gap:8px;padding:9px 16px!important;border-radius:999px!important;
  background:transparent!important;color:var(--navy)!important;font-family:var(--head);font-weight:600;font-size:14.5px!important;height:auto!important;line-height:1.2!important}
.mspi-um .um-profile-nav-item a:hover{background:var(--paper)!important;color:var(--blue)!important}
.mspi-um .um-profile-nav-item.active a{background:var(--ink)!important;color:#fff!important}
.mspi-um .um-profile-nav-item a span.title{padding:0!important}
.mspi-um .um-profile-nav-item a i{position:static!important;font-size:16px!important}
.mspi-um .um-profile-nav-item .um-tab-notifier{background:var(--green)!important}

.mspi-um .um-profile-body{padding:26px 28px 30px!important;max-width:none!important}
.mspi-um .um-profile-body .um-field{max-width:680px}
.mspi-um .um-profile.um-viewing .um-field-label label{color:var(--muted)!important}
.mspi-um .um-profile.um-viewing .um-field-value{font-size:16px!important;color:var(--ink)!important;line-height:1.55;
  padding:0 0 14px!important;border-bottom:1px solid var(--line)}
.mspi-um .um-profile.um-viewing .um-field-value a{color:var(--blue)!important}
.mspi-um .um-profile-note{color:var(--muted)!important;text-align:center;padding:30px 0!important}
.mspi-um .um-profile-note i{color:var(--line)!important}
.mspi-um .um-profile.um-editing .um-col-alt{border-top:1px solid var(--line);padding-top:22px!important;display:flex;gap:10px;flex-wrap:wrap}
.mspi-um .um-profile.um-editing .um-col-alt .um-half{width:auto!important;margin:0!important}
.mspi-um .um-profile.um-editing .um-col-alt .um-button{width:auto!important;display:inline-flex!important;padding:14px 28px!important}
@media(max-width:700px){
  .mspi-um .um-profile .um-header{padding:0 16px 18px!important}
  .mspi-um .um-profile-body{padding:20px 16px 24px!important}
}

/* ---------------------------------------------------------------
   MEMBER HOME — dashboard cards + updates (member-home.php)
   Reusable for future private pages (Resources, My Awards).
   --------------------------------------------------------------- */
.mspi-um .acct-btn--solid{background:var(--green);color:#fff;box-shadow:0 10px 24px -14px rgba(1,145,71,.9)}
.mspi-um .acct-btn--solid:hover{background:var(--green-br);transform:translateY(-1px)}
.mspi-um .acct-btn--soon{color:var(--muted);background:var(--paper);border-color:var(--line);cursor:not-allowed}

.mspi-um .dash-note{margin:0 0 14px;padding:12px 16px;border-radius:12px;background:#fff8e6;border:1px solid #f1dfae;color:#7a5b12;font-size:14px}
.mspi-um .dash{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
@media(max-width:1000px){.mspi-um .dash{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.mspi-um .dash{grid-template-columns:1fr;gap:14px}}

.mspi-um .dash-card{display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-radius:20px;padding:26px;box-shadow:0 30px 70px -44px rgba(25,38,53,.45);transition:border-color .16s,transform .16s}
.mspi-um .dash-card:hover{border-color:#c9d3de;transform:translateY(-2px)}
@media(max-width:640px){.mspi-um .dash-card{padding:22px;border-radius:18px}}
.mspi-um .dash-card__top{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;margin-bottom:18px}
.mspi-um .dash-card__ico{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:14px;
  background:linear-gradient(135deg,rgba(12,109,178,.12),rgba(1,145,71,.12));color:var(--blue)}
.mspi-um .dash-card__ico svg{width:23px;height:23px}
.mspi-um .dash-card__tag{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--green);
  background:rgba(1,145,71,.08);border:1px solid rgba(1,145,71,.2);border-radius:999px;padding:4px 10px;text-align:right}
.mspi-um .dash-card__h{font-family:var(--head);font-weight:800;color:var(--ink);font-size:19px;letter-spacing:-.01em;line-height:1.2;margin:0 0 8px;padding:0;border:0}
.mspi-um .dash-card__p{margin:0 0 22px;color:var(--muted);font-size:15px;flex:1}
.mspi-um .dash-card__soon{margin-top:8px;font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.mspi-um .dash-card--ssc{border-color:rgba(1,145,71,.35);background:linear-gradient(180deg,#fff 0%,#f5fbf7 100%)}
.mspi-um .dash-card--ssc .dash-card__ico{background:rgba(1,145,71,.12);color:var(--green)}

.mspi-um .dash-updates{margin-top:34px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:20px;padding:30px}
@media(max-width:640px){.mspi-um .dash-updates{padding:22px;border-radius:18px}}
.mspi-um .dash-updates__h{font-family:var(--head);font-weight:800;color:var(--ink);font-size:clamp(22px,2.4vw,28px);letter-spacing:-.02em;line-height:1.15;margin:6px 0 10px;padding:0;border:0}
.mspi-um .dash-updates__intro{color:var(--muted);font-size:15.5px;max-width:70ch}
.mspi-um .dash-updates__intro p{margin:0 0 10px}
.mspi-um .dash-updates__empty{margin:18px 0 0;padding:16px 18px;border-radius:14px;background:var(--paper);color:var(--muted);font-size:15px}
.mspi-um .dash-updates__list{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
@media(max-width:760px){.mspi-um .dash-updates__list{grid-template-columns:1fr}}
.mspi-um .dash-update{margin:0;padding:18px 20px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}
.mspi-um .dash-update__tag{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}
.mspi-um .dash-update__h{font-family:var(--head);font-weight:700;color:var(--ink);font-size:17px;margin:4px 0 6px;padding:0;border:0}
.mspi-um .dash-update__h a{color:var(--ink)}
.mspi-um .dash-update__h a:hover{color:var(--blue)}
.mspi-um .dash-update p{margin:0;color:var(--muted);font-size:14.5px}

/* UM prints every profile tab twice: an icon-only link for narrow screens
   (.uimob*-show) and a labelled one (.uimob*-hide). Always use the labelled
   link — the pills wrap fine on mobile — so tabs never appear twice. */
.mspi-um .um-profile-nav-item a[class*="-show"]{display:none!important}

/* Profile photo: keep the "change photo" camera visible while editing */
.mspi-um .um-profile.um-editing .um-profile-photo-overlay{display:block!important;opacity:1!important}

/* Cover photos off (Winners Circle → Member pages → Shared) */
.mspi-um--nocover .um-profile .um-cover,
.mspi-um--nocover .um-member-cover{display:none!important}
.mspi-um--nocover .um-profile .um-header{padding-top:28px!important}
.mspi-um--nocover .um-profile .um-profile-photo{margin-top:0!important}
.mspi-um--nocover .um-profile .um-profile-photo a.um-profile-photo-img{top:0!important}
