/* ============================================================================
   SolarAMC PLATFORM — SHARED UI LIBRARY (single source of truth)
   Consumed by BOTH index.html (console) and viewer.html (model dashboard).
   RULE (owner, 2026-07-04): any GLOBAL look change is made HERE, once,
   and lands on every page and console. Page files keep only page-specific CSS.
   Owner consent is required before adding/changing global styles.
   ========================================================================== */

/* ---- 1. Design tokens ---- */
:root{
  --samc-canvas-grad: linear-gradient(135deg,#0a1330,#1d0f3d,#14295a,#2c0f47,#081a38);
  --samc-banner-grad: linear-gradient(120deg,#152150 0%,#31205e 30%,#23407e 60%,#43206b 100%);
  --samc-banner-fade: linear-gradient(180deg,rgba(10,19,48,0) 40%,rgba(10,19,48,.55) 78%,rgba(10,19,48,.95) 100%);
  --samc-ring-grad: conic-gradient(from var(--a),#5d9bff,#7a55d4,#8df5cf,#5d9bff);
  --samc-green:#22C58B; --samc-green-2:#2ee0a4;
  --samc-blue:#5d9bff;  --samc-violet:#7a55d4; --samc-mint:#8df5cf;
  --samc-ink:#e6ebf8;   --samc-ink-soft:#a3aed2;
}

/* ---- 2. Shared animations ---- */
@property --a{syntax:"<angle>";initial-value:0deg;inherits:false}
@keyframes ringspin{to{--a:360deg}}
@keyframes dotOrbit{from{transform:rotate(0deg) translate(21px)}to{transform:rotate(360deg) translate(21px)}}
@keyframes gradShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
@keyframes floaty{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(18px,-26px) scale(1.06)}}
@keyframes floaty2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-22px,20px) scale(.94)}}
@keyframes softPulse{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes brandInk{0%{background-position:0% 0}100%{background-position:-300% 0}}

/* ---- 3. Page canvas (all consoles + dashboard) ---- */
body{background:var(--samc-canvas-grad);background-size:300% 300%;animation:gradShift 30s ease infinite;background-attachment:fixed}

/* ---- 4. Living-ink brand logo ---- */
.brandink{width:150px;height:32px;flex:none;
  -webkit-mask:url("https://cdn.prod.website-files.com/68241a3325125df818868975/6826e41c52f737917a104e00_logo%203x.avif") no-repeat left center/contain;
  mask:url("https://cdn.prod.website-files.com/68241a3325125df818868975/6826e41c52f737917a104e00_logo%203x.avif") no-repeat left center/contain;
  background:linear-gradient(115deg,#ffffff 0%,#5d9bff 22%,#7a55d4 42%,#ffffff 58%,#8df5cf 78%,#ffffff 100%);
  background-size:300% 100%;animation:brandInk 22s linear infinite}

/* ---- 5. Identity chip (collapsed avatar → hover expands) ---- */
.idchip{display:inline-flex;align-items:center;gap:0;border-radius:32px;padding:5px;backdrop-filter:blur(10px);cursor:default;
  background:linear-gradient(rgba(20,27,62,.92),rgba(20,27,62,.92)) padding-box,var(--samc-ring-grad) border-box;
  border:1.5px solid transparent;box-shadow:0 8px 28px rgba(50,50,150,.35);animation:ringspin 6s linear infinite;
  transition:box-shadow .8s ease,padding 1.5s cubic-bezier(.3,.9,.3,1)}
.idchip:hover{box-shadow:0 10px 34px rgba(70,80,190,.5);padding-right:22px}
.idchip .idtxt{max-width:0;opacity:0;overflow:hidden;white-space:nowrap;margin-left:0;display:flex;flex-direction:column;line-height:1.55;gap:1px;
  transition:max-width 1.6s cubic-bezier(.3,.9,.3,1),opacity 1s ease,margin-left 1.5s cubic-bezier(.3,.9,.3,1)}
.idchip:hover .idtxt{max-width:222px;opacity:1;margin-left:12px;
  transition:max-width 1.6s cubic-bezier(.3,.9,.3,1),opacity 1.1s ease .4s,margin-left 1.5s cubic-bezier(.3,.9,.3,1)}
.idtxt b{font-size:14.5px;color:#fff;letter-spacing:.2px}
.idtxt small{display:flex;align-items:center;gap:6px;font-size:10px;color:#9fb0da;font-weight:700}
.idava{position:relative;width:43px;height:43px;border-radius:50%;border:2px solid transparent;
  background:linear-gradient(135deg,#1d3a7e,#3d2a78) padding-box,linear-gradient(135deg,#5d9bff,#8df5cf) border-box;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:14px;color:#fff;letter-spacing:.5px;flex:none;
  box-shadow:0 0 16px rgba(93,155,255,.3)}
.idava:after{content:"";position:absolute;left:50%;top:50%;margin:-6px 0 0 -6px;width:12px;height:12px;border-radius:50%;
  background:var(--samc-green);border:none;box-shadow:0 0 10px rgba(34,197,139,.9);
  transform:rotate(0deg) translate(21px);animation:dotOrbit 40s linear infinite;will-change:transform}
.roletag{font-size:8.5px;font-weight:800;letter-spacing:.9px;padding:2.5px 9px;border-radius:8px;
  background:rgba(122,85,212,.24);color:#c9b8f5;border:1px solid rgba(150,120,240,.35);line-height:1.4}
.rt-adm{background:rgba(80,140,255,.22);color:#aecaff;border-color:rgba(90,150,255,.4)}
.rt-cli{background:rgba(34,197,139,.18);color:#8de8c0;border-color:rgba(34,197,139,.35)}
.rt-sup{background:rgba(240,200,110,.18);color:#f0d492;border-color:rgba(240,200,110,.4)}
.idnum{color:#8fa0c8;font-size:10px;font-weight:700;letter-spacing:1px}

/* ---- 6b. ICON VISIBILITY (owner rule, 2026-07-06) ----
   Some emoji render as DARK glyphs (👤 🏢 …) and vanish on dark buttons/backgrounds.
   Wrap such an icon in <span class="wic">…</span> to recolour it into the theme's
   soft light blue. Use wherever an icon is not clearly visible against its background. */
.wic{filter:brightness(0) saturate(100%) invert(60%) sepia(70%) saturate(1400%) hue-rotate(115deg) brightness(97%)}  /* owner choice: brand GREEN */

/* ---- 6a. TABLE ALIGNMENT CONVENTION (owner rule, 2026-07-06) ----
   Columns whose values VARY in string length (names, emails, addresses, details)
   are LEFT-aligned; everything else (IDs, numbers, phones, statuses, dates,
   counts, links, actions) is CENTER-aligned. Console tables only — the proposal
   dashboard (viewer) formatting is never touched. */
/* BD Partners: center CAN, Partner ID, Phone, Status, Registered, Action */
#ptable td:nth-child(2),#ptable th:nth-child(2),#ptable td:nth-child(3),#ptable th:nth-child(3),
#ptable td:nth-child(4),#ptable th:nth-child(4),#ptable td:nth-child(6),#ptable th:nth-child(6),
#ptable td:nth-child(7),#ptable th:nth-child(7),#ptable td:nth-child(8),#ptable th:nth-child(8){text-align:center}
/* Approvals: center Status, Action; Details wraps */
#vtable td:nth-child(4),#vtable th:nth-child(4),#vtable td:nth-child(5),#vtable th:nth-child(5){text-align:center}
#vtable td:nth-child(3){white-space:normal;word-break:break-word;max-width:420px;line-height:1.5}
/* Clients list: center GST, CIN, PN, Login ID, Login, Sign-in Link, Projects, Action(last) */
#cotable td:nth-child(2),#cotable th:nth-child(2),#cotable td:nth-child(3),#cotable th:nth-child(3),
#cotable td:nth-child(4),#cotable th:nth-child(4),#cotable td:nth-child(5),#cotable th:nth-child(5),
#cotable td:nth-child(7),#cotable th:nth-child(7),#cotable td:nth-child(8),#cotable th:nth-child(8),
#cotable td:nth-child(9),#cotable th:nth-child(9),#cotable td:last-child,#cotable th:last-child{text-align:center}
/* Proposals: everything centered except the client name */
#ctable td:not(:first-child),#ctable th:not(:first-child){text-align:center}
/* Document Types (Approvals sub-tab): category name left; E-sign toggle + Action centered */
#dctable td:nth-child(2),#dctable th:nth-child(2),#dctable td:nth-child(3),#dctable th:nth-child(3){text-align:center}
/* Documents centre: Document / Type / Owner left (variable); Category, Size, Uploaded, Action centered */
#doctable td:nth-child(4),#doctable th:nth-child(4),#doctable td:nth-child(5),#doctable th:nth-child(5),
#doctable td:nth-child(6),#doctable th:nth-child(6),#doctable td:nth-child(7),#doctable th:nth-child(7){text-align:center}
/* Access page (three modes; .m1 = partner list where col 3 is Partner ID) */
#atable td:nth-child(2),#atable th:nth-child(2),#atable td:nth-child(4),#atable th:nth-child(4),
#atable td:nth-child(5),#atable th:nth-child(5),#atable td:nth-child(6),#atable th:nth-child(6){text-align:center}
#atable.m1 td:nth-child(3),#atable.m1 th:nth-child(3){text-align:center}
/* Client detail: Client Login + Projects tables */
#cdLogins td:nth-child(2),#cdLogins th:nth-child(2),#cdLogins td:nth-child(3),#cdLogins th:nth-child(3),
#cdLogins td:nth-child(5),#cdLogins th:nth-child(5),#cdLogins td:nth-child(6),#cdLogins th:nth-child(6),
#cdLogins td:nth-child(7),#cdLogins th:nth-child(7){text-align:center}
#cdProjects td:nth-child(3),#cdProjects th:nth-child(3),#cdProjects td:nth-child(5),#cdProjects th:nth-child(5),
#cdProjects td:nth-child(6),#cdProjects th:nth-child(6),#cdProjects td:nth-child(7),#cdProjects th:nth-child(7),
#cdProjects td:nth-child(8),#cdProjects th:nth-child(8){text-align:center}
#cdProjects .ctcell{align-items:center}

/* ---- 6. Top-right dropdown menu (bars) ---- */
.topmenu{position:fixed;top:0;right:16px;background:rgba(20,26,54,.98);border:1px solid rgba(255,255,255,.16);border-radius:14px;
  box-shadow:0 16px 44px rgba(0,0,15,.5);padding:7px;display:none;flex-direction:column;min-width:190px;z-index:120}
.topmenu.on{display:flex}
.tmi{display:flex;align-items:center;gap:11px;padding:10px 14px;border-radius:9px;color:#e4eaf9;font-size:13px;font-weight:600;cursor:pointer;
  background:transparent;border:none;width:100%;text-align:left;text-decoration:none}
.tmi:hover{background:rgba(255,255,255,.09)}