.toani-app{font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;max-width:1200px;margin:24px auto;padding:8px 16px}
header h2{margin:4px 0 12px}
.tabs{display:flex;gap:8px;margin:12px 0}
.tabs button{padding:8px 12px;border:1px solid #d1d5db;background:#fff;color:black;border-radius:10px;cursor:pointer}
.tabs button.active{background:#F6DF3F;color:black;border-color:#111}
.panel{display:none}
.panel.active{display:block}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:12px}
.card.kpi{display:flex;flex-direction:column;gap:6px;align-items:flex-start;justify-content:center;border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:12px}
.kpi-label{font-size:12px;color:#475569}
.kpi-value{font-size:28px;font-weight:700}
.toolbar{display:flex;gap:8px;margin-bottom:12px;align-items:center}
.toolbar .btn{padding:8px 12px;border:1px solid #ccc;background:#F6DF3F;color:black;border-radius:8px;cursor:pointer}
.btn{padding:8px 12px;border:1px solid #ccc;background:#F6DF3F;color:black;border-radius:8px;cursor:pointer}
.grid{display:grid;grid-template-columns:340px 1fr;gap:12px}
.list{border:1px solid #e5e7eb;border-radius:12px;background:#fff;min-height:520px;padding:4px}
.list ul{list-style:none;margin:0;padding:0}
.list li{padding:10px 12px;border-bottom:1px solid #f1f5f9;cursor:pointer}
.list li:hover{background:#f8fafc}
.list .empty{padding:12px;color:#6b7280}
.detail .card{border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:12px;margin-bottom:12px}
.hidden{display:none}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.site-block{border:1px dashed #e5e7eb;border-radius:10px;padding:8px;margin:8px 0}
.site-title{font-weight:600;margin-bottom:6px}
.note{border:1px outset black;border-radius:10px;padding:8px;margin:8px 0}
.note-head{display:flex;gap:8px;align-items:center;font-size:14px;color:#475569;flex-wrap:wrap}
.note .title{font-weight:600}
.kind{padding:2px 8px;border-radius:999px;border:1px solid #cbd5e1}
.kind-incidente{background:#fff7ed}
.kind-observacion{background:#f1f5f9}
.kind-avance{background:#ecfeff}
.bitacora-form .row{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap;margin-bottom:6px}
.bitacora-form input[type="text"], .bitacora-form input[type="email"], .bitacora-form input[type="number"], .bitacora-form input[type="datetime-local"], .bitacora-form select, .bitacora-form textarea{width:100%;max-width:100%;padding:8px;border:1px solid #cbd5e1;border-radius:8px}
.bitacora-form .btn.primary{padding:10px 14px;border:1px solid #2563eb;background:#2563eb;color:black;border-radius:10px;cursor:pointer}
.tx{width:100%;border-collapse:collapse}
.tx th,.tx td{border:1px solid #e5e7eb;padding:6px 8px;text-align:left}
.btn.small{padding:2px 8px;border-radius:8px}
.btn.danger{border-color:#ef4444;color:#ef4444}
.comments{border-top:1px dashed #e5e7eb;margin-top:8px;padding-top:8px}
.cmt-head{font-size:13px;color:#334155;margin-bottom:6px}
.cmt-list{display:flex;flex-direction:column;gap:6px}
.cmt-item{border:1px solid #e5e7eb;border-radius:8px;padding:6px;background:#fafafa}
.cmt-line{display:flex;gap:8px;align-items:center;font-size:12px;color:#475569}
.cmt-author{font-weight:600}
.cmt-date{font-size:11px;color:#64748b}
.cmt-msg{white-space:pre-wrap;font-size:13px;color:#334155;margin-top:2px}
.cmt-form{display:grid;grid-template-columns:1fr auto;gap:6px;margin-top:6px}
.cmt-form textarea{resize:vertical;min-height:56px;border:1px solid #cbd5e1;border-radius:8px;padding:6px}

/* Modal selector de alumnos */
.toani-modal{position:fixed;inset:0;background:rgba(0,0,0,.35);display:flex;align-items:center;justify-content:center;z-index:9999}
.toani-modal .box{background:#fff;border-radius:12px;min-width:520px;max-width:90vw;padding:12px;border:1px solid #e5e7eb;box-shadow:0 10px 30px rgba(0,0,0,.12)}
.toani-modal .row{display:flex;gap:8px;align-items:center;margin-bottom:8px}
.toani-modal input[type="text"]{flex:1;border:1px solid #cbd5e1;border-radius:8px;padding:8px}
.toani-modal .list{max-height:360px;overflow:auto;border:1px solid #e5e7eb;border-radius:8px;padding:6px}
.toani-modal .list li{display:flex;justify-content:space-between;gap:8px;padding:6px 8px;border-bottom:1px solid #f1f5f9}
.toani-modal .list li:last-child{border-bottom:0}
.toani-modal .close{margin-left:auto}
.site-block { padding:10px; border:1px solid #eee; border-radius:10px; margin:8px 0; }
.site-title { font-weight:600; margin-bottom:6px; display:flex; gap:10px; align-items:center; justify-content:space-between; }
.site-title .recent-activity { font-weight:400; color:#555; font-size:12px; }
#toani-students{max-height: 650px;overflow-y: auto;   /* ← habilita el scroll vertical */overflow-x: hidden; /* opcional, evita scroll horizontal */}
#toani-students-acuity{max-height: 250px;overflow-y: auto;   /* ← habilita el scroll vertical */overflow-x: hidden; /* opcional, evita scroll horizontal */}
#dash-latest{max-height: 550px;min-height: 400px;width: 100%; overflow-y: auto;   /* ← habilita el scroll vertical */overflow-x: hidden;  padding: 5px; margin: 0;}
#dash-acuity{max-height: 450px;min-height: 400px;width: 100%; overflow-y: auto;   /* ← habilita el scroll vertical */overflow-x: hidden; padding: 5px; margin: 0;}
.student_name{font-style: bold; color:black;}
.texto_negro{color:black;}
.texto_date{font-style: italic;text-align: right; color:#1c1c1c;}
.item_list_boxed{border-top:1px dashed black; padding: 2px;}
.btn{color:black;}
button{color: black;}
#toani-btn-search{color:black;}
#toani-btn-add-contacto{color:black;}
.card_dash{border:1px solid black;padding:20px 20px;background: white; width: 100%; padding: 50px; display: block; max-height: 650px; display: inline-block;}
.card{background:white; padding: 10px; border: 2px dashed gray;}
/* Encabezado del acordeón */
.daily-day > summary.day-head {
  cursor: pointer;
  list-style: none;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #f8fafc;            /* slate-50 */
  border: 1px solid #e2e8f0;       /* slate-200 */
  color: #334155;                  /* slate-700 */
  padding: 6px 10px;
  border-radius: 6px;
  position: sticky;
  top: 0;                          /* conserva tu efecto “sticky” si lo usabas */
  z-index: 1;
}

/* Oculta el marcador nativo del summary en algunos navegadores */
.daily-day > summary::-webkit-details-marker { display: none; }

/* Badge con contador de notas del día */
.daily-day .badge {
  margin-left: auto;
  background: #e2e8f0;            /* slate-200 */
  color: #0f172a;                  /* slate-900 */
  font-size: 12px;
  padding: 1px 6px;
  border-radius: 999px;
}

/* Contenido del día */
.daily-day .day-items {
  margin: 8px 0 6px 0;
}

/* Separador entre días */
hr.daily-sep {
  border: 0;
  border-top: 1px solid #e5e7eb;   /* gray-200 */
  margin: 8px 0 12px;
}
#dash-latest-tx { list-style: none; margin: 0; padding: 0; }
#dash-latest-tx .tx-item { padding: 8px 10px; border-bottom: 1px solid #eee; }
#dash-latest-tx .tx-item:last-child { border-bottom: 0; }
#dash-latest-tx .tx-row-1 { display:flex; align-items:center; gap:8px; }
#dash-latest-tx .tx-row-2 { display:flex; gap:6px; flex-wrap:wrap; color:#64748b; font-size:12px; margin-top:2px; }
#dash-latest-tx .tx-amount { font-weight:600; }
#dash-latest-tx .tx-currency { color:#475569; font-size:12px; }
#dash-latest-tx .tx-status { margin-left:auto; font-size:12px; padding:2px 6px; border-radius:999px; background:#eef2ff; color:#1e293b; }
#dash-latest-tx .tx-status.paid { background:#dcfce7; color:#065f46; }
#dash-latest-tx .tx-status.failed { background:#fee2e2; color:#991b1b; }
.tx-toolbar input[type="search"]{ border:1px solid #e5e7eb; border-radius:6px; }
/* Modal básico */
.toani-modal-overlay {
  position: fixed; inset: 0; background: rgba(15,23,42,.45);
  display:flex; align-items:center; justify-content:center;
  z-index: 9999;
}
.toani-modal {
  background:#fff; width: min(720px, 96vw); max-height: 90vh;
  border-radius: 12px; box-shadow: 0 10px 40px rgba(0,0,0,.25);
  display:flex; flex-direction:column; overflow:hidden;
}
.toani-modal-head { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid #e5e7eb; }
.toani-modal-head h3 { margin:0; font-size:18px; }
.toani-modal-close { background:transparent; border:0; font-size:22px; line-height:1; cursor:pointer; }
.toani-modal-body { padding:14px; overflow:auto; }
.toani-modal .grid2 { display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
.toani-modal .lbl { display:block; font-size:12px; color:#475569; margin:8px 0 4px; }
.toani-modal input[type="text"],
.toani-modal input[type="number"],
.toani-modal input[type="email"],
.toani-modal textarea,
.toani-modal select { width:100%; border:1px solid #e5e7eb; border-radius:8px; padding:8px; }
.toani-modal .actions { display:flex; gap:8px; justify-content:flex-end; margin-top:12px; }

.student-picker { display:flex; gap:8px; align-items:center; }
.student-picker .student-display { flex:1; }

.st-list .st-item { padding:8px; border:1px solid #e5e7eb; border-radius:8px; margin-bottom:6px; cursor:pointer; display:flex; align-items:center; justify-content:space-between; }
.st-list .st-item:hover { background:#f8fafc; }
.muted { color:#94a3b8; font-size:12px; }
#dash-latest-tx{
	{max-height: 450px;width: 100%; overflow-y: auto;   /* ← habilita el scroll vertical */overflow-x: hidden; padding: 40px; margin: 0;
}

/* === Scrollbars globales en amarillo #F6DF3F === */

/* Firefox */
* {
  scrollbar-color: #F6DF3F #f5f5f5; /* thumb, track */
  scrollbar-width: thin;
}

/* Chromium/Edge/Safari (WebKit) */
*::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
*::-webkit-scrollbar-track {
  background: #f5f5f5;
}
*::-webkit-scrollbar-thumb {
  background-color: #F6DF3F;
  border-radius: 999px;
  border: 2px solid #f5f5f5; /* crea separación visual del track */
}
*::-webkit-scrollbar-thumb:hover {
  background-color: #E6CC2E; /* tono hover ligeramente más oscuro */
}