/*
Theme Name: InvestSphere
Theme URI: https://example.com/investsphere
Author: InvestSphere Team
Author URI: https://example.com
Description: Smart Investing Platform for Stocks, IPOs & Mutual Funds. A premium, mobile-first, Elementor & Gutenberg compatible finance theme with a TipRanks-inspired but original design system, dark/light mode, live-data-ready modules and a full admin control panel.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: investsphere
Tags: finance, stocks, mutual-funds, ipo, block-patterns, custom-colors, custom-logo, dark-mode, full-width-template, one-column, two-columns, footer-widgets, threaded-comments, translation-ready
*/

/* =========================================================
   1. DESIGN TOKENS
   ========================================================= */
:root{
  --is-primary:#ff5b04;
  --is-primary-2:#ff2e92;
  --is-primary-dark:#e6480a;
  --is-accent:#7c5cff;
  --is-accent-2:#00d4c8;
  --is-secondary:#14151a;
  --is-bg:#f4f5fb;
  --is-surface:#ffffff;
  --is-text:#14151a;
  --is-text-muted:#6b7280;
  --is-border:#e8e8f2;
  --is-green:#12b76a;
  --is-red:#f04438;
  --is-radius-sm:10px;
  --is-radius-md:16px;
  --is-radius-lg:24px;
  --is-shadow-sm:0 2px 8px rgba(20,21,26,.06);
  --is-shadow-md:0 8px 24px rgba(20,21,26,.08);
  --is-shadow-lg:0 16px 40px rgba(20,21,26,.12);
  --is-glass-bg:rgba(255,255,255,.65);
  --is-glass-border:rgba(255,255,255,.35);
  --is-header-h:56px;
  --is-bottomnav-h:64px;
  --is-max-w:1280px;
  --is-font-body: 'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --is-font-heading: 'Sora','Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --is-transition:.22s cubic-bezier(.4,0,.2,1);
  --is-gradient-brand:linear-gradient(125deg,var(--is-primary) 0%,var(--is-primary-2) 100%);
  --is-gradient-accent:linear-gradient(125deg,var(--is-accent) 0%,var(--is-accent-2) 100%);
  --is-shadow-primary:0 12px 28px -8px rgba(255,46,146,.4);
  --is-shadow-accent:0 12px 28px -8px rgba(124,92,255,.4);
}

@media(min-width:600px){
  :root{ --is-header-h:64px; }
}

html[data-is-theme="dark"]{
  --is-bg:#0a0a12;
  --is-surface:#15151f;
  --is-text:#f4f4f8;
  --is-text-muted:#9a9aad;
  --is-border:#26263a;
  --is-glass-bg:rgba(21,21,31,.7);
  --is-glass-border:rgba(255,255,255,.08);
  --is-shadow-sm:0 2px 8px rgba(0,0,0,.4);
  --is-shadow-md:0 8px 24px rgba(0,0,0,.4);
  --is-shadow-lg:0 16px 40px rgba(0,0,0,.5);
}

/* =========================================================
   2. RESET / BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;min-width:0;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
svg{display:block;flex-shrink:0;}
body{
  margin:0;
  font-family:var(--is-font-body);
  background:var(--is-bg);
  color:var(--is-text);
  line-height:1.55;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  -webkit-tap-highlight-color:transparent;
  overflow-x:hidden; /* defensive: prevents any child overflow from creating page-level horizontal scroll on mobile */
  padding-bottom:calc(var(--is-bottomnav-h) + env(safe-area-inset-bottom));
  transition:background var(--is-transition),color var(--is-transition);
}
h1,h2,h3,h4,h5,h6{font-family:var(--is-font-heading);letter-spacing:-.01em;}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;}
button:active,.is-card:active,a.is-card:active{transform:scale(.98);}
.is-container{max-width:var(--is-max-w);margin:0 auto;padding:0 16px;}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);overflow:hidden;height:1px;width:1px;}

/* =========================================================
   3. HEADER / SEARCH / TICKER
   ========================================================= */
.is-header{
  position:sticky;top:0;z-index:50;
  height:var(--is-header-h);
  display:flex;align-items:center;
  background:var(--is-glass-bg);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom:1px solid var(--is-border);
  transition:box-shadow var(--is-transition);
}
.is-header.is-scrolled{box-shadow:0 4px 20px rgba(0,0,0,.06);}
html[data-is-theme="dark"] .is-header.is-scrolled{box-shadow:0 4px 20px rgba(0,0,0,.3);}

/* Fixed: children now shrink correctly (min-width:0 + explicit flex-basis) so the row never overflows on narrow phones. */
.is-header__inner{display:flex;align-items:center;gap:8px;width:100%;}
.is-logo{
  font-family:var(--is-font-heading);font-weight:800;font-size:16px;
  flex-shrink:0;white-space:nowrap;letter-spacing:-.01em;
  background:var(--is-gradient-brand);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:var(--is-primary);
}
.is-logo img{height:28px;display:block;}

.is-search{
  flex:1 1 auto;min-width:0;display:flex;align-items:center;gap:6px;
  background:var(--is-surface);border:1.5px solid var(--is-border);
  border-radius:999px;padding:7px 14px;transition:border-color var(--is-transition),box-shadow var(--is-transition);
}
.is-search:focus-within{border-color:var(--is-primary-2);box-shadow:0 0 0 4px rgba(255,46,146,.12);}
.is-search svg{flex-shrink:0;color:var(--is-text-muted);}
.is-search input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--is-text);font-size:13.5px;}

.is-theme-toggle{
  width:36px;height:36px;border-radius:50%;border:1.5px solid var(--is-border);
  background:var(--is-surface);display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:var(--is-primary-2);transition:background var(--is-transition),transform var(--is-transition),border-color var(--is-transition);
}
.is-theme-toggle:active{transform:scale(.9);}
.is-theme-toggle:hover{border-color:var(--is-primary-2);}

@media(min-width:600px){
  .is-logo{font-size:20px;}
  .is-logo img{height:32px;}
  .is-search{padding:8px 16px;}
  .is-search input{font-size:14px;}
  .is-theme-toggle{width:38px;height:38px;}
}

.is-ticker{
  display:flex;overflow-x:auto;gap:14px;padding:7px 16px;
  background:var(--is-secondary);white-space:nowrap;scrollbar-width:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent);
  mask-image:linear-gradient(90deg,transparent,#000 16px,#000 calc(100% - 16px),transparent);
}
.is-ticker::-webkit-scrollbar{display:none;}
.is-ticker__item{display:inline-flex;gap:6px;align-items:baseline;color:#fff;font-size:12px;flex-shrink:0;}
.is-ticker__item .sym{font-weight:700;color:#fff;letter-spacing:.01em;}
.is-ticker__item .chg.up{color:#4ade80;}
.is-ticker__item .chg.down{color:#f87171;}

/* =========================================================
   4. CARDS / GRID / SECTIONS
   ========================================================= */
.is-section{padding:20px 0;}
.is-section__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px;}
.is-section__head h2{font-size:clamp(15px,4vw,18px);margin:0;font-weight:800;font-family:var(--is-font-heading);white-space:nowrap;}
.is-section__head a{font-size:12.5px;color:var(--is-primary);font-weight:700;flex-shrink:0;}

.is-hscroll{display:flex;gap:12px;overflow-x:auto;padding:2px 2px 10px;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;}
.is-hscroll::-webkit-scrollbar{height:0;}
.is-hscroll > *{scroll-snap-align:start;flex-shrink:0;}

.is-card{
  background:var(--is-surface);border:1px solid var(--is-border);
  border-radius:var(--is-radius-md);padding:14px;box-shadow:var(--is-shadow-sm);
  transition:transform var(--is-transition),box-shadow var(--is-transition),border-color var(--is-transition);
}
.is-card:hover{transform:translateY(-3px);box-shadow:var(--is-shadow-md);border-color:rgba(255,46,146,.25);}

.is-stock-card{width:150px;}
.is-stock-card .sym{font-weight:700;font-size:14px;}
.is-stock-card .name{font-size:11px;color:var(--is-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.is-stock-card .price{font-size:15px;font-weight:800;margin-top:6px;}
.is-pill{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:700;padding:3px 9px;border-radius:999px;}
.is-pill.up{background:rgba(18,183,106,.13);color:var(--is-green);}
.is-pill.down{background:rgba(240,68,56,.13);color:var(--is-red);}

.is-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;}
@media(min-width:640px){.is-grid{grid-template-columns:repeat(3,1fr);}}
@media(min-width:960px){.is-grid{grid-template-columns:repeat(4,1fr);}}

/* Gradient / glass premium cards */
.is-gradient-card{
  border-radius:var(--is-radius-lg);padding:22px 20px;color:#fff;
  background:var(--is-gradient-brand);
  box-shadow:var(--is-shadow-primary);position:relative;overflow:hidden;
}
.is-gradient-card::after{
  content:"";position:absolute;top:0;right:0;bottom:0;left:0;
  background:radial-gradient(circle at 80% -20%,rgba(255,255,255,.35),transparent 60%);
}
.is-gradient-card h2,.is-gradient-card p{position:relative;}
.is-gradient-card a{position:relative;}

/* Accent variant for a second gradient card style (e.g. experts / IPO CTAs) */
.is-gradient-card.is-accent-variant{background:var(--is-gradient-accent);box-shadow:var(--is-shadow-accent);}

/* =========================================================
   5. NEWS CARDS — Inshorts-style: 40% image / 50% summary / 10% link bar.
   Shared by the homepage swiper (template-parts/news-card.php) and the
   News archive feed. Height is fixed via --is-news-card-h so the 40/50/10
   flex-basis split is a true proportional split at any screen size.
   ========================================================= */
:root{ --is-news-card-h: clamp(420px, 62vh, 560px); }

.is-news-swiper{position:relative;border-radius:var(--is-radius-lg);overflow:hidden;box-shadow:var(--is-shadow-md);}
.is-news-track{display:flex;height:var(--is-news-card-h);transition:transform .45s cubic-bezier(.4,0,.2,1);touch-action:pan-y;}
.is-news-slide{min-width:100%;height:100%;flex-shrink:0;}

.is-news-card{
  display:flex;flex-direction:column;height:100%;
  background:var(--is-surface);border:1px solid var(--is-border);
  border-radius:var(--is-radius-lg);overflow:hidden;
}

/* 40% — image */
.is-news-card-media{flex:0 0 40%;position:relative;overflow:hidden;background:var(--is-bg);}
.is-news-card-media img{width:100%;height:100%;object-fit:cover;display:block;}
.is-news-card-badge{
  position:absolute;top:10px;left:10px;background:rgba(10,10,18,.65);color:#fff;
  font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;
  padding:4px 10px;border-radius:999px;backdrop-filter:blur(6px);
}

/* 50% — headline + summary (scrolls internally as a safety net; content is trimmed to fit) */
.is-news-card-summary{
  flex:0 0 50%;min-height:0;overflow-y:auto;
  padding:14px 16px 8px;display:flex;flex-direction:column;
}
.is-news-card-summary h3{
  margin:0 0 8px;font-size:clamp(15px,4.2vw,18px);line-height:1.3;
  font-family:var(--is-font-heading);font-weight:800;
}
.is-news-card-summary h3 a{color:var(--is-text);}
.is-news-card-summary p{margin:0;font-size:13.5px;line-height:1.5;color:var(--is-text-muted);}

/* 10% — source + link bar */
.is-news-card-footer{
  flex:0 0 10%;min-height:44px;display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;border-top:1px solid var(--is-border);
}
.is-news-card-source{font-size:11.5px;color:var(--is-text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.is-news-card-link{
  font-weight:700;font-size:12.5px;color:#fff;flex-shrink:0;
  background:var(--is-gradient-brand);padding:6px 14px;border-radius:999px;
  box-shadow:var(--is-shadow-primary);transition:transform var(--is-transition);
}
.is-news-card-link:active{transform:scale(.93);}

.is-news-dots{display:flex;gap:6px;justify-content:center;padding:10px 0;}
.is-news-dots span{width:6px;height:6px;border-radius:50%;background:var(--is-border);transition:all var(--is-transition);}
.is-news-dots span.active{background:var(--is-gradient-brand);width:18px;border-radius:4px;}

/* Vertical single-column feed (News archive), matching Inshorts' stacked-card feed */
.is-inshorts-feed{display:flex;flex-direction:column;gap:18px;max-width:520px;margin:0 auto;}
.is-inshorts-feed .is-news-card{height:var(--is-news-card-h);box-shadow:var(--is-shadow-sm);}

/* =========================================================
   6. BOTTOM NAVIGATION (mobile-first)
   ========================================================= */
.is-bottomnav{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;background:var(--is-glass-bg);backdrop-filter:blur(16px) saturate(1.4);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);
  border-top:1px solid var(--is-border);
  padding-bottom:env(safe-area-inset-bottom);
  height:var(--is-bottomnav-h);
  box-shadow:0 -6px 20px rgba(0,0,0,.05);
}
.is-bottomnav a{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;font-size:10px;color:var(--is-text-muted);font-weight:600;
  position:relative;transition:color var(--is-transition);
}
.is-bottomnav a .is-nav-icon{
  display:flex;align-items:center;justify-content:center;
  width:26px;height:26px;transition:transform var(--is-transition);
}
.is-bottomnav a .is-nav-icon svg{width:22px;height:22px;color:currentColor;}
.is-bottomnav a .is-nav-label{line-height:1;}
.is-bottomnav a.active{color:var(--is-primary-2);}
.is-bottomnav a.active .is-nav-icon{transform:translateY(-1px);filter:drop-shadow(0 2px 6px rgba(255,46,146,.4));}
.is-bottomnav a.active::before{
  content:"";position:absolute;top:2px;left:50%;transform:translateX(-50%);
  width:26px;height:3px;border-radius:0 0 4px 4px;background:var(--is-gradient-brand);
}
.is-bottomnav a:active .is-nav-icon{transform:scale(.88);}

@media(min-width:960px){
  .is-bottomnav{display:none;}
  body{padding-bottom:0;}
}

/* =========================================================
   7. RESPONSIVE HELPERS
   ========================================================= */
.is-hide-mobile{display:none;}
@media(min-width:960px){
  .is-hide-mobile{display:block;}
  .is-hide-desktop{display:none;}
}

/* =========================================================
   8. SHIMMER / LOADING
   ========================================================= */
.is-shimmer{
  background:linear-gradient(90deg,var(--is-border) 25%,var(--is-bg) 37%,var(--is-border) 63%);
  background-size:400% 100%;animation:is-shimmer 1.4s ease infinite;border-radius:var(--is-radius-sm);
}
@keyframes is-shimmer{0%{background-position:100% 50%;}100%{background-position:0 50%;}}

/* =========================================================
   9. TABLES (screeners, comparisons)
   ========================================================= */
.is-table-wrap{overflow-x:auto;border-radius:var(--is-radius-md);border:1px solid var(--is-border);}
.is-table{width:100%;border-collapse:collapse;font-size:13px;min-width:640px;}
.is-table th,.is-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--is-border);white-space:nowrap;}
.is-table th{background:var(--is-bg);font-weight:700;position:sticky;top:0;}

/* =========================================================
   10. FOOTER
   ========================================================= */
.is-footer{background:var(--is-secondary);color:#d7d9dd;padding:32px 0;margin-top:32px;}
.is-footer a{color:#fff;}
.is-footer .is-footer-grid{display:grid;grid-template-columns:1fr;gap:24px;}
@media(min-width:768px){.is-footer .is-footer-grid{grid-template-columns:repeat(4,1fr);}}

/* Elementor / Gutenberg compatibility resets */
.elementor-widget-container,.wp-block-group{color:inherit;}
.entry-content > *{max-width:100%;}
