/* =========================
   LIGHT THEME (override)
========================= */
body.light{
	--bg: #e7ebf0;
	--bg-2: #e1e6ec;
	--bg-3: #d9e0e8;
	--bg-4: #d2dae3;

	--panel: #e9edf2;
	--panel-2: #e3e8ee;
	--panel-3: #dde3ea;

	--stroke: rgba(20,30,60,0.08);
	--stroke-strong: rgba(20,30,60,0.16);

	--text: #1f2937;
	--text-soft: #556070;
	--text-muted: #7b8794;

	--shadow-1: 0 8px 22px rgba(20,30,60,.05);
	--shadow-2: 0 14px 32px rgba(20,30,60,.07);
	--shadow-3: 0 24px 56px rgba(20,30,60,.10);
}

/* =========================
   BODY
========================= */
body.light{
	background:
		radial-gradient(800px 400px at 10% -10%, rgba(0,130,202,.06), transparent 60%),
		radial-gradient(700px 400px at 90% 0%, rgba(226,28,142,.05), transparent 60%),
		linear-gradient(180deg, var(--bg), var(--bg-2));
	color: var(--text);
}

/* =========================
   SIDEBAR
========================= */
body.light .sidebar{
	background: linear-gradient(180deg, #eef2f6, #e6ebf1);
	border-right: 1px solid var(--stroke);
	box-shadow: inset -1px 0 0 rgba(255,255,255,.4);
}

body.light .brand{
	background: linear-gradient(135deg, rgba(226,28,142,.07), rgba(61,25,81,.05), rgba(0,130,202,.04));
	border-color: var(--stroke);
}

body.light .brand-logo{
	background: url('../images/favicon.png') no-repeat center;
	background-size: contain;
}

body.light .brand-copy strong,
body.light .user-copy strong,
body.light .profile-copy strong,
body.light .page-heading h1,
body.light .panel-head h2,
body.light .metric-card h3,
body.light .project-top h3,
body.light .module-card h3,
body.light .activity-item strong,
body.light .modal-head h3{
	color: var(--text);
}

body.light .brand-copy span,
body.light .user-copy span,
body.light .profile-copy span,
body.light .page-heading p,
body.light .panel-head p,
body.light .metric-card p,
body.light .project-top p,
body.light .project-meta,
body.light .module-card p,
body.light .activity-item p,
body.light .calendar-task span,
body.light .modal-head p,
body.light .modal-body,
body.light .entry-content,
body.light .page-content{
	color: var(--text-soft);
}

body.light .nav-link{
	color: var(--text-soft);
}

body.light .nav-link:hover{
	background: rgba(31,41,55,.04);
	border-color: var(--stroke);
	color: var(--text);
}

body.light .nav-link.active{
	background: linear-gradient(135deg, rgba(226,28,142,.10), rgba(61,25,81,.08), rgba(0,130,202,.06));
	border-color: rgba(226,28,142,.14);
	color: var(--text);
	box-shadow: none;
}

body.light .user-card{
	background: #f0f3f6;
	border-color: var(--stroke);
}

/* =========================
   TOPBAR
========================= */
body.light .topbar{
	background: rgba(232,236,241,.92);
	border-bottom: 1px solid var(--stroke);
	backdrop-filter: blur(12px);
}

body.light .topbar.is-scrolled{
	background: rgba(232,236,241,.98);
	border-bottom-color: var(--stroke-strong);
}

/* =========================
   BUTTONS
========================= */
body.light .btn{
	background: #e4e8ed;
	border-color: rgba(20,30,60,.08);
	color: var(--text);
	box-shadow: none;
}

body.light .btn:hover{
	background: #dce2e8;
	border-color: rgba(20,30,60,.12);
}

body.light .btn.primary{
	color: #ffffff;
	background: linear-gradient(135deg, var(--brand-pink), var(--brand-purple));
	border-color: transparent;
	box-shadow: none;
}

body.light .btn.primary:hover{
	filter: brightness(1.03);
}

body.light .btn.ghost{
	background: transparent;
	border-color: rgba(20,30,60,.08);
	color: var(--text);
}

/* =========================
   CHIPS
========================= */
body.light .chip{
	background: #e4e8ed;
	border-color: rgba(20,30,60,.08);
	color: var(--text-soft);
	box-shadow: none;
}

body.light .chip:hover{
	background: #dce2e8;
	color: var(--text);
}

body.light .chip.active{
	background: linear-gradient(135deg, rgba(226,28,142,.22), rgba(193,154,222,.30), rgba(111,207,235,.24));
	border-color: rgba(226,28,142,.16);
	color: var(--text);
	box-shadow: none;
}

/* =========================
   PANELS / CARDS
========================= */
body.light .panel,
body.light .metric-card,
body.light .project-card,
body.light .module-card,
body.light .activity-item,
body.light .calendar-day,
body.light .gantt-shell,
body.light .modal-card{
	background: var(--panel);
	border-color: var(--stroke);
	box-shadow: var(--shadow-1);
}

body.light .metric-card.highlight{
	background:
		radial-gradient(320px 120px at 0% 0%, rgba(226,28,142,.08), transparent 58%),
		linear-gradient(135deg, rgba(0,130,202,.08), rgba(61,25,81,.06), #e9edf2 80%);
	border-color: rgba(226,28,142,.12);
}

body.light .project-card,
body.light .module-card,
body.light .activity-item,
body.light .calendar-day{
	background: #e9edf2;
}

body.light .project-card:hover,
body.light .module-card:hover,
body.light .calendar-day:hover{
	background: #e3e8ee;
}

body.light .panel-head{
	border-bottom-color: rgba(20,30,60,.06);
}

/* =========================
   ICON BUTTONS
========================= */
body.light .icon-btn{
	background: #e8ecf0;
	border-color: rgba(20,30,60,.08);
	color: var(--text);
}

body.light .icon-btn:hover{
	background: #dfe5ea;
	border-color: rgba(20,30,60,.12);
}

body.light .notify-dot{
	box-shadow: 0 0 0 4px rgba(226,28,142,.10);
}

/* =========================
   SWITCH
========================= */
body.light .theme-switch-ui{
	background: #e8ecf0;
	border-color: rgba(20,30,60,.08);
}

body.light .theme-switch-ball{
	box-shadow: 0 2px 8px rgba(20,30,60,.10);
}

/* =========================
   TABLE
========================= */
body.light .data-table thead th{
	color: var(--text-muted);
	border-bottom: 1px solid rgba(20,30,60,.08);
}

body.light .data-table tbody td{
	color: var(--text-soft);
	border-bottom: 1px solid rgba(20,30,60,.06);
}

body.light .data-table tbody tr td:first-child{
	color: var(--text);
}

body.light .data-table tbody tr:hover td{
	background: rgba(20,30,60,.025);
}

/* =========================
   INPUTS
========================= */
body.light input,
body.light select,
body.light textarea{
	background: #eef2f6;
	border-color: rgba(20,30,60,.08);
	color: var(--text);
}

body.light input:focus,
body.light select:focus,
body.light textarea:focus{
	background: #ffffff;
	border-color: rgba(226,28,142,.18);
	box-shadow: 0 0 0 4px rgba(226,28,142,.08);
}

body.light ::placeholder{
	color: #8a94a3;
}

/* =========================
   SEARCH
========================= */
body.light .search-box input{
	background: #edf1f5;
}

body.light .search-box svg{
	color: var(--text-muted);
}

/* =========================
   METRICS
========================= */
body.light .metric-kicker{
	color: var(--text-soft);
}

body.light .mini-progress{
	background: rgba(20,30,60,.08);
}

/* =========================
   PROJECTS
========================= */
body.light .project-progress small{
	color: var(--text-soft);
}

body.light .progress-track{
	background: rgba(20,30,60,.08);
}

/* =========================
   STATUS / BADGES / PILLS
========================= */
body.light .badge,
body.light .status-pill,
body.light .status-badge{
	color: var(--text);
	box-shadow: none;
}

body.light .badge.success,
body.light .status-pill.done,
body.light .status-badge.done{
	color: #0c7a63;
	background: rgba(0,174,141,.14);
	border-color: rgba(0,174,141,.18);
}

body.light .badge.warning,
body.light .status-pill.pending,
body.light .status-badge.pending{
	color: #9a6b00;
	background: rgba(255,183,27,.16);
	border-color: rgba(255,183,27,.20);
}

body.light .badge.danger{
	color: #b44d1f;
	background: rgba(242,97,34,.14);
	border-color: rgba(242,97,34,.18);
}

body.light .badge.neutral{
	color: #0d6c9f;
	background: rgba(0,151,206,.12);
	border-color: rgba(0,151,206,.16);
}

body.light .status-pill.in-progress,
body.light .status-badge.progress{
	color: #0d6c9f;
	background: rgba(0,130,202,.14);
	border-color: rgba(0,130,202,.18);
}

body.light .status-badge.review{
	color: #7d4ea0;
	background: rgba(193,154,222,.16);
	border-color: rgba(193,154,222,.20);
}

/* =========================
   ACTIVITY
========================= */
body.light .activity-dot{
	box-shadow: 0 0 0 4px rgba(20,30,60,.03);
}

body.light .activity-item small{
	color: var(--text-muted);
}

/* =========================
   CALENDAR
========================= */
body.light .calendar-weekdays span{
	background: #e6ebf0;
	border-color: rgba(20,30,60,.08);
	color: var(--text-muted);
}

body.light .calendar-day{
	background: #e9edf2;
}

body.light .calendar-day.is-today{
	background: rgba(226,28,142,.07);
	border-color: rgba(226,28,142,.14);
}

body.light .calendar-task{
	background: rgba(20,30,60,.035);
}

body.light .calendar-dow{
	color: var(--text-muted);
}

body.light .priority-high{
	background: rgba(242,97,34,.10);
	border-color: rgba(242,97,34,.14);
}

body.light .priority-medium{
	background: rgba(255,183,27,.10);
	border-color: rgba(255,183,27,.14);
}

body.light .priority-low{
	background: rgba(0,174,141,.10);
	border-color: rgba(0,174,141,.14);
}

/* =========================
   GANTT
========================= */
body.light .gantt-shell{
	background: #e9edf2;
}

body.light .gantt-sidebar{
	background: rgba(20,30,60,.02);
	border-right-color: rgba(20,30,60,.06);
}

body.light .gantt-sidebar-head,
body.light .gantt-task{
	border-bottom-color: rgba(20,30,60,.06);
}

body.light .gantt-sidebar-head,
body.light .gantt-head span{
	color: var(--text-muted);
}

body.light .gantt-task span{
	color: var(--text-soft);
}

body.light .gantt-head{
	border-bottom-color: rgba(20,30,60,.06);
	background: linear-gradient(180deg, rgba(20,30,60,.02), rgba(20,30,60,.01));
}

body.light .gantt-head span{
	border-right: 1px solid rgba(20,30,60,.05);
}

body.light .gantt-head span small{
	color: var(--text-muted);
}

body.light .gantt-head span b{
	color: var(--text);
}

body.light .gantt-grid{
	background-image:
		linear-gradient(to right, rgba(0,0,0,.05) 1px, transparent 1px),
		linear-gradient(to bottom, rgba(0,0,0,.05) 1px, transparent 1px);
}

body.light .gantt-bar{
	color: #fff;
}

/* =========================
   MODAL
========================= */
body.light .modal-card{
	background: #eef2f6;
}

body.light .modal-head{
	border-bottom-color: rgba(20,30,60,.06);
}

body.light .modal-backdrop{
	background: rgba(0,0,0,.42);
}

/* =========================
   FLOATING BUTTON
========================= */
body.light .floating-demo-btn{
	color: #fff;
}

/* =========================
   PAGINATION
========================= */
body.light .navigation.pagination .page-numbers{
	background: #e4e8ed;
	border-color: rgba(20,30,60,.08);
	color: var(--text);
}

body.light .navigation.pagination .page-numbers.current{
	color: var(--text);
	background: linear-gradient(135deg, rgba(226,28,142,.22), rgba(193,154,222,.30), rgba(111,207,235,.24));
	border-color: rgba(226,28,142,.16);
}

/* =========================
   SCROLLBAR
========================= */
body.light ::-webkit-scrollbar-thumb{
	background: rgba(20,30,60,.18);
}