/* AtlasAi 1.2.1 – unified turquoise skin
   This file is loaded AFTER atlas12.css + atlas12_overrides.css + library_bookshelf.css
   and only contains safe overrides (no HTML changes szükséges).
*/

/* --- Global colors / tokens ------------------------------------------------ */

:root{
  /* Slightly more turquoise overall feel */
  --atlas-bg-0: #f4f8fb;
  --atlas-bg-1: #ffffff;
  --atlas-card: rgba(255,255,255,0.94);
  --atlas-border: rgba(15, 23, 42, 0.08);
  --atlas-shadow: 0 16px 40px rgba(15, 23, 42, 0.12);

  /* Primary accents */
  --atlas12-accent: #00a7b3;   /* turquoise */
  --atlas12-accent2: #2563eb;  /* blue companion */
}

/* Background – keep light, but unify */
body.atlas12{
  background:
    radial-gradient(1200px 800px at 15% 0%, rgba(0,167,179,0.14), transparent 60%),
    radial-gradient(1200px 800px at 85% 10%, rgba(37,99,235,0.12), transparent 60%),
    linear-gradient(180deg, var(--atlas-bg-0), var(--atlas-bg-1));
}

/* --- Sidebar: framed buttons on the left ----------------------------------- */

.atlas12-sidebar{
  background: rgba(255,255,255,0.96);
  border-right: 1px solid var(--atlas-border);
  box-shadow: 8px 0 40px rgba(15, 23, 42, 0.08);
}

/* Brand */
.atlas12-brand .atlas12-logo-circle{
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 30% 30%, #e0f9fc, transparent 55%),
    linear-gradient(135deg, var(--atlas12-accent), var(--atlas12-accent2));
  box-shadow: 0 0 0 3px rgba(255,255,255,0.9);
}

/* Main nav = framed pill buttons */
.atlas12-nav .nav-link{
  display: flex;
  align-items: center;
  gap: .55rem;
  padding: .55rem .9rem;
  border-radius: 999px;
  border: 1px solid rgba(15, 23, 42, 0.06);
  background: rgba(255,255,255,0.92);
  color: rgba(15, 23, 42, 0.88);
  transition: background 120ms ease, border-color 120ms ease, transform 120ms ease, box-shadow 120ms ease;
}

.atlas12-nav .nav-link .atlas-nav-dot{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(15, 23, 42, 0.18);
}

/* Hover */
.atlas12-nav .nav-link:hover{
  background: rgba(255,255,255,1);
  border-color: rgba(15, 23, 42, 0.14);
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.08);
  text-decoration: none;
}

/* Active state – turquoise pill */
.atlas12-nav .nav-link.active{
  background: linear-gradient(135deg, rgba(0,167,179,0.16), rgba(37,99,235,0.10));
  border-color: rgba(0,167,179,0.55);
  color: rgba(15, 23, 42, 0.98);
  font-weight: 600;
}

.atlas12-nav .nav-link.active .atlas-nav-dot{
  background: var(--atlas12-accent);
}

/* Indented (ps-4) children: a bit slimmer */
.atlas12-nav .nav-link.ps-4{
  border-radius: 999px;
  padding-left: 1.4rem !important;
}

/* Section labels */
.atlas12-section{
  letter-spacing: .06em;
  font-size: .72rem;
  text-transform: uppercase;
}

/* Sidebar footer */
.atlas12-sidebar-footer{
  border-top: 1px solid rgba(15, 23, 42, 0.06);
  padding-top: .35rem;
}

/* --- Content cards / tiles -------------------------------------------------- */

.card{
  border-radius: 18px !important;
  border: 1px solid var(--atlas-border);
  box-shadow: var(--atlas-shadow);
}

/* Dashboard tiles */
.atlas-card-tile{
  background: var(--atlas-card);
  border-radius: 18px;
}

/* Tile icon bubble */
.atlas-tile-icon{
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: radial-gradient(circle at 30% 30%, #e0f9fc, transparent 55%),
              linear-gradient(135deg, rgba(0,167,179,0.18), rgba(37,99,235,0.12));
  color: #0f172a;
}

/* Links (cards) */
.atlas-card-link{
  text-decoration: none;
  color: inherit;
}
.atlas-card-link:hover .atlas-card-tile{
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.16);
}

/* --- Dashboard hero with Atlas image -------------------------------------- */

.atlas-dashboard-hero{
  border-radius: 24px;
  border: 1px solid rgba(15, 23, 42, 0.12);
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.18);
  background: radial-gradient(circle at 0% 0%, rgba(0,167,179,0.20), transparent 55%),
              radial-gradient(circle at 100% 0%, rgba(37,99,235,0.18), transparent 55%),
              linear-gradient(135deg, #020617, #020617);
  color: #e5f7fb;
  overflow: hidden;
}

.atlas-dashboard-hero-title{
  font-size: 1.35rem;
  font-weight: 600;
}

.atlas-dashboard-hero-sub{
  font-size: .9rem;
  opacity: .88;
}

.atlas-dashboard-hero-badges .badge{
  border-radius: 999px;
  padding: .25rem .7rem;
  font-weight: 500;
  background: rgba(15,23,42,0.18);
  color: #e5f7fb;
}

/* Right side illustration */
.atlas-dashboard-hero-illustration{
  background-image: url("/static/img/atlas_bg_4k.png");
  background-size: cover;
  background-position: center;
  min-height: 220px;
}

/* --- Auth / login tweaks --------------------------------------------------- */

body.atlas12.bg-light{
  background:
    radial-gradient(1200px 800px at 15% 0%, rgba(0,167,179,0.18), transparent 60%),
    radial-gradient(1200px 800px at 85% 10%, rgba(37,99,235,0.16), transparent 60%),
    linear-gradient(180deg, #020617, #020617);
}

.auth-card{
  border-radius: 22px;
}

/* 2FA info text */
.auth-card + .small{
  opacity: .9;
}