/* ============================================================================
   Morya Indian Club — UI v11 "Celebration" design layer
   ----------------------------------------------------------------------------
   Purely presentational. Loads AFTER app.css + v106-polish.css and re-skins the
   existing markup vocabulary. No class names were invented that the views do
   not already emit, so every page inherits the new look with zero PHP changes.
   Light + dark themes both handled (html[data-theme="dark"]).
   ========================================================================== */

/* ---------- 1. Tokens ---------------------------------------------------- */
:root{
  /* brand */
  --v11-indigo:#3F3B7D;
  --v11-indigo-deep:#2A2757;
  --v11-pink:#D62A8D;
  --v11-cyan:#2C95D2;
  --v11-saffron:#F28C18;
  --v11-gold:#E0B23C;
  --v11-maroon:#6E1730;

  --v11-gradient:linear-gradient(120deg,#2C95D2 0%,#3F3B7D 34%,#73358E 64%,#D62A8D 100%);
  --v11-gradient-soft:linear-gradient(120deg,rgba(44,149,210,.14),rgba(63,59,125,.12) 45%,rgba(214,42,141,.14));
  --v11-gradient-warm:linear-gradient(120deg,#F28C18,#D62A8D);

  /* surfaces */
  --v11-page:#F6F5FB;
  --v11-card:#FFFFFF;
  --v11-card-alt:#FBFAFF;
  --v11-ink:#171A2B;
  --v11-ink-2:#414664;
  --v11-muted:#6B7194;
  --v11-line:rgba(63,59,125,.13);
  --v11-line-soft:rgba(63,59,125,.075);

  /* elevation */
  --v11-sh-xs:0 1px 2px rgba(23,26,43,.05);
  --v11-sh-sm:0 4px 14px rgba(30,26,72,.06);
  --v11-sh:0 14px 38px rgba(30,26,72,.09);
  --v11-sh-lg:0 30px 70px rgba(30,26,72,.16);
  --v11-ring:0 0 0 4px rgba(63,59,125,.13);

  /* shape + motion */
  --v11-r-sm:12px;
  --v11-r:18px;
  --v11-r-lg:26px;
  --v11-r-xl:34px;
  --v11-ease:cubic-bezier(.22,.75,.3,1);
  --v11-fast:.16s var(--v11-ease);
  --v11-slow:.34s var(--v11-ease);

  --v11-font:"Inter Tight","Inter","Noto Sans Myanmar","Noto Sans Devanagari",system-ui,-apple-system,"Segoe UI",sans-serif;
  --v11-display:"Fraunces","Inter Tight",Georgia,serif;
}

html[data-theme="dark"]{
  --v11-page:#0F1119;
  --v11-card:#171A25;
  --v11-card-alt:#1D2130;
  --v11-ink:#EEF0F8;
  --v11-ink-2:#C3C8DC;
  --v11-muted:#8F96B4;
  --v11-line:rgba(255,255,255,.11);
  --v11-line-soft:rgba(255,255,255,.06);
  --v11-sh-sm:0 4px 14px rgba(0,0,0,.4);
  --v11-sh:0 16px 40px rgba(0,0,0,.48);
  --v11-sh-lg:0 30px 70px rgba(0,0,0,.6);
  --v11-ring:0 0 0 4px rgba(214,42,141,.22);
}

/* ---------- 2. Base ------------------------------------------------------ */
body{
  font-family:var(--v11-font);
  color:var(--v11-ink);
  font-size:15.5px;
  line-height:1.6;
  letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{letter-spacing:-.028em;line-height:1.14;color:var(--v11-ink)}
h1,.hero h1,.page-header h1,.member-page-head h1{font-family:var(--v11-display);font-weight:700;letter-spacing:-.035em}
p{color:var(--v11-ink-2)}
.muted,.form-help,small.muted,td small,.panel-header p{color:var(--v11-muted)}
::selection{background:rgba(214,42,141,.2)}

*:focus-visible{outline:none;box-shadow:var(--v11-ring);border-radius:8px}

/* nicer scrollbars */
*{scrollbar-width:thin;scrollbar-color:rgba(63,59,125,.28) transparent}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:rgba(63,59,125,.26);border-radius:99px;border:3px solid transparent;background-clip:content-box}
*::-webkit-scrollbar-thumb:hover{background:rgba(63,59,125,.45);background-clip:content-box}
*::-webkit-scrollbar-track{background:transparent}

.admin-body,.member-body{background:var(--v11-page)}
html[data-theme="dark"] .public-body{background:var(--v11-page)}

/* ---------- 3. Buttons --------------------------------------------------- */
.button{
  border-radius:13px;
  min-height:44px;
  padding:10px 20px;
  font-weight:700;
  letter-spacing:-.012em;
  position:relative;
  overflow:hidden;
  transition:transform var(--v11-fast),box-shadow var(--v11-fast),background var(--v11-fast),border-color var(--v11-fast),color var(--v11-fast);
}
.button::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at var(--x,50%) var(--y,50%),rgba(255,255,255,.35),transparent 60%);
  opacity:0;transition:opacity var(--v11-slow);pointer-events:none;
}
.button:hover::after{opacity:1}
.button:hover{transform:translateY(-2px)}
.button:active{transform:translateY(0) scale(.985)}

.button-primary{
  background:var(--v11-gradient);
  background-size:180% 180%;
  border-color:transparent;color:#fff;
  box-shadow:0 10px 26px rgba(63,59,125,.28);
  animation:v11Sheen 9s var(--v11-ease) infinite alternate;
}
.button-primary:hover{box-shadow:0 16px 34px rgba(63,59,125,.36);color:#fff}
@keyframes v11Sheen{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@media(prefers-reduced-motion:reduce){.button-primary{animation:none}}

.button-secondary{
  background:var(--v11-card);color:var(--v11-indigo);
  border-color:var(--v11-line);box-shadow:var(--v11-sh-xs);
}
.button-secondary:hover{border-color:var(--v11-indigo);box-shadow:var(--v11-sh-sm)}
.button-ghost{background:transparent;border-color:var(--v11-line);color:var(--v11-ink-2)}
.button-ghost:hover{background:var(--v11-card-alt);color:var(--v11-ink)}
.button-danger{background:linear-gradient(120deg,#E0483C,#B42318);border-color:transparent;box-shadow:0 10px 24px rgba(180,35,24,.25)}
.button-small{min-height:36px;padding:7px 14px;font-size:13px;border-radius:10px}
.button-block{width:100%}

.icon-button{
  background:var(--v11-card);border:1px solid var(--v11-line);
  border-radius:12px;width:42px;height:42px;color:var(--v11-ink-2);
  transition:var(--v11-fast);
}
.icon-button:hover{border-color:var(--v11-indigo);color:var(--v11-indigo);transform:translateY(-1px)}

/* ---------- 4. Cards, panels, surfaces ----------------------------------- */
.panel,.metric-card,.feature-card,.module-card,.media-card,.dependent-card,.document-row,
.invoice-row,.notification-page-row,.event-card,.member-event-card,.public-event-card,
.ticket-card,.booking-card,.family-card,.quick-action,.public-plan-card,.plan-admin-card,
.privacy-request-card,.proof-review-card,.section-card,.kpi-card,.cms-card{
  background:var(--v11-card)!important;
  border:1px solid var(--v11-line)!important;
  border-radius:var(--v11-r)!important;
  box-shadow:var(--v11-sh-sm);
  transition:transform var(--v11-slow),box-shadow var(--v11-slow),border-color var(--v11-slow);
}
.panel{padding:24px;position:relative;overflow:hidden}
.panel::before{
  content:"";position:absolute;left:0;right:0;top:0;height:3px;
  background:var(--v11-gradient);opacity:0;transition:opacity var(--v11-slow);
}
.panel:hover::before{opacity:.9}

.feature-card:hover,.module-card:hover,.media-card:hover,.event-card:hover,
.member-event-card:hover,.public-event-card:hover,.ticket-card:hover,
.booking-card:hover,.family-card:hover,.quick-action:hover,.dependent-card:hover{
  transform:translateY(-4px);
  box-shadow:var(--v11-sh);
  border-color:rgba(63,59,125,.24)!important;
}

.panel-header{align-items:flex-start;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid var(--v11-line-soft)}
.panel-header h2,.form-section h2{font-size:19px;font-weight:800;letter-spacing:-.02em}

/* metric / KPI cards get a personality */
.metric-grid{gap:16px}
.metric-card{padding:22px;position:relative;overflow:hidden}
.metric-card::after{
  content:"";position:absolute;right:-42px;top:-42px;width:120px;height:120px;border-radius:50%;
  background:var(--v11-gradient-soft);transition:transform var(--v11-slow);
}
.metric-card:hover::after{transform:scale(1.35)}
.metric-card>span{color:var(--v11-muted);font-weight:700;font-size:12.5px;text-transform:uppercase;letter-spacing:.07em}
.metric-card strong{
  font-family:var(--v11-display);font-size:36px;font-weight:700;letter-spacing:-.04em;
  margin:10px 0 2px;position:relative;z-index:1;
}
.metric-card small{color:var(--v11-muted)}
.mini-stat-grid>div,.compact-dl>div,.detail-dl>div,.payment-balance div,.event-fact{
  background:var(--v11-card-alt);border:1px solid var(--v11-line-soft);border-radius:14px
}
.mini-stat-grid strong{font-family:var(--v11-display);letter-spacing:-.03em}

/* ---------- 5. Public site ----------------------------------------------- */
.site-header{
  height:auto;background:color-mix(in srgb,var(--v11-card) 88%,transparent);
  backdrop-filter:blur(20px) saturate(1.5);
  -webkit-backdrop-filter:blur(20px) saturate(1.5);
  border-bottom:1px solid var(--v11-line-soft);
  transition:box-shadow var(--v11-slow),background var(--v11-slow);
}
.site-header.is-stuck{box-shadow:0 10px 30px rgba(30,26,72,.10)}
.phase4-public .header-row{min-height:80px}
.phase4-public .public-nav>a:not(.button){
  font-weight:650;color:var(--v11-ink-2);padding:6px 2px;transition:color var(--v11-fast)
}
.phase4-public .public-nav>a:not(.button):hover{color:var(--v11-pink)}
.phase4-public .public-nav>a.active:not(.button):after{
  height:3px;bottom:-10px;background:var(--v11-gradient-warm);border-radius:99px
}
.public-submenu{
  border-radius:16px;border:1px solid var(--v11-line);
  box-shadow:var(--v11-sh);background:var(--v11-card);padding:8px;overflow:hidden
}
.public-submenu a{border-radius:10px;padding:9px 12px;transition:var(--v11-fast)}
.public-submenu a:hover{background:var(--v11-card-alt);color:var(--v11-pink)}

.site-theme-toggle{
  border:1px solid var(--v11-line);background:var(--v11-card);border-radius:99px;
  padding:7px 14px;font-weight:700;font-size:13px;color:var(--v11-ink-2);
  display:inline-flex;align-items:center;gap:7px;transition:var(--v11-fast)
}
.site-theme-toggle:hover{border-color:var(--v11-indigo);color:var(--v11-indigo);transform:translateY(-1px)}

/* hero */
.hero,.cms-hero,.event-hero,.event-list-hero{position:relative;overflow:hidden}
.cms-hero-copy h1,.morya-hero h1 span{
  background:linear-gradient(110deg,var(--v11-indigo) 6%,var(--v11-pink) 78%);
  -webkit-background-clip:text;background-clip:text;color:transparent
}
.hero h1,.cms-hero-copy h1,.event-list-hero h1{font-family:var(--v11-display);font-weight:700}
.eyebrow,.section-heading>span,.plan-type{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 13px;border-radius:99px;
  background:var(--v11-gradient-soft);
  color:var(--v11-indigo);font-size:11.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase
}
html[data-theme="dark"] .eyebrow,html[data-theme="dark"] .section-heading>span{color:#E9C7F5}
.hero-copy{color:var(--v11-muted);font-size:19px}

.section-heading h2,.public-section-heading h2{font-family:var(--v11-display);font-weight:700;font-size:clamp(30px,3.6vw,44px)}
.section{padding:78px 0}

.feature-card{padding:28px}
.feature-icon{
  width:52px;height:52px;border-radius:16px;
  background:var(--v11-gradient);color:#fff;font-size:22px;
  box-shadow:0 10px 22px rgba(63,59,125,.24);
}
.feature-card h3{font-size:20px;font-weight:800;margin:18px 0 8px}

/* plan cards */
.public-plan-card{padding:30px;border-radius:var(--v11-r-lg)!important}
.public-plan-card.featured{
  border-color:transparent!important;
  box-shadow:0 26px 60px rgba(63,59,125,.20);
  background:linear-gradient(var(--v11-card),var(--v11-card)) padding-box,var(--v11-gradient) border-box!important;
  border:2px solid transparent!important;
}
.public-plan-price{font-family:var(--v11-display);font-size:34px;letter-spacing:-.04em}
.featured-ribbon{background:var(--v11-gradient-warm);letter-spacing:.09em}

/* footer */
.site-footer{
  background:linear-gradient(160deg,#1A1730 0%,#2A1B36 55%,#37142B 100%);
  padding:64px 0 34px;position:relative;overflow:hidden
}
.site-footer::before{
  content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--v11-gradient)
}
.site-footer h3{color:#fff;font-size:15px;letter-spacing:.02em;margin-bottom:14px}
.site-footer p,.site-footer .muted-light{color:#B7B2CD}
.site-footer a{color:#DED9EE;transition:var(--v11-fast)}
.site-footer a:hover{color:var(--v11-saffron)}
.footer-links{display:grid;gap:9px}
.footer-bottom{
  margin-top:34px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:#9E99B8;font-size:13px
}
.social-links{display:flex;gap:14px;margin-top:14px;flex-wrap:wrap}

.scroll-to-top{
  position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;
  border:0;background:var(--v11-gradient);color:#fff;font-size:18px;
  box-shadow:0 12px 28px rgba(63,59,125,.35);z-index:60;
  transition:transform var(--v11-fast),opacity var(--v11-fast)
}
.scroll-to-top:hover{transform:translateY(-3px) scale(1.05)}

/* ---------- 6. Auth ------------------------------------------------------ */
.auth-body{
  background:
    radial-gradient(circle at 12% 12%,rgba(44,149,210,.20),transparent 32%),
    radial-gradient(circle at 88% 82%,rgba(214,42,141,.18),transparent 34%),
    linear-gradient(150deg,#FBF9FF,#F3EEF9);
  position:relative;overflow:hidden
}
html[data-theme="dark"] .auth-body{
  background:
    radial-gradient(circle at 12% 12%,rgba(44,149,210,.22),transparent 32%),
    radial-gradient(circle at 88% 82%,rgba(214,42,141,.20),transparent 34%),
    linear-gradient(150deg,#0D0F17,#150F1E)
}
.auth-body::before,.auth-body::after{
  content:"";position:absolute;border-radius:50%;
  border:1px solid rgba(63,59,125,.09);pointer-events:none
}
.auth-body::before{width:620px;height:620px;left:-190px;bottom:-230px}
.auth-body::after{width:420px;height:420px;right:-140px;top:-150px;border-color:rgba(214,42,141,.10)}
.auth-card{
  background:color-mix(in srgb,var(--v11-card) 92%,transparent);
  backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  border:1px solid var(--v11-line);border-radius:var(--v11-r-xl);
  padding:38px;box-shadow:var(--v11-sh-lg);
  animation:v11Rise .5s var(--v11-ease) both
}
.auth-heading h1{font-family:var(--v11-display);font-size:32px;font-weight:700}
.auth-heading p{color:var(--v11-muted)}
@keyframes v11Rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* ---------- 7. Forms ----------------------------------------------------- */
input,select,textarea{
  border-radius:13px!important;
  border:1px solid var(--v11-line)!important;
  background:var(--v11-card)!important;
  color:var(--v11-ink)!important;
  min-height:46px;
  padding:11px 14px;
  transition:border-color var(--v11-fast),box-shadow var(--v11-fast),background var(--v11-fast)
}
textarea{min-height:110px;line-height:1.6}
input::placeholder,textarea::placeholder{color:var(--v11-muted);opacity:.8}
input:hover,select:hover,textarea:hover{border-color:rgba(63,59,125,.3)!important}
input:focus,select:focus,textarea:focus{
  border-color:var(--v11-indigo)!important;
  box-shadow:var(--v11-ring)!important;
  outline:none
}
input[type=checkbox],input[type=radio]{min-height:auto;accent-color:var(--v11-pink);width:18px;height:18px}
input[type=color]{padding:3px!important;min-height:46px}
label,.label-title{font-weight:700;color:var(--v11-ink-2);font-size:13.5px;letter-spacing:.005em}
.form-stack{gap:18px}
.form-panel{padding:28px}
.form-section{border-bottom:1px solid var(--v11-line-soft);padding-bottom:26px;margin-bottom:26px}
.check-card,.permission-row,.switch-row,.checkbox-row{
  border:1px solid var(--v11-line)!important;border-radius:14px!important;
  background:var(--v11-card)!important;padding:14px!important;transition:var(--v11-fast)
}
.check-card:hover,.permission-row:hover,.switch-row:hover{border-color:rgba(63,59,125,.32)!important;background:var(--v11-card-alt)!important}
.filter-bar{
  background:var(--v11-card);border:1px solid var(--v11-line);
  border-radius:var(--v11-r);padding:16px;box-shadow:var(--v11-sh-xs);align-items:end
}
.form-actions{gap:12px}

/* ---------- 8. Tables ---------------------------------------------------- */
.table-wrap{
  border:1px solid var(--v11-line);border-radius:var(--v11-r);
  background:var(--v11-card);box-shadow:var(--v11-sh-xs);overflow:auto
}
table{background:transparent}
th{
  background:var(--v11-card-alt)!important;color:var(--v11-muted)!important;
  font-size:11.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  padding:14px 16px;border-bottom:1px solid var(--v11-line)
}
td{padding:15px 16px;border-bottom:1px solid var(--v11-line-soft);color:var(--v11-ink-2)}
td strong{color:var(--v11-ink)}
tbody tr{transition:background var(--v11-fast)}
tbody tr:hover{background:var(--v11-card-alt)}
.table-action{color:var(--v11-indigo);font-weight:750}
html[data-theme="dark"] .table-action{color:#B7A6F0}
.pagination{padding-top:18px;color:var(--v11-muted)}

/* ---------- 9. Status pills / tags --------------------------------------- */
.status,.tag{
  padding:5px 12px;border-radius:99px;font-size:11px;font-weight:800;
  letter-spacing:.03em;border:1px solid transparent
}
.status-active,.status-approved,.status-paid,.status-completed,.status-verified,.status-confirmed,.status-issued,.status-accepted{
  background:rgba(6,118,71,.10);color:#067647;border-color:rgba(6,118,71,.2)
}
.status-pending,.status-draft,.status-grace,.status-unpaid,.status-processing,.status-requested,.status-waitlisted,.status-duplicate{
  background:rgba(181,71,8,.10);color:#B54708;border-color:rgba(181,71,8,.2)
}
.status-rejected,.status-cancelled,.status-expired,.status-failed,.status-overdue,.status-banned,.status-void,.status-suspended{
  background:rgba(180,35,24,.10);color:#B42318;border-color:rgba(180,35,24,.2)
}
.status-info,.status-submitted,.status-under-review,.status-published,.status-refunded,.status-checked_in{
  background:rgba(23,92,211,.10);color:#175CD3;border-color:rgba(23,92,211,.2)
}
.tag{background:var(--v11-gradient-soft);color:var(--v11-indigo);border-color:var(--v11-line)}
html[data-theme="dark"] .status{filter:brightness(1.5)}

/* ---------- 10. Flash + alerts ------------------------------------------- */
.flash{
  border-radius:15px;padding:15px 18px;border-width:1px;font-weight:600;
  display:flex;gap:11px;align-items:flex-start;box-shadow:var(--v11-sh-xs);
  animation:v11Rise .35s var(--v11-ease) both
}
.flash::before{font-weight:900;font-size:15px;line-height:1.4}
.flash-success::before{content:"✓"}
.flash-error::before{content:"!"}
.flash-warning::before{content:"⚠"}
.note-box,.notice-box{border-radius:15px;border:1px solid var(--v11-line);background:var(--v11-card-alt)}

/* ---------- 11. Admin shell ---------------------------------------------- */
.sidebar{
  background:linear-gradient(175deg,#221F4B 0%,#2F2258 42%,#301A33 100%);
  padding:20px 14px;border-right:1px solid rgba(255,255,255,.06)
}
.member-sidebar{background:linear-gradient(175deg,#232156 0%,#452866 55%,#2C1832 100%)}
.sidebar::after,.member-sidebar::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(circle at 80% 8%,rgba(214,42,141,.22),transparent 42%);
}
.sidebar>*,.member-sidebar>*{position:relative;z-index:1}
.sidebar-nav a,.member-nav a{
  border-radius:12px;padding:11px 13px;color:rgba(255,255,255,.74);
  font-weight:650;font-size:14px;position:relative;
  transition:background var(--v11-fast),color var(--v11-fast),transform var(--v11-fast)
}
.sidebar-nav a:hover,.member-nav a:hover{background:rgba(255,255,255,.09);color:#fff;transform:translateX(3px)}
.sidebar-nav a.active,.member-nav a.active{
  background:var(--v11-gradient);color:#fff;
  box-shadow:0 10px 24px rgba(214,42,141,.28)
}
.sidebar-nav a.active span,.member-nav a.active>span{color:#fff}
.nav-label{color:rgba(255,255,255,.42);font-size:10px;letter-spacing:.16em;padding:22px 13px 7px}
.nav-count{background:var(--v11-saffron);color:#fff;font-weight:800}

.admin-topbar,.member-topbar{
  height:74px;
  background:color-mix(in srgb,var(--v11-card) 86%,transparent);
  backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);
  border-bottom:1px solid var(--v11-line-soft);padding:0 26px
}
.admin-content,.member-content{padding:30px}
.page-header,.member-page-head{margin-bottom:26px}
.page-header h1,.member-page-head h1{font-size:clamp(26px,3vw,34px)}
.page-header p,.member-page-head p{color:var(--v11-muted)}

.avatar{
  background:var(--v11-gradient);color:#fff;border-radius:13px;
  font-weight:800;box-shadow:0 6px 16px rgba(63,59,125,.24)
}
.user-chip{gap:10px}
.environment-badge{background:var(--v11-gradient-soft);color:var(--v11-indigo);border-radius:99px;font-weight:800}
.locale-switch{background:var(--v11-card-alt);border:1px solid var(--v11-line);border-radius:11px;padding:4px}
.locale-switch a{border-radius:8px;padding:6px 9px;transition:var(--v11-fast)}
.locale-switch a:hover{background:var(--v11-card);color:var(--v11-indigo)}

/* member hero / alert */
.member-alert,.member-admin-hero{
  border-radius:var(--v11-r-lg);position:relative;overflow:hidden;
  background:var(--v11-gradient);color:#fff;border:0;
  box-shadow:0 22px 54px rgba(63,59,125,.26);padding:30px
}
.member-alert::after,.member-admin-hero::after{
  content:"";position:absolute;right:-70px;top:-90px;width:280px;height:280px;
  border-radius:50%;background:rgba(255,255,255,.10)
}
.member-alert>span{color:rgba(255,255,255,.85);background:rgba(255,255,255,.14);border-radius:99px;padding:5px 12px;display:inline-block}
.member-alert h2{color:#fff;font-family:var(--v11-display);font-size:29px;margin:14px 0 8px}
.member-alert p,.member-admin-hero p{color:rgba(255,255,255,.9)}
.member-alert .button-secondary{background:#fff;color:var(--v11-indigo);border-color:transparent}

.quick-action{padding:20px}
.quick-action>span{
  width:44px;height:44px;border-radius:14px;
  background:var(--v11-gradient-soft);color:var(--v11-indigo);font-size:20px
}
.quick-action:hover>span{background:var(--v11-gradient);color:#fff}

/* member digital card */
.digital-member-card{
  border-radius:var(--v11-r-xl);
  background:linear-gradient(135deg,#2C95D2 0%,#3F3B7D 32%,#73358E 62%,#D62A8D 100%);
  box-shadow:0 32px 80px rgba(63,59,125,.36)
}
.digital-member-card .card-avatar{border:2px solid rgba(255,255,255,.28)}
.card-qr,.digital-card-qr{box-shadow:0 10px 26px rgba(0,0,0,.2)}

/* ---------- 12. Events / tickets ----------------------------------------- */
.event-card-media,.member-event-cover{position:relative}
.event-card-media::after,.member-event-cover::after{
  content:"";position:absolute;inset:auto 0 0 0;height:56%;
  background:linear-gradient(180deg,transparent,rgba(20,15,35,.42));pointer-events:none
}
.event-card-media img,.member-event-cover>img,.public-event-card .event-card-media img{
  transition:transform .6s var(--v11-ease)
}
.event-card:hover .event-card-media img,.public-event-card:hover .event-card-media img,
.member-event-card:hover .member-event-cover>img{transform:scale(1.06)}
.event-card h3,.public-event-card h2,.member-event-body h2{font-family:var(--v11-display);font-weight:700}
.event-category-pill{border-radius:99px;font-weight:800;box-shadow:0 6px 16px rgba(0,0,0,.18)}
.capacity-meter{height:9px;background:var(--v11-line-soft)}
.capacity-meter span{background:var(--v11-gradient-warm)}
.ticket-option,.member-ticket-choice{
  border:1px solid var(--v11-line);border-radius:16px;background:var(--v11-card);
  transition:var(--v11-fast)
}
.ticket-option:hover,.member-ticket-choice:hover{border-color:var(--v11-pink);box-shadow:var(--v11-sh-sm)}
.event-ticket-shell{border-radius:var(--v11-r-lg);box-shadow:var(--v11-sh-lg)}
.event-booking-panel .panel{position:sticky;top:96px}

/* timelines */
.timeline article:before,.timeline-entry>span{background:var(--v11-gradient);box-shadow:0 0 0 5px rgba(63,59,125,.12)}

/* ---------- 13. Empty states, misc --------------------------------------- */
.empty-state,.empty-state-card{
  padding:52px 24px;color:var(--v11-muted);text-align:center;
  border:1px dashed var(--v11-line);border-radius:var(--v11-r);background:var(--v11-card-alt)
}
.empty-state-icon{background:var(--v11-gradient-soft);border-radius:20px}
.error-page>span{
  font-family:var(--v11-display);font-size:104px;
  background:var(--v11-gradient);-webkit-background-clip:text;background-clip:text;color:transparent
}
.media-preview{background:var(--v11-card-alt)}
.date-chip{background:var(--v11-gradient-soft);color:var(--v11-indigo);border-radius:12px}
.member-admin-tabs{
  background:var(--v11-card);border:1px solid var(--v11-line);border-radius:14px;padding:6px
}
.member-admin-tabs a:hover{background:var(--v11-gradient-soft);color:var(--v11-indigo)}
.module-card.enabled{border-color:rgba(6,118,71,.3)!important}
.module-number{border-radius:14px;background:var(--v11-gradient-soft);color:var(--v11-indigo)}

/* ---------- 14. Motion --------------------------------------------------- */
[data-v11-reveal]{opacity:0;transform:translateY(18px)}
[data-v11-reveal].is-visible{opacity:1;transform:none;transition:opacity .6s var(--v11-ease),transform .6s var(--v11-ease)}
@media(prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;transition-duration:.01ms!important}
  [data-v11-reveal]{opacity:1;transform:none}
}

/* ---------- 15. Responsive polish ---------------------------------------- */
@media(max-width:980px){
  .admin-content,.member-content{padding:18px}
  .admin-topbar,.member-topbar{height:66px;padding:0 16px}
  .panel{padding:19px}
  .section{padding:54px 0}
}
@media(max-width:680px){
  body{font-size:15px}
  .button{min-height:46px;width:auto}
  .page-header .button,.member-page-head .button{width:100%}
  .metric-card strong{font-size:29px}
  .auth-card{padding:26px;border-radius:26px}
  .site-footer{padding:44px 0 26px}
  .scroll-to-top{right:14px;bottom:14px}
}

/* ---------- 16. Print ---------------------------------------------------- */
@media print{
  .panel,.metric-card{box-shadow:none!important}
  .scroll-to-top{display:none!important}
}