/* Root theme (dark default) */
:root {
	--color-bg: #0f1115;
	--color-surface: #1d2229;
	--color-surface-alt: #262d36;
	--color-border: #2f3944;
	--color-accent: #4f8bff;
	--color-accent-hover: #3b74e2;
	--color-danger: #ff5572;
	--color-text: #eef2f6;
	--color-text-dim: #9aa4b1;
	--radius-sm: 4px;
	--radius-md: 8px;
	--radius-lg: 14px;
	--transition: 160ms cubic-bezier(.4,0,.2,1);
	--shadow-sm: 0 1px 2px -1px rgba(0,0,0,.4),0 1px 3px 0 rgba(0,0,0,.25);
	--shadow-md: 0 4px 12px -2px rgba(0,0,0,.5),0 8px 24px -4px rgba(0,0,0,.35);
	--shadow-focus: 0 0 0 3px rgba(79,139,255,.35);
	font-size: 16px;
}

* { box-sizing: border-box; }
html, body { height:100%; }
body { font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif; margin:0; padding:0; background:linear-gradient(145deg,#10141a,#161d24 60%,#121921); color:var(--color-text); -webkit-font-smoothing:antialiased; transition:background .4s, color .4s; }

/* Light theme override */
:root[data-theme='light'] {
	--color-bg: #f5f7fb;
	--color-surface: #ffffff;
	--color-surface-alt: #f0f2f6;
	--color-border: #d9e1ea;
	--color-accent: #2563eb;
	--color-accent-hover: #1d4ed8;
	--color-danger: #dc2626;
	--color-text: #1c2430;
	--color-text-dim: #5a6472;
	--shadow-sm: 0 1px 2px rgba(0,0,0,.08),0 1px 3px rgba(0,0,0,.05);
	--shadow-md: 0 8px 22px -6px rgba(0,0,0,.18),0 4px 12px -2px rgba(0,0,0,.08);
	--shadow-focus: 0 0 0 3px rgba(37,99,235,.35);
}
:root[data-theme='light'] body { background:linear-gradient(145deg,#edf2f8,#e6ecf5 60%,#dde5ef); }
:root[data-theme='light'] nav { background:rgba(255,255,255,.75); }
:root[data-theme='light'] nav a.active { color:#fff; }
:root[data-theme='light'] nav a:hover, :root[data-theme='light'] nav a:focus-visible { background:#e6ebf5; }
:root[data-theme='light'] .segmented { background:#eef2f9; }
:root[data-theme='light'] .segmented .seg-btn.active { background:#1d4ed8; color:#fff; }
:root[data-theme='light'] .surface { box-shadow:var(--shadow-sm); }
:root[data-theme='light'] table tbody tr:hover { background:var(--color-surface-alt); }
:root[data-theme='light'] .fc .fc-daygrid-day:hover { background:rgba(0,0,0,.04); }
:root[data-theme='light'] .fc .fc-daygrid-day.fc-day-today { background:rgba(37,99,235,.15); }

/* Theme toggle */
.theme-toggle { background:var(--color-surface-alt); border:1px solid var(--color-border); color:var(--color-text-dim); padding:.55rem .85rem; border-radius:var(--radius-md); cursor:pointer; display:inline-flex; align-items:center; gap:.5ch; font-size:.8rem; font-weight:500; letter-spacing:.4px; box-shadow:var(--shadow-sm); transition:background var(--transition), color var(--transition), border-color var(--transition); }
.theme-toggle:hover { background:var(--color-accent); color:#fff; border-color:var(--color-accent); }
.theme-toggle svg { width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; }

/* Layout */
nav { position:sticky; top:0; z-index:50; background:rgba(15,17,21,.7); backdrop-filter:blur(16px) saturate(180%); border-bottom:1px solid var(--color-border); display:flex; align-items:center; gap:.5rem; padding:.55rem 1rem; flex-wrap:wrap; }
nav a { position:relative; display:inline-flex; align-items:center; gap:.4ch; padding:.55rem .9rem; font-weight:500; line-height:1; border-radius:var(--radius-md); color:var(--color-text-dim); text-decoration:none; letter-spacing:.3px; transition:color var(--transition), background var(--transition); }
nav a:hover, nav a:focus-visible { color:var(--color-text); background:var(--color-surface); outline:none; }
nav a.active { color:var(--color-text); background:var(--color-accent); }
nav form { margin:0 0 0 auto; }
nav form button { cursor:pointer; background:var(--color-danger); border:none; color:#fff; font-weight:600; padding:.55rem .95rem; border-radius:var(--radius-md); letter-spacing:.4px; box-shadow:var(--shadow-sm); transition:background var(--transition), transform var(--transition); }
nav form button:hover { background:#ff3359; }
nav form button:active { transform:translateY(1px); }

.app-shell { max-width:1500px; margin:0 auto; padding: clamp(.75rem,2vw,1.75rem); width:100%; }
.content { padding:0; }

/* Cards / surfaces */
.surface { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); padding:1.25rem 1.3rem; position:relative; }
.surface + .surface { margin-top:1.1rem; }
.surface-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:.85rem; gap:.75rem; }

h1,h2,h3 { font-weight:600; letter-spacing:.5px; line-height:1.15; margin:0 0 .75rem; }
p { line-height:1.5; margin:.65rem 0; }
small { color:var(--color-text-dim); }

/* Tables */
table { width:100%; border-collapse:collapse; font-size:.9rem; }
th, td { padding:.6rem .75rem; text-align:left; border-bottom:1px solid var(--color-border); vertical-align:top; }
th { font-weight:600; font-size:.75rem; text-transform:uppercase; letter-spacing:.6px; color:var(--color-text-dim); }
tbody tr { transition:background var(--transition); }
tbody tr:hover { background:var(--color-surface-alt); }

/* Forms */
input[type=text], input[type=email], input[type=password], input[type=date], input[type=time], input[type=number], select, textarea {
	width:100%;
	background:var(--color-surface-alt);
	border:1px solid var(--color-border);
	color:var(--color-text);
	padding:.65rem .75rem;
	border-radius:var(--radius-md);
	font:inherit;
	transition:border-color var(--transition), background var(--transition);
}
textarea { min-height: 110px; resize: vertical; line-height:1.35; }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--color-accent); box-shadow:var(--shadow-focus); }
label { font-size:.75rem; text-transform:uppercase; letter-spacing:.6px; font-weight:600; color:var(--color-text-dim); display:block; margin:.85rem 0 .4rem; }
button.primary { background:var(--color-accent); color:#fff; border:none; font:inherit; font-weight:600; padding:.7rem 1.15rem; border-radius:var(--radius-md); cursor:pointer; letter-spacing:.4px; box-shadow:var(--shadow-sm); transition:background var(--transition), transform var(--transition); }
button.primary:hover { background:var(--color-accent-hover); }
button.primary:active { transform:translateY(1px); }
/* Make anchor with .primary look like button */
a.primary { display:inline-flex; align-items:center; justify-content:center; text-decoration:none; background:var(--color-accent); color:#fff !important; padding:.6rem 1rem; border-radius:var(--radius-md); font-weight:600; box-shadow:var(--shadow-sm); }
a.primary:hover { background:var(--color-accent-hover); }
/* Light theme: prefer stronger button backgrounds for contrast */
:root[data-theme='light'] button.primary { background: #1d4ed8; }
:root[data-theme='light'] button.primary:hover { background: #1a43c1; }
:root[data-theme='light'] a.primary { background: #1d4ed8; }
:root[data-theme='light'] a.primary:hover { background: #1a43c1; }

/* Toggle switch */
.switch { position:relative; display:inline-block; width:48px; height:28px; vertical-align:middle; }
.switch input { opacity:0; width:0; height:0; }
.switch .slider { position:absolute; cursor:pointer; top:0; left:0; right:0; bottom:0; background:var(--color-surface-alt); border:1px solid var(--color-border); transition: .2s; border-radius:999px; box-shadow:var(--shadow-sm) inset; }
.switch .slider:before { position:absolute; content:""; height:22px; width:22px; left:3px; top:50%; transform:translateY(-50%); background:#cbd5e1; border-radius:50%; transition:.2s; box-shadow:0 1px 2px rgba(0,0,0,.35); }
.switch input:checked + .slider { background: linear-gradient(135deg, var(--color-accent), var(--color-accent-hover)); border-color: transparent; }
.switch input:checked + .slider:before { transform:translate(20px, -50%); background:#fff; }
.switch input:focus-visible + .slider { box-shadow: var(--shadow-focus); }

/* Calendar adjustments */
#calendar { background:var(--color-surface); padding:1rem; border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); }
.fc .fc-toolbar-title { font-size:1.35rem; font-weight:600; letter-spacing:.5px; }
.fc .fc-button-primary { background:var(--color-surface-alt); border:none; color:var(--color-text); text-transform:capitalize; font-weight:500; padding:.5rem .9rem; border-radius:var(--radius-md); box-shadow:var(--shadow-sm); transition:background var(--transition), color var(--transition); }
.fc .fc-button-primary:hover { background:var(--color-accent); color:#fff; }
.fc .fc-daygrid-day { transition:background var(--transition); cursor:pointer; }
.fc .fc-daygrid-day:hover { background:rgba(255,255,255,.04); }
.fc .fc-daygrid-day.fc-day-today { background:rgba(79,139,255,.12); }
.fc .fc-daygrid-day-frame { position:relative; }
.fc .fc-daygrid-day-top { align-items:flex-start; }
.fc .fc-daygrid-day-number { font-weight:500; padding:.25rem; border-radius:6px; line-height:1; }
.fc .fc-daygrid-day:hover .fc-daygrid-day-number { background:var(--color-surface-alt); }
.fc .fc-event { background:var(--color-accent); border:1px solid var(--color-accent); padding:3px 6px; font-size:.68rem; font-weight:600; letter-spacing:.35px; border-radius:6px; box-shadow:0 2px 4px rgba(0,0,0,.35); position:relative; overflow:visible; text-shadow:0 1px 2px rgba(0,0,0,.35); }
.fc .fc-event:after { display:none; }
.fc .fc-event:hover { filter:brightness(1.08); }
.fc .fc-event.completed { background:linear-gradient(135deg,#5a5f66,#43494f); border:1px solid #5d646b; color:#e5e8ea; }
.fc .fc-event .badge { background:rgba(0,0,0,.35); color:#fff; font-size:.55rem; padding:2px 4px; border-radius:4px; margin-left:.3rem; font-weight:600; letter-spacing:.5px; }
/* Multi-line event enhancements */
.fc .fc-event .ev-desc { display:block; font-size:.68rem; font-weight:700; line-height:1.25; word-break:break-word; }
.fc .fc-event .ev-address { display:block; font-size:.56rem; font-weight:600; line-height:1.15; margin-top:2px; text-wrap:balance; opacity:.9; }
.fc .fc-event .ev-meta { display:block; font-size:.52rem; font-weight:600; margin-top:2px; line-height:1.1; opacity:.95; }
.fc .fc-event.completed .ev-meta { opacity:1; }
.fc .fc-event.completed .badge { background:rgba(0,0,0,.35); }
.fc .fc-event .ev-study { opacity:.85; }
.fc .fc-event .ev-complete { font-size:.6rem; }

/* Light theme calendar tweaks */
:root[data-theme='light'] .fc .fc-daygrid-day:hover { background:rgba(0,0,0,.035); }
:root[data-theme='light'] .fc .fc-daygrid-day.fc-day-today { background:rgba(37,99,235,.18); }
:root[data-theme='light'] .fc .fc-event { box-shadow:0 2px 4px rgba(0,0,0,.15); }
:root[data-theme='light'] .fc .fc-event .badge { background:rgba(255,255,255,.55); color:var(--color-text); }
/* Light mode: ensure good contrast for "secondary-looking" primary buttons that used a light background inline */
:root[data-theme='light'] a.primary[style*="var(--color-surface-alt)"],
:root[data-theme='light'] button.primary[style*="var(--color-surface-alt)"] {
	background: var(--color-accent) !important;
	color: #fff !important;
	border-color: transparent !important;
}

/* Modal */
.modal { animation:fadeIn .25s ease; }
.modal .surface-modal { background:var(--color-surface); border:1px solid var(--color-border); border-radius:var(--radius-lg); box-shadow:var(--shadow-md); width:100%; max-width:680px; margin:clamp(3rem,8vh,6rem) auto; padding:1.25rem 1.35rem 1.6rem; position:relative; }
.modal h2 { margin-top:0; font-size:1.15rem; }
.close-btn { position:absolute; top:.6rem; right:.6rem; border:none; background:var(--color-surface-alt); color:var(--color-text-dim); width:34px; height:34px; border-radius:50%; cursor:pointer; display:grid; place-items:center; font-size:1.1rem; line-height:1; transition:background var(--transition), color var(--transition), transform var(--transition); }
.close-btn:hover { background:var(--color-accent); color:#fff; }

#taskChecklist li { display:flex; align-items:center; gap:.65rem; padding:.55rem .6rem; background:var(--color-surface-alt); margin:.4rem 0; border:1px solid var(--color-border); border-radius:var(--radius-md); font-size:.85rem; line-height:1.3; }
#taskChecklist input[type=checkbox] { width:18px; height:18px; accent-color:var(--color-accent); cursor:pointer; }

/* Utilities */
.muted { color:var(--color-text-dim); }
.status-badge { display:inline-block; padding:.25rem .5rem; border-radius:12px; font-size:.55rem; font-weight:600; letter-spacing:.4px; line-height:1; min-width:70px; text-align:center; border:1px solid var(--color-border); background:var(--color-surface-alt); color:var(--color-text); cursor:pointer; }
.status-badge.completed { background:linear-gradient(135deg,#16a34a,#15803d); border-color:#15803d; }
.status-badge.pending:hover, .status-badge.completed:hover { filter:brightness(1.1); }
.stack-sm > * + * { margin-top:.5rem; }
.grid { display:grid; gap:1rem; }
.grid.cols-2 { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); }

/* Segmented control for Trials vs Assets */
.segmented { display:inline-flex; background:var(--color-surface); border:1px solid var(--color-border); border-radius:999px; padding:3px; box-shadow:var(--shadow-sm); }
.segmented .seg-btn { display:inline-flex; align-items:center; gap:.35rem; padding:.45rem .7rem; border:none; background:transparent; color:var(--color-text-dim); font-weight:600; border-radius:999px; cursor:pointer; }
.segmented .seg-btn.active { background:var(--color-accent); color:#fff; }
.segmented .seg-btn svg { opacity:.9; }

/* Settings dropdown */
details.nav-settings { position:relative; }
details.nav-settings summary { list-style:none; cursor:pointer; padding:.55rem .9rem; border-radius:var(--radius-md); color:var(--color-text-dim); font-weight:600; display:inline-flex; align-items:center; gap:.4rem; }
details.nav-settings[open] summary, details.nav-settings summary:hover { background:var(--color-surface); color:var(--color-text); }
details.nav-settings .menu { position:absolute; top:100%; left:0; background:var(--color-surface); border:1px solid var(--color-border); border-radius:10px; box-shadow:var(--shadow-md); padding:.4rem; display:grid; min-width:200px; z-index:60; }
details.nav-settings .menu a { padding:.5rem .65rem; border-radius:8px; color:var(--color-text); }
details.nav-settings .menu a:hover { background:var(--color-surface-alt); }

/* Responsive */
@media (max-width: 900px){
	nav { padding:.55rem .75rem; }
	#calendar { padding:.6rem .5rem; }
	.fc .fc-toolbar { flex-wrap:wrap; gap:.6rem; }
	.modal .surface-modal { margin:2.5rem 1rem; }
}
@media (max-width: 600px){
	nav a { padding:.5rem .7rem; font-size:.8rem; }
	h1 { font-size:1.4rem; }
	.fc .fc-toolbar-title { font-size:1.1rem; }
	#calendarControls { gap:.5rem; }
	#calendarControls .primary, #calendarControls select, #calendarControls label { font-size:.78rem !important; }
	#calendarControls { flex-wrap: wrap; }
	/* Stack filter controls above calendar */
	#calendar + #weekView, #calendar ~ div { max-width:100%; }
	/* Make FullCalendar events easier to tap */
	.fc .fc-event { padding:6px 7px; font-size:.78rem; border-radius:10px; }
	.fc .fc-event .ev-address { font-size:.72rem; }
	.fc .fc-event .ev-meta { font-size:.62rem; }
	/* Weekly matrix container scrolls horizontally on small screens */
	#weekDays { overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; scrollbar-color: auto; }
	#weekDays > div { min-width: 100%; }
	#weekDays::after { content:""; display:block; height:1px; }
	#weekDays .wm-cell { padding:.6rem; }
	/* Modal fits phone screens nicely */
	.modal .surface-modal { margin:1.25rem .75rem; padding:1rem; border-radius:12px; }
	#taskChecklist li { padding:.7rem .75rem; font-size:.95rem; }
}

@keyframes fadeIn { from { opacity:0; transform:translateY(4px);} to { opacity:1; transform:translateY(0);} }