/* ===== RESET & BASE ===== */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --bg:        #0f1117;
  --bg2:       #161b27;
  --card:      #1e2535;
  --card2:     #242d42;
  --border:    #2d3a55;
  --accent:    #6c63ff;
  --text:      #e8eaf6;
  --muted:     #7c8db5;
  --green:     #27ae60;
  --orange:    #e67e22;
  --red:       #e74c3c;
  --blue:      #2980b9;
  --yellow:    #f1c40f;
  --radius:    14px;
  --header-h:  62px;
}

html { scroll-behavior: smooth; }

body {
  font-family: 'Segoe UI', system-ui, sans-serif;
  background: var(--bg);
  color: var(--text);
  height: 100vh;
  overflow: hidden;          /* cada página scrollea por su cuenta */
}

/* ===== HEADER / TABS ===== */
.header {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 200;
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 1.5rem;
  background: rgba(22, 27, 39, 0.96);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  border-bottom: 1px solid var(--border);
  gap: 1.5rem;
}

.logo {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.1rem;
  font-weight: 800;
  color: var(--accent);
  white-space: nowrap;
  flex-shrink: 0;
}
.logo i { font-size: 1.35rem; }

/* ── TABS ── */
.tabs {
  display: flex;
  gap: .2rem;
  flex: 1;
  justify-content: center;
}

.tab {
  display: flex;
  align-items: center;
  gap: .45rem;
  padding: .45rem 1.1rem;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--muted);
  font-size: .87rem;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s, color .2s;
  white-space: nowrap;
}
.tab:hover { background: var(--card); color: var(--text); }
.tab.active {
  background: rgba(108,99,255,.18);
  color: var(--accent);
  box-shadow: inset 0 0 0 1px rgba(108,99,255,.35);
}
.tab i { font-size: .9rem; }

/* ── USER ── */
.user-info {
  display: flex;
  align-items: center;
  gap: .6rem;
  flex-shrink: 0;
}
.user-avatar { font-size: 2rem; color: var(--accent); }
.user-text { display: flex; flex-direction: column; line-height: 1.25; }
.user-name  { font-weight: 700; font-size: .88rem; }
.user-grade { font-size: .72rem; color: var(--muted); }

/* ===== PAGES ===== */
.page {
  display: none;
  position: fixed;
  top: var(--header-h);
  left: 0; right: 0; bottom: 0;
  overflow-y: scroll;
  overscroll-behavior-y: contain;
  -webkit-overflow-scrolling: touch;
}
.page.active { display: block; }

/* Scrollbar */
.page::-webkit-scrollbar { width: 7px; }
.page::-webkit-scrollbar-track { background: var(--bg); }
.page::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }

/* Inner container for non-inicio pages */
.page-inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 2.5rem 2rem 4rem;
}

.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 2rem;
  gap: 1rem;
  flex-wrap: wrap;
}
.page-title {
  font-size: 1.6rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: .6rem;
}
.page-title i { color: var(--accent); }
.page-subtitle { color: var(--muted); font-size: .9rem; margin-top: .3rem; }

.pill {
  padding: .35rem 1rem;
  border-radius: 999px;
  font-size: .8rem;
  font-weight: 700;
  background: rgba(108,99,255,.15);
  color: var(--accent);
  border: 1px solid rgba(108,99,255,.3);
  white-space: nowrap;
  align-self: center;
}
.pill-warn {
  background: rgba(231,76,60,.15);
  color: var(--red);
  border-color: rgba(231,76,60,.3);
}

/* ===== ── INICIO ── ===== */
#page-inicio {
  padding: 0 0 4rem;
}

/* Hero */
.inicio-hero {
  background: linear-gradient(130deg, #181e32 0%, #1e274a 100%);
  border-bottom: 1px solid var(--border);
  padding: 3rem 2.5rem 2.5rem;
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 1.5rem;
}
.hero-ia-wrap {
  min-width: 480px;
  flex-shrink: 0;
  position: relative;
  z-index: 1;
}
.hero-ia-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  padding: .65rem 2rem;
  width: 100%;
  background: rgba(108,99,255,.18);
  border: 1.5px solid rgba(255,255,255,.55);
  border-radius: 999px;
  color: #c4c0ff;
  font-size: .9rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  transition: background .18s, color .18s;
  box-shadow:
    0 0 8px 2px rgba(255,255,255,.3),
    0 0 22px 5px rgba(210,210,255,.12);
}
.hero-ia-btn:hover {
  background: rgba(108,99,255,.35);
  color: #fff;
}
.hero-ia-input-row {
  display: none;
  align-items: center;
  background: rgba(108,99,255,.13);
  border: 1.5px solid rgba(108,99,255,.6);
  border-radius: 999px;
  padding: .3rem .3rem .3rem 1.2rem;
  gap: .4rem;
}
.hero-ia-wrap.open .hero-ia-btn       { display: none; }
.hero-ia-wrap.open .hero-ia-input-row { display: flex; }
.hero-ia-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #fff;
  font-size: .9rem;
  min-width: 0;
}
.hero-ia-input::placeholder { color: rgba(196,192,255,.55); }
.hero-ia-send {
  background: rgba(108,99,255,.7);
  border: none;
  border-radius: 999px;
  color: #fff;
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .88rem;
  flex-shrink: 0;
  transition: background .15s;
}
.hero-ia-send:hover { background: rgba(108,99,255,1); }
.inicio-hero::after {
  content: '';
  position: absolute;
  top: -80px; right: -80px;
  width: 320px; height: 320px;
  background: radial-gradient(circle, rgba(108,99,255,.15) 0%, transparent 70%);
  border-radius: 50%;
  pointer-events: none;
}
.hero-date {
  font-size: .82rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .1em;
  margin-bottom: .4rem;
}
.hero-title {
  font-size: 2.6rem;
  font-weight: 900;
  margin-bottom: .6rem;
  line-height: 1.1;
}
.wave { display: inline-block; transform-origin: 70% 70%; animation: wave 2.5s infinite; }
@keyframes wave {
  0%,100%{ transform:rotate(0); }
  20%    { transform:rotate(22deg); }
  40%    { transform:rotate(-10deg); }
  60%    { transform:rotate(18deg); }
}
.hero-sub {
  color: var(--muted);
  font-size: .98rem;
  max-width: 560px;
  margin-bottom: 1.5rem;
}
.hero-badges { display: flex; gap: .75rem; flex-wrap: wrap; }
.badge {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .35rem .95rem;
  border-radius: 999px;
  font-size: .78rem;
  font-weight: 700;
}
.badge-warning { background:rgba(231,76,60,.18); color:#e74c3c; border:1px solid rgba(231,76,60,.3); }
.badge-info    { background:rgba(41,128,185,.18); color:#5dade2; border:1px solid rgba(41,128,185,.3); }
.badge-success { background:rgba(39,174,96,.18);  color:#2ecc71; border:1px solid rgba(39,174,96,.3); }

/* Stats */
.inicio-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  padding: 1.5rem 2.5rem;
  border-bottom: 1px solid var(--border);
}
.stat-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.1rem 1.3rem;
  display: flex;
  align-items: center;
  gap: .9rem;
  transition: transform .18s;
}
.stat-card:hover { transform: translateY(-3px); }
.stat-icon {
  width: 46px; height: 46px;
  border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem; flex-shrink: 0;
}
.stat-icon.purple { background:rgba(108,99,255,.2); color:var(--accent); }
.stat-icon.orange { background:rgba(230,126,34,.2);  color:var(--orange); }
.stat-icon.green  { background:rgba(39,174,96,.2);   color:var(--green); }
.stat-icon.red    { background:rgba(231,76,60,.2);   color:var(--red); }
.stat-info h3 { font-size: 1.65rem; font-weight: 900; line-height: 1; }
.stat-info p  { font-size: .78rem; color: var(--muted); margin-top: .15rem; }

/* Acceso rápido */
.inicio-label {
  padding: 1.5rem 2.5rem .6rem;
  font-size: .78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--muted);
}

.quick-nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
  padding: 0 2.5rem;
}
.qnav-btn {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-left: 4px solid var(--c, var(--accent));
  border-radius: var(--radius);
  padding: 1.1rem 1.3rem;
  cursor: pointer;
  text-align: left;
  color: var(--text);
  transition: background .2s, transform .2s, box-shadow .2s;
}
.qnav-btn:hover {
  background: var(--card2);
  transform: translateX(4px);
  box-shadow: 0 4px 20px rgba(0,0,0,.3);
}
.qnav-icon {
  width: 48px; height: 48px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--c) 20%, transparent);
  color: var(--c);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}
.qnav-text { flex: 1; }
.qnav-text h3 { font-size: .95rem; font-weight: 700; }
.qnav-text p  { font-size: .78rem; color: var(--muted); margin-top: .2rem; }
.qnav-arrow   { color: var(--muted); font-size: .85rem; flex-shrink: 0; transition: transform .2s; }
.qnav-btn:hover .qnav-arrow { transform: translateX(4px); color: var(--c); }

/* Actividades inicio */
.inicio-actividades {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  padding: 0 2.5rem 2rem;
}
.act-item {
  display: flex;
  align-items: center;
  gap: .8rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .85rem 1rem;
}
.act-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
.act-dot.green  { background:var(--green);  box-shadow:0 0 8px var(--green); }
.act-dot.blue   { background:var(--blue);   box-shadow:0 0 8px var(--blue); }
.act-dot.orange { background:var(--orange); box-shadow:0 0 8px var(--orange); }
.act-dot.purple { background:var(--accent); box-shadow:0 0 8px var(--accent); }
.act-body { flex:1; }
.act-body strong { font-size:.88rem; font-weight:600; display:block; }
.act-body span   { font-size:.75rem; color:var(--muted); }
.act-status {
  font-size:.72rem; font-weight:700;
  padding:.22rem .65rem; border-radius:999px; white-space:nowrap;
}
.act-status.done     { background:rgba(39,174,96,.15);  color:#2ecc71; }
.act-status.upcoming { background:rgba(41,128,185,.15); color:#5dade2; }
.act-status.exam-st  { background:rgba(231,76,60,.15);  color:#e74c3c; }


/* ===== ── MATERIAS ── ===== */
.materias-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 1.2rem;
}
.mat-card {
  flex: 1 1 280px;
  max-width: calc(33.333% - .8rem);
  min-width: 0;
}
.mat-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-top: 3px solid var(--c, var(--accent));
  border-radius: var(--radius);
  padding: 1.3rem;
  transition: transform .2s, box-shadow .2s;
}
.mat-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,.4); }
.mat-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .9rem;
}
.mat-icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: color-mix(in srgb, var(--c) 20%, transparent);
  color: var(--c);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.2rem;
}
.mat-badge {
  font-size: .7rem; font-weight: 700;
  padding: .22rem .65rem; border-radius: 999px;
}
.mat-badge.pending { background:rgba(231,76,60,.15); color:#e74c3c; }
.mat-badge.exam    { background:rgba(230,126,34,.15); color:#e67e22; }
.mat-badge.ok      { background:rgba(39,174,96,.15);  color:#2ecc71; }
.mat-badge.project { background:rgba(108,99,255,.15); color:var(--accent); }
.mat-card h3  { font-size:1.1rem; font-weight:800; margin-bottom:.25rem; }
.mat-prof     { font-size:.8rem; color:var(--muted); margin-bottom:.7rem; }
.mat-prof i   { margin-right:.3rem; }
.mat-details  { display:flex; gap:1rem; flex-wrap:wrap; margin-bottom:.9rem; }
.mat-details span { font-size:.77rem; color:var(--muted); }
.mat-details i    { margin-right:.25rem; color:var(--accent); }
.mat-progress {
  background: var(--border);
  border-radius: 999px; height:6px; margin-bottom:.3rem;
}
.mat-progress-bar {
  height:100%; border-radius:999px;
  background: var(--c);
  transition: width .8s ease;
}
.mat-progress-label {
  display:flex; justify-content:space-between;
  font-size:.72rem; color:var(--muted);
}


/* ===== ── TAREAS ── ===== */
.tareas-cols {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
  margin-bottom: 1.2rem;
}
.tareas-col {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.2rem;
  min-height: 320px;
}
.col-head {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 1rem;
  padding-bottom: .7rem;
  border-bottom: 1px solid var(--border);
}
.urgent-head { color: var(--red); }
.week-head   { color: var(--orange); }
.done-head   { color: var(--green); }
.col-count {
  margin-left: auto;
  background: var(--card2);
  border-radius: 999px;
  padding: .1rem .55rem;
  font-size: .75rem;
  color: var(--muted);
}

.task-list { list-style:none; display:flex; flex-direction:column; gap:.6rem; }
.task-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: .8rem .9rem;
  transition: background .2s;
  cursor: pointer;
}
.task-item:hover { background: #2a344d; }
.task-item.urgent { border-left:3px solid var(--red); }

.task-check input[type=checkbox] { display:none; }
.task-check label {
  width:20px; height:20px;
  border:2px solid var(--border);
  border-radius:6px;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:all .2s; flex-shrink:0;
}
.task-check input:checked + label { background:var(--accent); border-color:var(--accent); }
.task-check input:checked + label::after { content:'✓'; color:#fff; font-size:.78rem; font-weight:800; }
.task-item.done-task { opacity:.55; }
.task-item.done-task .task-body h4 { text-decoration:line-through; }

.task-body { flex:1; }
.task-body h4 { font-size:.88rem; font-weight:600; }
.task-body p  { font-size:.74rem; color:var(--muted); margin-top:.2rem; }
.priority-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
.priority-dot.red    { background:var(--red); }
.priority-dot.orange { background:var(--orange); }
.priority-dot.yellow { background:var(--yellow); }

.no-tasks-msg {
  display:flex; align-items:center; gap:.5rem;
  color:var(--muted); font-size:.82rem; padding:.5rem .2rem;
}

.btn-add-task {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .7rem 1.5rem;
  background: rgba(108,99,255,.15);
  border: 1px solid rgba(108,99,255,.3);
  border-radius: 10px;
  color: var(--accent);
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
  transition: all .2s;
}
.btn-add-task:hover {
  background: rgba(108,99,255,.28);
  transform: translateY(-1px);
}


/* ===== ── PROYECTOS ── ===== */
.proyectos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 1.4rem;
}
.proy-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform .2s, box-shadow .2s;
}
.proy-card:hover { transform:translateY(-5px); box-shadow:0 12px 40px rgba(0,0,0,.4); }
.proy-banner {
  display:flex; align-items:center; gap:1rem;
  padding:1.3rem 1.5rem; color:#fff;
}
.proy-banner i   { font-size:2rem; }
.proy-banner h3  { font-size:1.05rem; font-weight:800; }
.proy-banner span{ font-size:.8rem; opacity:.85; }
.proy-body { padding:1.3rem 1.5rem; }
.proy-desc { font-size:.85rem; color:var(--muted); margin-bottom:1rem; line-height:1.6; }
.proy-tags { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:1rem; }
.ptag {
  font-size:.75rem; font-weight:600;
  padding:.25rem .7rem; border-radius:999px;
  background:var(--card2); border:1px solid var(--border);
  color:var(--muted);
}
.ptag.warn { color:var(--orange); border-color:rgba(230,126,34,.3); background:rgba(230,126,34,.1); }
.proy-progress-wrap {
  display:flex; align-items:center; gap:.8rem; margin-bottom:1rem;
}
.proy-progress-bar {
  flex:1; background:var(--border); border-radius:999px; height:8px; overflow:hidden;
}
.proy-fill { height:100%; border-radius:999px; transition:width .8s ease; }
.proy-progress-wrap span { font-size:.82rem; font-weight:800; color:var(--text); width:34px; text-align:right; }
.proy-stages { display:flex; flex-direction:column; gap:.4rem; }
.stage {
  display:flex; align-items:center; gap:.6rem;
  font-size:.8rem; padding:.4rem .5rem; border-radius:7px;
}
.done-stage    { color:var(--green);  background:rgba(39,174,96,.08); }
.current-stage { color:var(--orange); background:rgba(230,126,34,.1);  font-weight:700; }
.pending-stage { color:var(--muted);  background:transparent; }


/* ===== ── CALENDARIO ── ===== */
.cal-legend {
  display:flex; gap:1rem; flex-wrap:wrap; align-self:center;
}
.leg-item { display:flex; align-items:center; gap:.4rem; font-size:.78rem; color:var(--muted); }
.leg-dot  { width:9px; height:9px; border-radius:50%; }

.cal-layout {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 2rem;
  align-items: start;
}

/* Mini calendario */
.cal-box {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 1.3rem;
  min-width: 290px;
}
.cal-header-row {
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:.9rem; font-weight:700; font-size:.95rem;
}
.cal-header-row button {
  background:none; border:none; color:var(--muted);
  cursor:pointer; font-size:1rem; padding:.2rem .5rem;
  border-radius:6px; transition:all .2s;
}
.cal-header-row button:hover { background:var(--border); color:var(--text); }
.cal-weekdays {
  display:grid; grid-template-columns:repeat(7,1fr);
  text-align:center; font-size:.7rem; font-weight:700;
  color:var(--muted); margin-bottom:.4rem; gap:2px;
}
.cal-days {
  display:grid; grid-template-columns:repeat(7,1fr); gap:3px;
}
.cal-day {
  aspect-ratio:1; display:flex; align-items:center; justify-content:center;
  font-size:.8rem; border-radius:8px; cursor:pointer;
  transition:all .18s; position:relative;
}
.cal-day:hover:not(.empty) { background:var(--border); }
.cal-day.today  { background:var(--accent); color:#fff; font-weight:800; }
.cal-day.has-event::after {
  content:''; position:absolute; bottom:3px; left:50%; transform:translateX(-50%);
  width:4px; height:4px; border-radius:50%; background:var(--orange);
}
.cal-day.today.has-event::after { background:#fff; }
.cal-day.empty  { cursor:default; color:transparent; }
.cal-day.past   { color:var(--muted); opacity:.45; }

/* Event list */
.events-box { }
.events-title {
  font-size:.78rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.1em; color:var(--muted); margin-bottom:1rem;
}
.events-list { display:flex; flex-direction:column; gap:.8rem; }
.ev {
  display:flex; align-items:center; gap:1.1rem;
  background:var(--card); border:1px solid var(--border);
  border-radius:10px; padding:.9rem 1.1rem;
  transition:background .2s;
}
.ev { cursor: context-menu; }
.ev:hover { background:var(--card2); }
.ev-date {
  display:flex; flex-direction:column; align-items:center;
  min-width:40px; text-align:center;
  padding:.4rem .5rem; border-radius:9px;
}
.ev-day   { font-size:1.4rem; font-weight:900; line-height:1; }
.ev-month { font-size:.62rem; font-weight:800; text-transform:uppercase; opacity:.8; }
.exam-date { background:rgba(231,76,60,.15); color:#e74c3c; }
.task-date { background:rgba(230,126,34,.15); color:#e67e22; }
.proj-date { background:rgba(108,99,255,.15); color:var(--accent); }
.act-date  { background:rgba(41,128,185,.15);  color:#5dade2; }
.ev-info   { flex:1; }
.ev-info h4{ font-size:.9rem; font-weight:700; }
.ev-info p { font-size:.75rem; color:var(--muted); margin-top:.2rem; }
.ev-pill {
  font-size:.7rem; font-weight:700;
  padding:.22rem .65rem; border-radius:999px; white-space:nowrap;
}
.exam-pill { background:rgba(231,76,60,.15); color:#e74c3c; }
.task-pill { background:rgba(230,126,34,.15); color:#e67e22; }
.proj-pill { background:rgba(108,99,255,.15); color:var(--accent); }
.act-pill  { background:rgba(41,128,185,.15); color:#5dade2; }


/* ===== CONTEXT MENU ===== */
.ctx-menu {
  position: fixed;
  z-index: 600;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: .4rem;
  min-width: 190px;
  box-shadow: 0 12px 40px rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transform: scale(.94);
  transform-origin: top left;
  transition: opacity .15s, transform .15s;
}
.ctx-menu.open {
  opacity: 1;
  pointer-events: all;
  transform: scale(1);
}
.ctx-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  width: 100%;
  padding: .6rem .85rem;
  background: none;
  border: none;
  border-radius: 7px;
  color: var(--text);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  text-align: left;
  transition: background .15s;
}
.ctx-item i { width: 14px; text-align: center; color: var(--muted); }
.ctx-item:hover { background: var(--card2); }
.ctx-item.ctx-danger { color: var(--red); }
.ctx-item.ctx-danger i { color: var(--red); }
.ctx-item.ctx-danger:hover { background: rgba(231,76,60,.12); }
.ctx-divider { height: 1px; background: var(--border); margin: .3rem .4rem; }

/* ===== BOTONES CABECERA EXÁMENES ===== */
.examenes-header-btns {
  display: flex;
  align-items: center;
  gap: .6rem;
}

.btn-completados-examen {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  height: 40px;
  padding: 0 1.1rem;
  border-radius: 10px;
  border: none;
  background: rgba(39,174,96,.14);
  color: #2ecc71;
  font-size: .82rem;
  font-weight: 700;
  letter-spacing: .03em;
  cursor: pointer;
  transition: all .2s;
  flex-shrink: 0;
  align-self: center;
  box-shadow:
    inset 0 0 0 1px rgba(46,204,113,.3),
    0 0 6px 1px rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.15) !important;
}
.btn-completados-examen:hover {
  background: rgba(39,174,96,.28);
  transform: scale(1.04);
  box-shadow:
    inset 0 0 0 1px rgba(46,204,113,.5),
    0 0 10px 2px rgba(46,204,113,.12);
}

/* ===== BOTÓN + ===== */
.btn-add-plus {
  width: 40px; height: 40px;
  border-radius: 10px;
  border: none;
  background: rgba(108,99,255,.18);
  color: var(--accent);
  font-size: 1.1rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .2s;
  flex-shrink: 0;
  align-self: center;
  box-shadow: inset 0 0 0 1px rgba(108,99,255,.3);
}
.btn-add-plus:hover {
  background: rgba(108,99,255,.32);
  transform: scale(1.08);
}

/* ===== MODAL ===== */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(6px);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s;
}
.modal-overlay.open {
  opacity: 1;
  pointer-events: all;
}

.modal {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 18px;
  width: 100%;
  max-width: 420px;
  padding: 1.8rem;
  box-shadow: 0 24px 60px rgba(0,0,0,.6);
  transform: translateY(18px) scale(.97);
  transition: transform .25s cubic-bezier(.34,1.56,.64,1);
}
.modal-overlay.open .modal {
  transform: translateY(0) scale(1);
}

.modal-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1.4rem;
}
.modal-header h3 {
  font-size: 1.05rem;
  font-weight: 800;
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--text);
}
.modal-header h3 i { color: var(--accent); }

.modal-close {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1rem;
  cursor: pointer;
  padding: .3rem .5rem;
  border-radius: 7px;
  transition: all .18s;
}
.modal-close:hover { background: var(--card2); color: var(--text); }

.modal-input {
  width: 100%;
  background: #2a344d;
  border: 1px solid #3a4d70;
  border-radius: 10px;
  padding: .85rem 1.1rem;
  font-size: .95rem;
  color: var(--text);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  font-family: inherit;
}
.modal-input::placeholder { color: #4e6080; }
.modal-input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(108,99,255,.18);
}

.modal-label {
  display: block;
  font-size: .78rem;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: .45rem;
}
.modal-select {
  appearance: none;
  cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%237c8db5' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  padding-right: 2.5rem;
}
.modal-select option {
  background: #1e2535;
  color: var(--text);
}
.modal-date::-webkit-calendar-picker-indicator {
  filter: invert(.5) sepia(1) saturate(0);
  cursor: pointer;
}

.tarea-file-label {
  display: flex;
  align-items: center;
  gap: .55rem;
  width: 100%;
  padding: .65rem .9rem;
  background: #1a2236;
  border: 1px dashed var(--border);
  border-radius: 8px;
  color: var(--muted);
  font-size: .85rem;
  cursor: pointer;
  transition: border-color .15s, color .15s;
}
.tarea-file-label:hover {
  border-color: var(--accent);
  color: var(--text);
}
.tarea-file-label.has-file {
  border-color: var(--accent);
  border-style: solid;
  color: var(--text);
}
.tarea-file-label i { color: var(--accent); flex-shrink: 0; }
#tareaFileName { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Preview miniatura en tarea */
.task-attachment {
  margin-top: .35rem;
  display: flex;
  align-items: center;
  gap: .45rem;
}
.task-attachment img {
  width: 36px; height: 36px;
  object-fit: cover;
  border-radius: 5px;
  border: 1px solid var(--border);
  cursor: pointer;
}
.task-attachment a {
  font-size: .75rem;
  color: var(--accent);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: .3rem;
}
.task-attachment a:hover { text-decoration: underline; }

/* ── URL rows en modal nueva tarea ── */
.tarea-urls-container { display:flex; flex-direction:column; gap:.45rem; }
.tarea-url-row {
  display: flex;
  align-items: center;
  gap: .4rem;
}
.tarea-url-row .modal-input {
  flex: 1;
  margin: 0;
}
.tarea-url-btn {
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 7px;
  border: 1px solid var(--border);
  background: #1a2236;
  color: var(--muted);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
  font-size: .8rem;
  transition: background .15s, color .15s, border-color .15s;
}
.tarea-url-btn:hover { background: rgba(108,99,255,.2); color: var(--accent); border-color: var(--accent); }
.tarea-url-btn.add-btn { color: var(--accent); border-color: rgba(108,99,255,.4); }
.tarea-url-btn.remove-btn { color: var(--red); border-color: rgba(255,80,80,.3); }
.tarea-url-btn.remove-btn:hover { background: rgba(255,80,80,.15); border-color: var(--red); }

/* ── Modal detalle tarea ── */
.modal-dt { max-width: 430px; }
.dt-nombre-titulo { font-size: 1rem; font-weight: 700; color: var(--text); word-break: break-word; }
.dt-meta { font-size: .82rem; color: var(--muted); margin-bottom: .25rem; display:flex; align-items:center; gap:.4rem; }
.dt-archivos { margin-top: .6rem; display: flex; flex-direction: column; gap: .35rem; }
.dt-archivo-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-size: .8rem;
  color: var(--accent);
  background: rgba(108,99,255,.08);
  border: 1px solid rgba(108,99,255,.2);
  border-radius: 7px;
  padding: .35rem .6rem;
}
.dt-archivo-item i { flex-shrink:0; }
.dt-archivo-item a { color: var(--accent); text-decoration:none; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dt-archivo-item a:hover { text-decoration: underline; }
.dt-inline-box { margin-top: .8rem; }
.dt-inline-box .modal-input { margin-bottom: .4rem; }
.dt-inline-actions { display:flex; gap:.4rem; }
.dt-btn-sm {
  padding: .35rem .8rem;
  border-radius: 7px;
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: .78rem;
  font-weight: 600;
  cursor: pointer;
  transition: opacity .15s;
}
.dt-btn-sm:hover { opacity: .85; }
.dt-btn-sm-cancel {
  background: transparent;
  border: 1px solid var(--border);
  color: var(--muted);
}
.dt-btn-sm-cancel:hover { color: var(--text); border-color: var(--text); opacity: 1; }
.dt-footer {
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: flex-start;
}
.dt-accion-btn {
  display: flex;
  align-items: center;
  gap: .4rem;
  padding: .45rem .9rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: #1a2236;
  color: var(--text);
  font-size: .8rem;
  cursor: pointer;
  transition: background .15s, border-color .15s;
  white-space: nowrap;
}
.dt-accion-btn:hover { background: #232f47; border-color: var(--accent); }
.dt-accion-danger { border-color: rgba(255,80,80,.3); color: var(--red); }
.dt-accion-danger:hover { background: rgba(255,80,80,.1); border-color: var(--red); }

.modal-footer {
  display: flex;
  justify-content: flex-end;
  gap: .7rem;
  margin-top: 1.4rem;
}
.modal-btn-cancel {
  padding: .55rem 1.2rem;
  border-radius: 9px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--muted);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  transition: all .18s;
}
.modal-btn-cancel:hover { background: var(--card2); color: var(--text); }

.modal-btn-confirm {
  padding: .55rem 1.3rem;
  border-radius: 9px;
  border: none;
  background: var(--accent);
  color: #fff;
  font-size: .88rem;
  font-weight: 700;
  cursor: pointer;
  display: flex; align-items: center; gap: .4rem;
  transition: all .18s;
}
.modal-btn-confirm:hover { background: var(--accent2); transform: translateY(-1px); }

/* ===== EMPTY STATE ===== */
.empty-state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .9rem;
  padding: 3.5rem 2rem;
  color: var(--muted);
  text-align: center;
}
.empty-state i  { font-size: 2.8rem; opacity: .35; }
.empty-state p  { font-size: .92rem; }

/* ===== APUNTES ===== */
#page-apuntes {
  display: none;
  flex-direction: column;
}
#page-apuntes.active { display: flex; }

.apuntes-page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 2rem 2.5rem 1.2rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--bg2);
  position: sticky;
  top: 0;
  z-index: 10;
}

.apuntes-container {
  flex: 1;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}

.apuntes-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  height: 100%;
  min-height: 300px;
  color: var(--muted);
  text-align: center;
}
.apuntes-empty i  { font-size: 3rem; opacity: .3; }
.apuntes-empty p  { font-size: .95rem; }

/* Fila por materia */
.apunte-row {
  border-bottom: 1px solid var(--border);
  border-left: 4px solid var(--c, var(--accent));
  transition: background .15s;
}

.apunte-row-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 2.5rem;
  cursor: pointer;
  user-select: none;
}
.apunte-row-header:hover { background: rgba(255,255,255,.03); }

.apunte-row-icon {
  width: 38px; height: 38px;
  border-radius: 10px;
  background: color-mix(in srgb, var(--c, var(--accent)) 18%, transparent);
  color: var(--c, var(--accent));
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.apunte-row-title {
  font-size: 1rem;
  font-weight: 700;
  flex: 1;
}

.apunte-row-badge {
  font-size: .72rem;
  font-weight: 700;
  padding: .18rem .65rem;
  border-radius: 999px;
  background: var(--card2);
  color: var(--muted);
  border: 1px solid var(--border);
}

.apunte-row-chevron {
  color: var(--muted);
  font-size: .8rem;
  transition: transform .22s;
  margin-left: .5rem;
}
.apunte-row.open .apunte-row-chevron { transform: rotate(90deg); }

.apunte-row-body {
  display: none;
  padding: 1rem 2.5rem 1.5rem calc(2.5rem + 38px + 1rem);
  background: rgba(0,0,0,.12);
  border-top: 1px solid var(--border);
}
.apunte-row.open .apunte-row-body { display: block; }

.apunte-body-empty {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--muted);
  font-size: .85rem;
  padding: .5rem 0;
}
.apunte-body-empty i { opacity: .5; }

/* Botón + en cada fila */
.apunte-add-btn {
  width: 28px; height: 28px;
  border-radius: 7px;
  border: none;
  background: rgba(108,99,255,.15);
  color: var(--accent);
  font-size: .9rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all .18s;
  flex-shrink: 0;
  margin-right: .6rem;
}
.apunte-add-btn:hover { background: rgba(108,99,255,.3); transform: scale(1.1); }

/* Dropdown del + */
.apunte-dropdown {
  position: fixed;
  z-index: 600;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 11px;
  padding: .4rem;
  min-width: 210px;
  box-shadow: 0 12px 40px rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transform: scale(.94) translateY(-6px);
  transform-origin: top right;
  transition: opacity .15s, transform .15s;
}
.apunte-dropdown.open-up {
  transform: scale(.94) translateY(6px);
  transform-origin: bottom right;
}
.apunte-dropdown.open {
  opacity: 1;
  pointer-events: all;
  transform: scale(1) translateY(0);
}
.apunte-dropdown-item {
  display: flex;
  align-items: center;
  gap: .65rem;
  width: 100%;
  padding: .6rem .85rem;
  background: none;
  border: none;
  border-radius: 7px;
  color: var(--text);
  font-size: .88rem;
  font-weight: 600;
  cursor: pointer;
  text-align: left;
  transition: background .15s;
}
.apunte-dropdown-item i { width: 16px; text-align: center; color: var(--muted); transition: color .15s; }
.apunte-dropdown-item:hover { background: var(--card2); }
.apunte-dropdown-item:hover i { color: var(--accent); }

/* Items dentro del body de cada fila */
.apunte-items-list {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.apunte-cat-label {
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  color: var(--muted);
  padding: .5rem .2rem .1rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}
.apunte-cat-label:first-child { padding-top: .1rem; }
.apunte-item {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .65rem .9rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 9px;
  font-size: .88rem;
  transition: background .15s;
}
.apunte-item:hover { background: #2a344d; }
.apunte-item > i { font-size: .88rem; flex-shrink: 0; margin-top: .15rem; }
.apunte-item-url  > i { color: var(--accent); }
.apunte-item-gdoc > i { color: #4285f4; }
.apunte-item-nota > i { color: var(--yellow); }
.apunte-item a {
  color: var(--text);
  text-decoration: none;
  font-weight: 600;
  word-break: break-all;
}
.apunte-item a:hover { color: var(--accent); }
.apunte-nota-text {
  color: var(--muted);
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
}

/* Textarea en modal */
.modal-textarea {
  width: 100%;
  min-height: 150px;
  resize: vertical;
  background: #2a344d;
  border: 1px solid #3a4d70;
  border-radius: 10px;
  padding: .85rem 1.1rem;
  font-size: .93rem;
  color: var(--text);
  outline: none;
  transition: border-color .2s, box-shadow .2s;
  font-family: inherit;
  line-height: 1.6;
}
.modal-textarea::placeholder { color: #4e6080; }
.modal-textarea:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(108,99,255,.18);
}

/* ===== EXÁMENES ===== */
.examenes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1.2rem;
}
.examen-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-top: 3px solid var(--ec, var(--red));
  border-radius: var(--radius);
  padding: 1.3rem;
  transition: transform .2s, box-shadow .2s;
}
.examen-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.examen-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .85rem;
}
.examen-materia-badge {
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--ec, var(--red));
}
.examen-urgencia-pill {
  font-size: .68rem;
  font-weight: 700;
  padding: .18rem .65rem;
  border-radius: 999px;
}
.examen-urgencia-pill.hoy    { background:rgba(231,76,60,.2);  color:var(--red); }
.examen-urgencia-pill.pronto { background:rgba(230,126,34,.15); color:var(--orange); }
.examen-urgencia-pill.lejos  { background:rgba(108,99,255,.12); color:var(--accent); }
.examen-tema {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.45;
  margin-bottom: 1rem;
  color: var(--text);
}
.examen-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .78rem;
  color: var(--muted);
  border-top: 1px solid var(--border);
  padding-top: .75rem;
  margin-top: .25rem;
}
.examen-fecha i { margin-right: .3rem; }
.examen-dias { font-weight: 700; color: var(--text); font-size: .76rem; }
.examen-links-count {
  font-size: .74rem;
  color: var(--accent);
  margin-bottom: .65rem;
}
.examen-links-count i { margin-right: .3rem; }

/* Modal detalle examen */
.modal-detalle-examen { max-width: 780px; width: 95vw; }

/* Modal completados examen */
.modal-completados-examen { max-width: 680px; width: 95vw; }
.completados-examen-list {
  display: flex;
  flex-direction: column;
  gap: .65rem;
}
.completado-examen-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: var(--card2);
  border: 1px solid rgba(255,255,255,.15);
  border-left: 3px solid var(--ec, #2ecc71);
  border-radius: 10px;
  padding: .85rem 1rem;
  box-shadow: 0 0 6px 1px rgba(255,255,255,.06);
  transition: background .18s;
}
.completado-examen-item:hover { background: rgba(46,204,113,.07); }
.completado-examen-icon {
  width: 34px; height: 34px;
  border-radius: 8px;
  background: rgba(46,204,113,.15);
  color: #2ecc71;
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem;
  flex-shrink: 0;
}
.completado-examen-info { flex: 1; min-width: 0; }
.completado-examen-materia {
  font-size: .8rem;
  font-weight: 700;
  color: var(--ec, #2ecc71);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.completado-examen-tema {
  font-size: .92rem;
  font-weight: 600;
  color: var(--text);
  margin-top: .15rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.completado-examen-fecha {
  font-size: .75rem;
  color: var(--muted);
  margin-top: .1rem;
}
.completado-examen-acciones {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-shrink: 0;
}
.completado-examen-undo {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  background: rgba(108,99,255,.14);
  border: 1px solid rgba(108,99,255,.3);
  color: var(--accent);
  cursor: pointer;
  font-size: .78rem;
  font-weight: 700;
  padding: .3rem .7rem;
  border-radius: 7px;
  transition: background .15s, box-shadow .15s;
  white-space: nowrap;
}
.completado-examen-undo:hover {
  background: rgba(108,99,255,.28);
  box-shadow: 0 0 8px 1px rgba(108,99,255,.2);
}
.completado-examen-del {
  background: transparent;
  border: none;
  color: var(--muted);
  cursor: pointer;
  font-size: .85rem;
  padding: .3rem;
  border-radius: 6px;
  transition: color .15s, background .15s;
  flex-shrink: 0;
}
.completado-examen-del:hover { color: #e74c3c; background: rgba(231,76,60,.1); }

.examen-detalle-header {
  background: color-mix(in srgb, var(--ec, var(--red)) 10%, var(--card2));
  border: 1px solid color-mix(in srgb, var(--ec, var(--red)) 25%, var(--border));
  border-radius: 12px;
  padding: 1.3rem 1.5rem;
  margin-bottom: 1.4rem;
}
.examen-detalle-materia {
  font-size: .7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--ec, var(--red));
  margin-bottom: .5rem;
}
.examen-detalle-tema {
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.3;
  margin-bottom: .6rem;
}
.examen-detalle-fecha {
  font-size: .8rem;
  color: var(--muted);
}
.examen-detalle-fecha i { margin-right: .3rem; }

.examen-links-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin-top: .5rem;
}
.examen-link-item {
  display: flex;
  align-items: center;
  gap: .8rem;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: .75rem 1rem;
  transition: background .15s;
}
.examen-link-item:hover { background: #2a344d; }
.examen-link-item i { color: var(--accent); font-size: .85rem; flex-shrink: 0; }
.examen-link-item a {
  color: var(--text);
  text-decoration: none;
  font-size: .9rem;
  font-weight: 600;
  flex: 1;
}
.examen-link-item a:hover { color: var(--accent); }

/* ===== PROYECTOS ===== */
.proyectos-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(270px, 1fr));
  gap: 1.2rem;
}
.proyecto-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-top: 3px solid var(--pc, var(--orange));
  border-radius: var(--radius);
  padding: 1.3rem;
  transition: transform .2s, box-shadow .2s;
}
.proyecto-card:hover { transform: translateY(-3px); box-shadow: 0 8px 24px rgba(0,0,0,.35); }
.proyecto-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: .85rem;
}
.proyecto-materia-badge {
  font-size: .68rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--pc, var(--orange));
}
.proyecto-urgencia-pill {
  font-size: .68rem;
  font-weight: 700;
  padding: .18rem .65rem;
  border-radius: 999px;
}
.proyecto-urgencia-pill.hoy    { background:rgba(231,76,60,.2);  color:var(--red); }
.proyecto-urgencia-pill.pronto { background:rgba(230,126,34,.15); color:var(--orange); }
.proyecto-urgencia-pill.lejos  { background:rgba(108,99,255,.12); color:var(--accent); }
.proyecto-tema {
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.45;
  margin-bottom: 1rem;
  color: var(--text);
}
.proyecto-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .78rem;
  color: var(--muted);
  border-top: 1px solid var(--border);
  padding-top: .75rem;
  margin-top: .25rem;
}
.proyecto-fecha i { margin-right: .3rem; }
.proyecto-dias { font-weight: 700; color: var(--text); font-size: .76rem; }
.proyecto-links-count {
  font-size: .74rem;
  color: var(--accent);
  margin-bottom: .65rem;
}
.proyecto-links-count i { margin-right: .3rem; }

/* Modal detalle proyecto */
.modal-detalle-proyecto { max-width: 780px; width: 95vw; }

.proyecto-detalle-header {
  background: color-mix(in srgb, var(--pc, var(--orange)) 10%, var(--card2));
  border: 1px solid color-mix(in srgb, var(--pc, var(--orange)) 25%, var(--border));
  border-radius: 12px;
  padding: 1.3rem 1.5rem;
  margin-bottom: 1.4rem;
}
.proyecto-detalle-materia {
  font-size: .7rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--pc, var(--orange));
  margin-bottom: .5rem;
}
.proyecto-detalle-tema {
  font-size: 1.35rem;
  font-weight: 800;
  line-height: 1.3;
  margin-bottom: .6rem;
}
.proyecto-detalle-fecha {
  font-size: .8rem;
  color: var(--muted);
}
.proyecto-detalle-fecha i { margin-right: .3rem; }

.proyecto-links-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  margin-top: .5rem;
}
.proyecto-link-item {
  display: flex;
  align-items: center;
  gap: .8rem;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: .75rem 1rem;
  transition: background .15s;
}
.proyecto-link-item:hover { background: #2a344d; }
.proyecto-link-item i { color: var(--accent); font-size: .85rem; flex-shrink: 0; }
.proyecto-link-item a {
  color: var(--text);
  text-decoration: none;
  font-size: .9rem;
  font-weight: 600;
  flex: 1;
}
.proyecto-link-item a:hover { color: var(--accent); }

/* ===== DETALLE MATERIA ===== */
.modal-detalle { max-width: 680px; width: 95vw; }

.detalle-stats {
  display: flex;
  gap: 1rem;
  margin-bottom: 1.4rem;
}
.detalle-stat {
  flex: 1;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: .9rem;
  text-align: center;
}
.detalle-stat-num {
  display: block;
  font-size: 1.7rem;
  font-weight: 900;
  color: var(--text);
  line-height: 1;
}
.detalle-stat-lbl {
  display: block;
  font-size: .72rem;
  color: var(--muted);
  margin-top: .3rem;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 700;
}

.detalle-cuatri {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: .78rem;
  color: var(--muted);
  margin-bottom: .5rem;
}
.detalle-progress {
  background: var(--border);
  border-radius: 999px;
  height: 7px;
  margin-bottom: 1.4rem;
  overflow: hidden;
}
.detalle-progress-bar {
  height: 100%;
  border-radius: 999px;
  background: var(--accent);
  transition: width .6s ease;
}

.detalle-section-title {
  font-size: .73rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--muted);
  margin-bottom: .7rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--border);
}
.detalle-tareas-list {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: .55rem;
  max-height: 320px;
  overflow-y: auto;
}
.detalle-tarea-done { opacity: .65; }
.detalle-tarea-done strong { text-decoration: line-through; }

/* ===== LINK DE TAREA ===== */
.task-link {
  color: var(--accent);
  text-decoration: none;
  border-bottom: 1px solid rgba(108,99,255,.35);
  transition: color .15s, border-color .15s;
}
.task-link:hover {
  color: #a09aff;
  border-bottom-color: var(--accent);
}
.detalle-tarea-item {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  background: var(--card2);
  border: 1px solid var(--border);
  border-radius: 9px;
  padding: .7rem .9rem;
}
.detalle-tarea-item .priority-dot { margin-top: .35rem; flex-shrink: 0; }
.detalle-tarea-item strong { display: block; font-size: .88rem; font-weight: 600; }
.detalle-tarea-fecha {
  font-size: .74rem;
  color: var(--muted);
  margin-top: .15rem;
  display: block;
}
.detalle-tarea-fecha i { margin-right: .25rem; }

.detalle-empty {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--green);
  font-size: .88rem;
  padding: .7rem .3rem;
}
.detalle-empty i { font-size: 1.1rem; }

/* Actividades de inicio */
.inicio-actividades {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: .75rem;
  padding: 0 2.5rem 2rem;
}

/* ===== AUTH OVERLAY ===== */
.auth-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: var(--bg);
  align-items: center;
  justify-content: center;
}
.auth-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.5rem 2.2rem;
  width: min(420px, 92vw);
  box-shadow: 0 20px 60px rgba(0,0,0,.5);
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
}
.auth-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--accent);
  margin-bottom: .4rem;
}
.auth-logo i { font-size: 1.5rem; }
.auth-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: .3rem;
}
#authLoginPanel, #authRegPanel {
  display: flex;
  flex-direction: column;
  gap: .75rem;
}
.auth-input {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 9px;
  color: var(--text);
  padding: .65rem .9rem;
  font-size: .93rem;
  outline: none;
  transition: border-color .15s;
}
.auth-input:focus { border-color: var(--accent); }
.auth-input::placeholder { color: var(--muted); }
.auth-btn {
  background: var(--accent);
  border: none;
  border-radius: 9px;
  color: #fff;
  font-size: .95rem;
  font-weight: 700;
  padding: .7rem;
  cursor: pointer;
  margin-top: .2rem;
  transition: opacity .15s;
}
.auth-btn:hover { opacity: .88; }
.auth-btn:disabled { opacity: .45; cursor: not-allowed; }
.auth-error {
  font-size: .84rem;
  color: var(--red);
  min-height: 1.1rem;
}
.auth-switch {
  font-size: .86rem;
  color: var(--muted);
  text-align: center;
}
.auth-switch a {
  color: var(--accent);
  text-decoration: none;
  font-weight: 600;
}
.auth-switch a:hover { text-decoration: underline; }

/* ── Botón logout en header ── */
.logout-btn {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1rem;
  cursor: pointer;
  padding: .35rem .45rem;
  border-radius: 7px;
  transition: background .15s, color .15s;
  align-items: center;
}
.logout-btn:hover { background: rgba(255,255,255,.07); color: var(--red); }

/* ===== PANEL CHAT IA ===== */
.ia-panel-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 900;
  background: rgba(0,0,0,.5);
  align-items: center;
  justify-content: center;
}
.ia-panel-overlay.open { display: flex; }
.ia-panel {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: 18px;
  width: min(800px, 96vw);
  height: min(700px, 90vh);
  display: flex;
  flex-direction: column;
  box-shadow: 0 24px 70px rgba(0,0,0,.7);
}
.ia-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1.1rem 1.5rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
.ia-panel-header span {
  font-weight: 800;
  font-size: 1.08rem;
  color: var(--accent);
  display: flex;
  align-items: center;
  gap: .5rem;
  letter-spacing: -.01em;
}
.ia-panel-close {
  background: none;
  border: none;
  color: var(--muted);
  font-size: 1.1rem;
  cursor: pointer;
  padding: .3rem .45rem;
  border-radius: 7px;
  transition: background .15s, color .15s;
  line-height: 1;
}
.ia-panel-close:hover { background: rgba(255,255,255,.08); color: var(--text); }
.ia-panel-messages {
  flex: 1;
  overflow-y: auto;
  padding: 1.25rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .85rem;
}
.ia-msg {
  max-width: 84%;
  padding: .8rem 1.1rem;
  border-radius: 14px;
  font-size: 1rem;
  line-height: 1.7;
  word-break: break-word;
}
.ia-msg.user {
  align-self: flex-end;
  background: rgba(108,99,255,.22);
  border: 1px solid rgba(108,99,255,.38);
  color: var(--text);
  font-size: 1rem;
  white-space: pre-wrap;
}
.ia-msg.bot {
  align-self: flex-start;
  background: var(--card);
  border: 1px solid var(--border);
  color: var(--text);
  max-width: 92%;
}
/* Markdown dentro de respuestas del bot */
.ia-msg.bot p { margin: 0 0 .6em; }
.ia-msg.bot p:last-child { margin-bottom: 0; }
.ia-msg.bot strong { font-weight: 700; color: #d4d0ff; }
.ia-msg.bot em { font-style: italic; color: var(--muted); }
.ia-msg.bot h3 {
  font-size: 1.05rem;
  font-weight: 800;
  color: #c4c0ff;
  margin: .8em 0 .35em;
  letter-spacing: -.01em;
}
.ia-msg.bot h3:first-child { margin-top: 0; }
.ia-msg.bot ul, .ia-msg.bot ol {
  padding-left: 1.4em;
  margin: .4em 0 .6em;
  display: flex;
  flex-direction: column;
  gap: .25em;
}
.ia-msg.bot li { line-height: 1.6; }
.ia-msg.bot code {
  background: rgba(108,99,255,.15);
  border-radius: 4px;
  padding: .1em .4em;
  font-family: 'Consolas', monospace;
  font-size: .9em;
}
.ia-msg.thinking { color: var(--muted); font-style: italic; background: transparent; border: none; padding-left: 0; }
.ia-msg.accion-ok {
  color: var(--green);
  font-style: italic;
  font-size: .85rem;
  border-color: rgba(39,174,96,.3);
  background: rgba(39,174,96,.08);
  max-width: 92%;
}
.ia-panel-footer {
  display: flex;
  gap: .6rem;
  padding: 1rem 1.5rem 1.2rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
.ia-panel-input {
  flex: 1;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  color: var(--text);
  padding: .7rem 1rem;
  font-size: 1rem;
  outline: none;
  transition: border-color .15s;
}
.ia-panel-input:focus { border-color: var(--accent); }
.ia-panel-input::placeholder { color: var(--muted); }
.ia-panel-send {
  background: var(--accent);
  border: none;
  border-radius: 10px;
  color: #fff;
  padding: .7rem 1.1rem;
  font-size: 1rem;
  cursor: pointer;
  transition: opacity .15s;
  flex-shrink: 0;
}
.ia-panel-send:hover { opacity: .85; }
.ia-panel-send:disabled { opacity: .35; cursor: not-allowed; }

/* ===== RESPONSIVE ===== */
@media (max-width: 1000px) {
  .inicio-stats  { grid-template-columns: repeat(2,1fr); }
  .quick-nav     { grid-template-columns: 1fr; }
  .inicio-actividades { grid-template-columns: 1fr; }
  .tareas-cols   { grid-template-columns: 1fr; }
  .cal-layout    { grid-template-columns: 1fr; }
}

/* ── Tablet (≤768px) ── */
@media (max-width: 768px) {
  /* Hero: apila texto arriba, IA abajo */
  .inicio-hero {
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem 1.5rem 1.8rem;
    gap: 1.2rem;
  }
  .hero-ia-wrap {
    min-width: unset;
    width: 100%;
  }
  /* Stats: 2 columnas en tablet */
  .inicio-stats { grid-template-columns: repeat(2,1fr); padding: 1.2rem 1.5rem; }
  .quick-nav    { padding: 0 1.5rem; }
  .inicio-label { padding-left:1.5rem; padding-right:1.5rem; }
  /* Apuntes: reducir padding lateral */
  .apunte-row-header { padding: 1rem 1.5rem; }
  .apunte-row-body   { padding: .8rem 1.5rem 1.2rem calc(1.5rem + 38px + 1rem); }
  .apuntes-page-header { padding: 1.5rem 1.5rem 1rem; }
}

/* ── Móvil (≤700px) ── */
@media (max-width: 700px) {
  /* Header */
  .logo span  { display:none; }
  .tabs .tab span { display:none; }
  .tabs .tab  { padding:.45rem .65rem; }
  .user-text  { display:none; }
  .user-avatar { font-size: 1.7rem; }

  /* Hero */
  .inicio-hero {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.5rem 1.2rem;
    gap: 1rem;
  }
  .hero-ia-wrap { min-width: unset; width: 100%; }
  .hero-title   { font-size: 1.9rem; }
  .hero-sub     { font-size: .9rem; margin-bottom: 1rem; }

  /* Stats: 2 cols en móvil */
  .inicio-stats {
    grid-template-columns: repeat(2,1fr);
    padding: 1rem 1.2rem;
    gap: .75rem;
  }
  .stat-card { padding: .85rem 1rem; gap: .7rem; }
  .stat-icon { width:38px; height:38px; font-size:1rem; }
  .stat-info h3 { font-size:1.3rem; }

  /* Quick nav */
  .quick-nav    { grid-template-columns: 1fr; padding: 0 1.2rem; gap:.75rem; }
  .inicio-label { padding-left:1.2rem; padding-right:1.2rem; }

  /* Page inner */
  .page-inner { padding:1.3rem 1rem 3rem; }

  /* Apuntes */
  .apunte-row-header { padding:.9rem 1rem; }
  .apunte-row-body   { padding:.8rem 1rem 1.2rem 1rem; }
  .apuntes-page-header { padding: 1.2rem 1rem .9rem; }

  /* Menus contexto: botones más grandes en móvil para facilitar el toque */
  .ctx-menu { min-width: 200px; }
  .ctx-item  { padding: .75rem 1rem; font-size: .95rem; }
}

/* ===== Brillo estático — secciones de inicio ===== */
.stat-card,
.qnav-btn,
.tareas-col {
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: 0 0 6px 1px rgba(255,255,255,.06);
}

/* mat-card tiene border-top de color de materia — solo otros bordes */
.mat-card {
  border-left-color:   rgba(255,255,255,.15) !important;
  border-right-color:  rgba(255,255,255,.15) !important;
  border-bottom-color: rgba(255,255,255,.15) !important;
  box-shadow: 0 0 6px 1px rgba(255,255,255,.06);
}

/* ===== Hint "mantené presionado" — solo en touch ===== */
/* Mostrar hint de long-press en dispositivos táctiles */
@media (hover: none) and (pointer: coarse) {
  .touch-hint {
    display: flex !important;
  }
}
.touch-hint {
  display: none;
  align-items: center;
  gap: .4rem;
  font-size: .75rem;
  color: var(--muted);
  padding: .5rem 0 .2rem;
  opacity: .7;
}
.touch-hint i { font-size: .8rem; }

/* ===== LONG PRESS MÓVIL — prevenir comportamiento nativo de iOS ===== */
/*
  Sin esto, iOS muestra su propio menú al mantener presionado
  (copiar, compartir, seleccionar texto) antes de que se dispare
  nuestro evento touchstart+setTimeout. Esto lo bloquea.
*/
.mat-card,
.examen-card,
.proyecto-card,
.apunte-item,
.ev,
.task-item,
.qnav-btn,
.stat-card {
  -webkit-touch-callout: none;   /* iOS: sin popup nativo al mantener */
  -webkit-user-select:   none;   /* iOS: sin selección de texto */
  user-select:           none;
}

/* Context menus: asegurarse que quedan encima de todo en móvil */
@media (hover: none) and (pointer: coarse) {
  .ctx-menu,
  #ctxMenuExamen,
  #ctxMenuProyecto,
  #ctxMenuApunte,
  #ctxCalEvento {
    z-index: 9000 !important;
    /* En táctil los ítems son un poco más grandes para facilitar el toque */
    min-width: 210px;
  }
  .ctx-item { padding: .8rem 1.1rem !important; font-size: .95rem !important; }
}
