/* ============================================================
   Pradhan Sevak — brand theme overrides (loaded after theme/css/app.css)

   Brand palette (from the logo):
     --ps-navy   #2c3f66   primary / sidebar background
     --ps-green  #03916e   secondary / accent
   ============================================================ */

:root {
  --ps-navy: #2c3f66;
  --ps-navy-hover: #344a78;   /* sidebar link hover */
  --ps-navy-active: #3d568c;  /* sidebar link active — a lighter shade of the navy */
  --ps-green: #03916e;
  --ps-green-strong: #0aa981;

  --rk-sidebar-bg: var(--ps-navy);
  --rk-sidebar-accent: var(--ps-green);
  --rk-sidebar-text: rgba(255, 255, 255, .72);
  --rk-sidebar-text-strong: #ffffff;

  /* Retint the theme so Bootstrap primary/success match the logo */
  --jit-primary: var(--ps-navy);
  --jit-primary-soft: #e9edf4;
  --jit-success: var(--ps-green);
}

[data-bs-theme="dark"] {
  --rk-sidebar-bg: #26375a;
  --jit-primary-soft: rgba(44, 63, 102, .30);
}

/* Bootstrap primary button hover (app.css hard-codes an indigo hover) */
.btn-primary { background-color: var(--ps-navy); border-color: var(--ps-navy); }
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active { background-color: #243354 !important; border-color: #243354 !important; }
.btn-outline-primary { color: var(--ps-navy); border-color: var(--ps-navy); }
.btn-outline-primary:hover { background-color: var(--ps-navy); border-color: var(--ps-navy); }
.form-control:focus, .form-select:focus {
  border-color: var(--ps-navy);
  box-shadow: 0 0 0 .2rem rgba(44, 63, 102, .18);
}
.badge-soft-success { background: rgba(3, 145, 110, .14); color: var(--ps-green); }
a { color: var(--ps-navy); }

/* ------------------------------------------------------------
   Sidebar shell — solid navy
   ------------------------------------------------------------ */
.sidebar {
  background: var(--rk-sidebar-bg) !important;
  box-shadow: 4px 0 24px rgba(20, 30, 54, .28);
  border-right: 1px solid rgba(255, 255, 255, .06);
}

/* Faint top sheen so the flat fill still feels lit */
.sidebar::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 200px;
  background: radial-gradient(120% 80% at 20% 0%, rgba(255, 255, 255, .10), transparent 70%);
  pointer-events: none;
}

/* ------------------------------------------------------------
   Brand — full "Pradhan Sevak" lockup on a white chip so the
   logo's own white background reads as intentional on the navy rail.
   ------------------------------------------------------------ */
.sidebar-brand {
  border-bottom: 1px solid rgba(255, 255, 255, .12);
  padding: .85rem .9rem;
  overflow: hidden;
}

.sidebar-logo-chip {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  background: #fff;
  border-radius: 10px;
  padding: 9px 12px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .28);
  overflow: hidden;
  transition: padding .25s ease;
}

.sidebar-brand img {
  height: auto;
  width: 100%;
  max-width: 190px;
  display: block;
  border-radius: 0;
  box-shadow: none;
}

/* Collapsed rail: chip shrinks, logo crops to the "PS" mark on the left. */
.sidebar.collapsed .sidebar-brand { padding: .6rem .35rem; }
.sidebar.collapsed .sidebar-logo-chip { padding: 6px; justify-content: flex-start; }
.sidebar.collapsed .sidebar-brand img { width: auto; height: 24px; max-width: none; }

/* ------------------------------------------------------------
   Section headings
   ------------------------------------------------------------ */
.sidebar-heading {
  color: rgba(255, 255, 255, .55);
  font-weight: 700;
  letter-spacing: .12em;
}

/* ------------------------------------------------------------
   Links — pill shaped
   ------------------------------------------------------------ */
.sidebar-link {
  color: var(--rk-sidebar-text);
  margin: 3px 12px;
  padding: .625rem .875rem;
  border-radius: 12px;
  font-weight: 500;
  transition: background-color .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.sidebar-link:hover {
  background: var(--ps-navy-hover);
  color: var(--rk-sidebar-text-strong);
  transform: translateX(2px);
}

.sidebar-link.active {
  color: var(--rk-sidebar-text-strong);
  background: var(--ps-navy-active);
  box-shadow: 0 8px 20px rgba(0, 0, 0, .20), inset 0 0 0 1px rgba(255, 255, 255, .12);
}

/* Rounded glowing marker in the brand green */
.sidebar-link.active::before {
  content: "";
  left: -12px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 22px;
  border-radius: 0 6px 6px 0;
  background: var(--rk-sidebar-accent);
  box-shadow: 0 0 12px 1px var(--rk-sidebar-accent);
}

.sidebar-link .sidebar-icon {
  color: rgba(255, 255, 255, .9);
  transition: transform .18s ease;
}
.sidebar-link.active .sidebar-icon,
.sidebar-link:hover .sidebar-icon { transform: scale(1.08); }

.sidebar.collapsed .sidebar-link {
  margin: 3px 10px;
  padding: .625rem 0;
  justify-content: center;
}
.sidebar.collapsed .sidebar-link.active::before { display: none; }

/* ------------------------------------------------------------
   Submenus
   ------------------------------------------------------------ */
.sidebar-submenu {
  background: rgba(0, 0, 0, .18);
  border-radius: 12px;
  margin: 2px 12px 6px;
}
.sidebar-submenu .sidebar-link {
  margin: 2px 6px;
  padding-left: 2.75rem;
}

/* ------------------------------------------------------------
   User card
   ------------------------------------------------------------ */
.sidebar-user {
  border-top: 1px solid rgba(255, 255, 255, .14);
  background: rgba(0, 0, 0, .14);
}
.sidebar-user-name { color: #fff; }
.sidebar-user-role { color: rgba(255, 255, 255, .62); }
.sidebar-user .avatar-initial {
  background: var(--ps-green) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
  border: 1px solid rgba(255, 255, 255, .3);
}

/* ------------------------------------------------------------
   Scrollbar inside the nav
   ------------------------------------------------------------ */
.sidebar-nav { scrollbar-color: rgba(255, 255, 255, .28) transparent; }
.sidebar-nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .28); }
.sidebar-nav::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, .45); }
