/*
  SUCCESS EMPIRE COMPANY
  Shared Structure & Premium UI Style
  Final frontend shared asset
  ------------------------------------------------------------
  Purpose:
  - One consistent premium maroon/gold visual system
  - Owner + Member scope support
  - Moving page sweep + moving border/orbit light
  - Professional custom select/calendar/time-picker UI
  - Shared status, modal, toast and accessibility helpers
  - Non-destructive: existing page-specific CSS remains authoritative
*/

:root{
  --sec-bg:#070004;
  --sec-deep:#100008;
  --sec-panel:#18000e;
  --sec-panel-2:#250013;
  --sec-wine:#3d0018;
  --sec-wine-2:#5d0021;
  --sec-wine-3:#79002b;
  --sec-pink:#d90f5a;
  --sec-pink-soft:#ef6fa9;
  --sec-gold:#d9a43a;
  --sec-gold-2:#f1c65e;
  --sec-gold-3:#ffe89c;
  --sec-text:#fffaf5;
  --sec-soft:#dacbd1;
  --sec-muted:#a7969d;
  --sec-green:#63d28d;
  --sec-amber:#f0ad3c;
  --sec-red:#ef6673;
  --sec-violet:#9e6cdd;
  --sec-radius:13px;
  --sec-shadow:0 12px 32px rgba(0,0,0,.34);
  --sec-focus:0 0 0 2px rgba(241,198,94,.18),0 0 18px rgba(217,164,58,.13);
}

/* Scope is added automatically by success-empire-structure-style.js. */
body.sec-success-empire{
  color-scheme:dark;
  accent-color:var(--sec-gold-2);
}
body.sec-owner-scope{
  --sec-scope-accent:#d90f5a;
  --sec-scope-deep:#3d0018;
}
body.sec-member-scope{
  --sec-scope-accent:#e32673;
  --sec-scope-deep:#410021;
}

/* ------------------------------------------------------------
   PAGE-WIDE MOVING LIGHT
------------------------------------------------------------ */
body.sec-success-empire .app,
body.sec-success-empire [data-sec-page-root]{
  position:relative;
  isolation:isolate;
}
body.sec-success-empire .app::before,
body.sec-success-empire [data-sec-page-root]::before{
  content:"";
  position:absolute;
  z-index:0;
  top:-35%;
  left:-90%;
  width:28%;
  height:220%;
  pointer-events:none;
  transform:rotate(13deg);
  background:linear-gradient(
    90deg,
    transparent,
    rgba(255,239,187,.035),
    rgba(255,224,121,.23),
    rgba(217,15,90,.10),
    transparent
  );
  filter:blur(7px);
  animation:sec-page-sweep 7.4s ease-in-out infinite;
}
@keyframes sec-page-sweep{
  0%{left:-90%;opacity:0}
  20%{opacity:.90}
  100%{left:150%;opacity:0}
}

/* ------------------------------------------------------------
   MOVING BORDER / ORBIT LIGHT
   JS adds .sec-light-host + span.sec-orbit-light.
------------------------------------------------------------ */
@property --sec-orbit-angle{
  syntax:"<angle>";
  inherits:false;
  initial-value:0deg;
}
.sec-light-host{
  position:relative !important;
  isolation:isolate !important;
  overflow:hidden !important;
}
.sec-light-host > .sec-orbit-light{
  position:absolute !important;
  z-index:8 !important;
  inset:-1px !important;
  display:block !important;
  pointer-events:none !important;
  border-radius:inherit !important;
  padding:1px !important;
  background:conic-gradient(
    from var(--sec-orbit-angle),
    transparent 0deg 269deg,
    rgba(217,164,58,.10) 278deg,
    rgba(244,204,105,.58) 290deg,
    rgba(255,239,177,1) 303deg,
    rgba(217,15,90,.92) 315deg,
    rgba(244,204,105,.62) 329deg,
    transparent 345deg 360deg
  ) !important;
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0) !important;
  -webkit-mask-composite:xor !important;
  mask-composite:exclude !important;
  animation:sec-orbit 4.7s linear infinite !important;
  filter:
    drop-shadow(0 0 2px rgba(255,233,161,.70))
    drop-shadow(0 0 5px rgba(217,15,90,.22)) !important;
}
@keyframes sec-orbit{to{--sec-orbit-angle:360deg}}
.sec-light-host > :not(.sec-orbit-light){position:relative;z-index:2}

/* ------------------------------------------------------------
   SHARED PROFESSIONAL CONTROL SURFACE
------------------------------------------------------------ */
.sec-control,
.sec-field,
.sec-select-trigger,
.sec-date-trigger,
.sec-time-trigger{
  width:100%;
  min-height:44px;
  border:1px solid rgba(217,164,58,.34);
  border-radius:10px;
  color:var(--sec-text);
  background:linear-gradient(145deg,#240013,#12000b);
  outline:0;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.sec-control:focus,
.sec-field:focus,
.sec-select-trigger:focus-visible,
.sec-date-trigger:focus-visible,
.sec-time-trigger:focus-visible{
  border-color:var(--sec-gold-2);
  box-shadow:var(--sec-focus);
}
.sec-control[disabled],
.sec-field[disabled],
.sec-select-trigger[disabled],
.sec-date-trigger[disabled],
.sec-time-trigger[disabled]{
  cursor:not-allowed;
  opacity:.48;
}

/* Hide enhanced native controls but keep them available to JS/forms. */
.sec-native-hidden{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  margin:-1px !important;
  padding:0 !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  white-space:nowrap !important;
  border:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.sec-select-shell,
.sec-date-shell,
.sec-time-shell{
  position:relative;
  width:100%;
}
.sec-select-trigger,
.sec-date-trigger,
.sec-time-trigger{
  padding:0 13px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:9px;
  align-items:center;
  text-align:left;
  cursor:pointer;
}
.sec-select-trigger .sec-control-main,
.sec-date-trigger .sec-control-main,
.sec-time-trigger .sec-control-main{
  min-width:0;
}
.sec-control-label{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:800;
  font-size:12px;
}
.sec-control-sub{
  display:block;
  margin-top:2px;
  color:var(--sec-muted);
  font-size:9px;
}
.sec-control-arrow{
  color:var(--sec-gold-2);
  font-size:14px;
  transition:transform .18s ease;
}
.sec-select-shell.open .sec-control-arrow{transform:rotate(180deg)}

.sec-select-menu{
  position:absolute;
  z-index:2600;
  top:calc(100% + 7px);
  left:0;
  right:0;
  display:none;
  max-height:280px;
  overflow:auto;
  padding:6px;
  border:1px solid rgba(241,198,94,.48);
  border-radius:12px;
  background:linear-gradient(160deg,#42001b,#16000d);
  box-shadow:0 18px 50px rgba(0,0,0,.58);
  backdrop-filter:blur(10px);
}
.sec-select-shell.open .sec-select-menu{display:grid;gap:5px}
.sec-select-option{
  width:100%;
  min-height:40px;
  padding:7px 10px;
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  gap:7px;
  align-items:center;
  border:1px solid rgba(217,164,58,.13);
  border-radius:9px;
  color:#eadde2;
  background:#17000d;
  text-align:left;
  cursor:pointer;
}
.sec-select-option:hover,
.sec-select-option:focus-visible{
  border-color:rgba(241,198,94,.45);
  background:#2e0017;
  outline:0;
}
.sec-select-option.active{
  color:var(--sec-gold-3);
  border-color:rgba(241,198,94,.60);
  background:linear-gradient(145deg,#5b0022,#2d0016);
}
.sec-select-option .sec-option-icon{font-size:16px;text-align:center}
.sec-select-option .sec-option-text{font-size:11px;font-weight:800}
.sec-select-option .sec-option-check{color:var(--sec-gold-2);font-size:13px}

/* ------------------------------------------------------------
   CUSTOM CALENDAR / TIME PICKER
------------------------------------------------------------ */
.sec-picker-overlay{
  position:fixed;
  z-index:9000;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  padding:14px;
  background:rgba(5,0,4,.84);
  backdrop-filter:blur(8px);
}
.sec-picker-overlay.show{display:flex}
.sec-picker{
  width:min(420px,100%);
  max-height:min(88svh,720px);
  overflow:auto;
  border:1px solid rgba(241,198,94,.65);
  border-radius:17px;
  background:
    radial-gradient(circle at 100% 0%,rgba(217,15,90,.13),transparent 32%),
    linear-gradient(160deg,#4b001c,#16000d 65%,#0e0008);
  box-shadow:0 26px 80px rgba(0,0,0,.72);
}
.sec-picker-head{
  padding:13px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border-bottom:1px solid rgba(217,164,58,.22);
}
.sec-picker-title{
  color:var(--sec-gold-2);
  font:900 15px Georgia,serif;
}
.sec-picker-close{
  width:36px;
  height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(217,164,58,.42);
  border-radius:50%;
  color:var(--sec-gold-2);
  background:#240013;
  cursor:pointer;
}
.sec-calendar-nav{
  padding:10px 13px 6px;
  display:grid;
  grid-template-columns:38px minmax(0,1fr) 38px;
  gap:8px;
  align-items:center;
}
.sec-calendar-nav button{
  width:38px;
  height:38px;
  border:1px solid rgba(217,164,58,.30);
  border-radius:10px;
  color:var(--sec-gold-2);
  background:#250014;
  cursor:pointer;
}
.sec-calendar-month{
  text-align:center;
  color:#fff4df;
  font-weight:900;
  font-size:13px;
}
.sec-calendar-week,
.sec-calendar-grid{
  margin:0 13px;
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:4px;
}
.sec-calendar-week{margin-top:6px}
.sec-calendar-week span{
  min-height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#bcaab2;
  font-size:9px;
  font-weight:900;
}
.sec-calendar-day{
  aspect-ratio:1/1;
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid transparent;
  border-radius:10px;
  color:#eee2e6;
  background:transparent;
  font-size:11px;
  font-weight:800;
  cursor:pointer;
}
.sec-calendar-day:hover,
.sec-calendar-day:focus-visible{
  outline:0;
  border-color:rgba(217,164,58,.38);
  background:#2c0016;
}
.sec-calendar-day.today{border-color:rgba(217,164,58,.40);color:var(--sec-gold-2)}
.sec-calendar-day.selected{
  color:#2b0014;
  border-color:#ffe89c;
  background:linear-gradient(#ffe79b,#d7a036);
  box-shadow:0 0 18px rgba(241,198,94,.18);
}
.sec-calendar-day.muted{opacity:.25;pointer-events:none}
.sec-picker-actions{
  padding:12px 13px 14px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:7px;
}
.sec-picker-actions button{
  min-height:40px;
  border:1px solid rgba(217,164,58,.30);
  border-radius:9px;
  color:var(--sec-gold-2);
  background:#290015;
  font-size:10px;
  font-weight:900;
  cursor:pointer;
}
.sec-picker-actions button.primary{
  color:#2b0014;
  border-color:#ffe89c;
  background:linear-gradient(#ffe79b,#d7a036);
}

.sec-time-grid{
  padding:14px;
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:8px;
}
.sec-time-column{
  min-width:0;
  padding:7px;
  border:1px solid rgba(217,164,58,.20);
  border-radius:11px;
  background:#15000c;
}
.sec-time-column strong{
  display:block;
  margin-bottom:6px;
  color:var(--sec-gold-2);
  text-align:center;
  font-size:9px;
}
.sec-time-scroll{
  max-height:230px;
  overflow:auto;
  display:grid;
  gap:4px;
}
.sec-time-option{
  min-height:36px;
  border:1px solid rgba(217,164,58,.14);
  border-radius:8px;
  color:#e7d9de;
  background:#210011;
  cursor:pointer;
}
.sec-time-option.active{
  color:#2b0014;
  border-color:#ffe89c;
  background:linear-gradient(#ffe79b,#d7a036);
  font-weight:900;
}

/* ------------------------------------------------------------
   STATUS / BADGES / TOAST
------------------------------------------------------------ */
.sec-status{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:24px;
  padding:3px 8px;
  border:1px solid rgba(217,164,58,.25);
  border-radius:999px;
  font-size:9px;
  font-weight:900;
}
.sec-status.pending{color:#ffc55e;border-color:rgba(240,173,60,.36);background:rgba(92,61,14,.33)}
.sec-status.approved,.sec-status.verified,.sec-status.active{color:#9be4b5;border-color:rgba(99,210,141,.36);background:rgba(31,101,59,.20)}
.sec-status.rejected,.sec-status.failed,.sec-status.inactive{color:#ff9aa4;border-color:rgba(239,102,115,.36);background:rgba(110,27,39,.20)}
.sec-status.info{color:#d8c4ff;border-color:rgba(158,108,221,.38);background:rgba(75,49,108,.22)}

.sec-toast-stack{
  position:fixed;
  z-index:10000;
  left:50%;
  bottom:74px;
  width:min(430px,calc(100% - 24px));
  transform:translateX(-50%);
  display:grid;
  gap:7px;
  pointer-events:none;
}
.sec-toast{
  padding:10px 12px;
  border:1px solid rgba(217,164,58,.45);
  border-radius:11px;
  color:#fff;
  background:linear-gradient(145deg,#350018,#19000e);
  box-shadow:0 14px 40px rgba(0,0,0,.48);
  opacity:0;
  transform:translateY(12px);
  animation:sec-toast-in .20s ease forwards;
  font-size:11px;
  line-height:1.4;
  text-align:center;
}
@keyframes sec-toast-in{to{opacity:1;transform:translateY(0)}}

/* Shared scrollbars where supported. */
.sec-select-menu,
.sec-picker,
.sec-time-scroll{
  scrollbar-width:thin;
  scrollbar-color:rgba(217,164,58,.58) rgba(20,0,12,.80);
}
.sec-select-menu::-webkit-scrollbar,
.sec-picker::-webkit-scrollbar,
.sec-time-scroll::-webkit-scrollbar{width:6px;height:6px}
.sec-select-menu::-webkit-scrollbar-thumb,
.sec-picker::-webkit-scrollbar-thumb,
.sec-time-scroll::-webkit-scrollbar-thumb{background:rgba(217,164,58,.55);border-radius:20px}

/* Accessibility helper. */
.sec-sr-only{
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0,0,0,0) !important;
  white-space:nowrap !important;
  border:0 !important;
}

@media(max-width:360px){
  .sec-light-host > .sec-orbit-light{animation-duration:5.3s !important}
  .sec-picker-actions{grid-template-columns:1fr}
  .sec-time-grid{gap:5px;padding:10px}
}
@media(prefers-reduced-motion:reduce){
  body.sec-success-empire .app::before,
  body.sec-success-empire [data-sec-page-root]::before,
  .sec-light-host > .sec-orbit-light{animation:none !important}
}

/* Premium numeric treatment — visual only, no layout resizing */
.stat b,.metric-card b,.wallet-mini-card b,.summary-card b,.amount-value,.kpi-value{font-variant-numeric:tabular-nums;font-family:Georgia,"Times New Roman",serif;font-weight:900;letter-spacing:.15px;text-shadow:0 0 9px rgba(242,201,96,.14)}

/* FINAL PREMIUM NUMERIC TYPOGRAPHY — no layout resizing */
.sec-premium-number{font-family:Georgia,"Times New Roman",serif!important;font-weight:900!important;font-variant-numeric:tabular-nums lining-nums!important;letter-spacing:.01em;text-shadow:0 1px 5px rgba(217,164,58,.18)}

.sec-owner-identity-strip{width:min(100%,520px);margin:7px auto 0;padding:6px 9px;display:flex;align-items:center;gap:7px;border:1px solid rgba(217,164,58,.28);border-radius:10px;background:linear-gradient(145deg,rgba(75,0,29,.78),rgba(25,0,14,.82));box-shadow:0 5px 14px rgba(0,0,0,.16)}.sec-owner-identity-strip>span{width:28px;height:28px;display:grid;place-items:center;border:1px solid rgba(217,164,58,.32);border-radius:8px;background:#4a001d;font-size:14px}.sec-owner-identity-strip b{display:block;color:#f1c65e;font:900 7px Georgia,"Times New Roman",serif}.sec-owner-identity-strip small{display:block;margin-top:2px;color:#b7a6ae;font-size:4.7px;font-weight:700}