﻿/* =============================================================================
   Plutus Analytics — Design Theme Tokens (centralized, single source of truth)
   -----------------------------------------------------------------------------
   THIS IS THE ONLY FILE THAT SHOULD CONTAIN LITERAL STYLE VALUES.
   Values are derived from the approved UI theme (requirements/20260909/
   plutus_theme.css) so the live app matches the design mockups.
   To re-skin the whole site, change a value HERE.
   ========================================================================== */

:root {
  /* --- Brand colors ------------------------------------------------------- */
  --tk-navy:            #062957;   /* Deep navy: navbar, titles, dark blocks */
  --tk-navy-2:          #0b356c;   /* navy hover */
  --tk-gold:            #f0b429;

  /* Primary accent (buttons, titles, links, active states, icons) */
  --tk-primary:         #0b5ed7;   /* pa-blue-700 */
  --tk-primary-hover:   #0b63e8;
  --tk-primary-soft:    #eaf3ff;   /* pa-blue-100: page base + soft highlights */
  --tk-accent:          #0d6efd;   /* pa-blue-600: active bar, icons, focus */

  /* --- Page background (base color reuses --tk-primary-soft) -------------- */
  --tk-bg-overlay:      rgba(231, 241, 252, 0.1);
  --tk-bg-image:        url('/static/bg.jpg?v=20260924');

  /* --- Surfaces ----------------------------------------------------------- */
  --tk-surface:         rgba(255, 255, 255, 0.96);   /* page card */
  --tk-surface-soft:    rgba(248, 251, 255, 0.94);   /* section/card body */
  --tk-surface-solid:   #ffffff;                     /* opaque inputs/buttons */
  --tk-border:          #d7e0ec;
  --tk-border-strong:   #c5d2e1;
  --tk-input-hover-border: #aac0d9;

  /* --- Text --------------------------------------------------------------- */
  --tk-text:            #0a2b5e;
  --tk-text-strong:     #071f47;
  --tk-text-muted:      #62708a;
  --tk-placeholder:     #97a3b6;   /* e.g. placeholder */

  /* --- Success / Danger (result cards) ------------------------------------ */
  --tk-success:         #118c4f;
  --tk-success-bg:      #edf9f2;
  --tk-success-border:  #c7ead6;
  --tk-success-text:    var(--tk-success);
  --tk-danger:          #d93f3f;
  --tk-danger-bg:       #fdeaea;
  --tk-danger-border:   #efb9b9;
  --tk-danger-text:     var(--tk-danger);

  /* --- Section Card Styles ------------------------------------------------ */
  --tk-section-bg:         var(--tk-surface-soft);
  --tk-section-border:     var(--tk-border);
  --tk-section-radius:     var(--tk-radius-md);
  --tk-section-padding:    16px 18px;
  --tk-section-gap:        18px;
  --tk-section-title-color: var(--tk-primary);   /* blue section title */

  /* Section icon color (plain glyph, no box) */
  --tk-icon-box-color:  var(--tk-accent);        /* content icon color (#0d6efd) */

  /* General content icon color */
  --tk-icon-color:      var(--tk-accent);

  /* Icon sizes by area (centralized) */
  --tk-icon-size-content: 1.5rem;   /* content-area icons */
  --tk-icon-size-sidebar: 1.5rem;   /* sidebar icons */
  --tk-icon-size-auth:    1.7rem;   /* top-right account icons */
  --tk-icon-size:         var(--tk-icon-size-content);   /* global default */

  /* Key-capabilities list icons (circular badge) */
  --tk-icon-size-cap:   0.8rem;     /* glyph size */
  --tk-cap-icon-size:   1.1rem;     /* circular badge size */
  --tk-cap-icon-bg:     var(--tk-primary-soft);

  /* --- MBS Section Number ------------------------------------------------- */
  --tk-section-num-bg:     var(--tk-primary);
  --tk-section-num-color:  var(--tk-surface-solid);
  --tk-section-num-size:   24px;

  /* --- Navigation (top bar) ----------------------------------------------- */
  --tk-nav-link-color:       rgba(255, 255, 255, 0.94);
  --tk-nav-auth-size:        1.00rem;   /* right-side Login/Register text (unchanged) */
  --tk-nav-auth-icon-gap:    10px;      /* gap between auth icon and its text */
  --tk-nav-divider:          rgba(255, 255, 255, 0.35);
  --tk-navbar-height:        80px;
  --tk-navbar-bg:            var(--tk-navy);   /* solid menu background */
  --tk-navbar-shadow:        0 2px 12px rgba(0, 0, 0, 0.14);

  /* Link color used on dark (navy) surfaces */
  --tk-link-on-dark:         #3ca7ff;

  /* --- Sidebar ------------------------------------------------------------ */
  --tk-sidebar-group-color:  var(--tk-primary);
  --tk-sidebar-active-bar:   var(--tk-accent);
  --tk-sidebar-item-inset:   10px;   /* side gap around sidebar items (highlight) */
  --tk-sidebar-icon-gap:     8px;    /* gap between sidebar icon and label */

  /* --- Inputs ------------------------------------------------------------- */
  --tk-input-height:     40px;
  --tk-input-bg:         var(--tk-surface-solid);
  --tk-focus-ring:       0 0 0 3px rgba(13, 110, 253, 0.13);

  /* --- Buttons ------------------------------------------------------------ */
  --tk-btn-primary-gradient: linear-gradient(180deg, #1478ff, #0b5ed7);
  --tk-btn-primary-gradient-hover: linear-gradient(180deg, #2685ff, #0b63e8);
  --tk-btn-shadow:       0 6px 14px rgba(11, 94, 215, 0.20);
  --tk-btn-outline-border: #8fb8f0;

  /* --- Tables (Analysis Queue / Results) ---------------------------------- */
  --tk-table-head-bg:    #e9edf4;   /* header row background */
  --tk-table-head-color: var(--tk-navy);
  --tk-table-row-bg:     var(--tk-surface-solid);
  --tk-table-row-alt:    var(--tk-section-bg);   /* zebra stripe = card background */
  --tk-table-row-hover:  var(--tk-primary-soft);
  --tk-table-border:     #e8ebf3;   /* row separator / frame */
  --tk-table-head-sep:   #ffffff;   /* column separators in the header row */

  /* --- Radii -------------------------------------------------------------- */
  --tk-radius-lg:       4px;   /* page card */
  --tk-radius-md:       4px;   /* section cards, inputs */
  --tk-radius-sm:       4px;    /* buttons, chips */
  --tk-auth-radius:     12px;  /* auth (register/login) card */
  --tk-btn-radius:      var(--tk-radius-sm);  /* alias used by sections */

  /* --- Shadows ------------------------------------------------------------ */
  --tk-shadow-card:     0 12px 30px rgba(10, 43, 94, 0.12);
  --tk-shadow-soft:     0 4px 12px rgba(10, 43, 94, 0.08);

  /* --- Logo asset (centralized) ------------------------------------------- */
  --tk-logo-height:     70px;

  /* --- Layout ------------------------------------------------------------- */
  --tk-container-max:   1500px;
  --tk-sidebar-width:   280px;

  /* --- Fonts -------------------------------------------------------------- */
  --tk-font-body:       Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont,
                        "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --tk-font-header:     Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont,
                        "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
