/* ─── Reset & base ─────────────────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --brandBlue:   #153a7a;
  --brandBlue2:  #0d2a5a;
  --gold:        #ffb300;
  --gold2:       #ff9900;
  --bg:          #f6f8fc;
  --surface:     #ffffff;
  --text:        #0b1220;
  --muted:       #4a5872;
  --border:      #dde3ef;
  --radius:      18px;
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   14px;
  --shadow-sm:   0 1px 4px rgba(21,58,122,.07), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:   0 4px 16px rgba(21,58,122,.12), 0 2px 6px rgba(0,0,0,.05);
  --shadow-hdr:  0 2px 10px rgba(21,58,122,.25);

  --clr-tareas:      #eef2fb;
  --clr-tareas-acc:  var(--brandBlue);
  --clr-notas:       #f0fdf4;
  --clr-notas-acc:   #16a34a;
  --clr-mensajes:    #fff8ec;
  --clr-mensajes-acc:var(--gold2);
  --clr-obs:         #fef2f2;
  --clr-obs-acc:     #dc2626;
}

html { font-size: 16px; -webkit-text-size-adjust: 100%; }

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.6;
  min-height: 100vh;
}

a { color: var(--brandBlue); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ─── Login page ────────────────────────────────────────────────────────────── */
.login-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1rem;
  background: linear-gradient(135deg, var(--brandBlue) 0%, var(--brandBlue2) 100%);
}

.login-card {
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: 0 20px 60px rgba(0,0,0,.28);
  padding: 2.5rem 2rem;
  width: 100%;
  max-width: 380px;
  text-align: center;
}

.login-logo {
  margin-bottom: 1rem;
  display: flex;
  justify-content: center;
}

.login-logo-img {
  max-height: 60px;
  width: auto;
  display: block;
}

.login-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  margin-bottom: .25rem;
}

.login-subtitle {
  color: var(--muted);
  font-size: .9rem;
  margin-bottom: 1.75rem;
}

.error-banner {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #dc2626;
  border-radius: var(--radius-sm);
  padding: .625rem 1rem;
  font-size: .875rem;
  margin-bottom: 1.25rem;
  text-align: left;
}

.login-form { text-align: left; }

.form-group { margin-bottom: 1rem; }

.form-group label {
  display: block;
  font-size: .875rem;
  font-weight: 500;
  color: var(--text);
  margin-bottom: .375rem;
}

.form-group input,
.form-group select {
  width: 100%;
  padding: .625rem .875rem;
  border: 1.5px solid var(--border);
  border-radius: var(--radius-sm);
  font-size: 1rem;
  color: var(--text);
  background: var(--surface);
  transition: border-color .15s, box-shadow .15s;
  outline: none;
}

.form-group input:focus,
.form-group select:focus {
  border-color: var(--brandBlue);
  box-shadow: 0 0 0 3px rgba(21,58,122,.15);
}

.btn-login {
  display: block;
  width: 100%;
  padding: .75rem;
  background: var(--brandBlue);
  color: #fff;
  border: none;
  border-radius: var(--radius-sm);
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  margin-top: .5rem;
  transition: background .15s, transform .1s;
}

.btn-login:hover { background: var(--brandBlue2); }
.btn-login:active { transform: scale(.98); }

/* ─── Index page ────────────────────────────────────────────────────────────── */
.index-page {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1rem;
}

.index-card {
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--shadow-md);
  padding: 2rem;
  width: 100%;
  max-width: 420px;
}

.index-card h1 {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: .5rem;
  color: var(--brandBlue);
}

.index-card p { color: var(--muted); margin-bottom: 1.25rem; font-size: .9rem; }

.student-list { list-style: none; }
.student-list li { margin-bottom: .5rem; }
.student-list a {
  display: block;
  padding: .625rem 1rem;
  background: var(--clr-tareas);
  border-radius: var(--radius-sm);
  font-weight: 600;
  color: var(--brandBlue);
  transition: background .15s, box-shadow .15s;
}
.student-list a:hover { background: #dce6f7; box-shadow: var(--shadow-sm); text-decoration: none; }

.logout-link {
  display: inline-block;
  margin-top: 1.25rem;
  font-size: .85rem;
  color: var(--muted);
}

/* ─── Digest header ─────────────────────────────────────────────────────────── */
.digest-header {
  background: linear-gradient(135deg, var(--brandBlue) 0%, var(--brandBlue2) 100%);
  color: white;
  box-shadow: var(--shadow-hdr);
}

.header-inner {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .875rem 1rem .5rem;
  max-width: 1080px;
  margin: 0 auto;
}

.header-logo { flex-shrink: 0; display: flex; align-items: center; }

.header-logo-img {
  height: 36px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
  opacity: .9;
}

.header-text { flex: 1; min-width: 0; }

.header-name {
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.header-meta {
  font-size: .8rem;
  opacity: .8;
  display: flex;
  align-items: center;
  gap: .35rem;
  flex-wrap: wrap;
}

.meta-sep { opacity: .5; }

.header-home {
  flex-shrink: 0;
  color: white;
  opacity: .7;
  padding: .375rem;
  border-radius: var(--radius-sm);
  transition: opacity .15s, background .15s;
  display: flex;
}
.header-home:hover { opacity: 1; background: rgba(255,255,255,.15); text-decoration: none; }

.header-date {
  font-size: .75rem;
  opacity: .7;
  padding: .25rem 1rem .625rem;
  max-width: 1080px;
  margin: 0 auto;
  text-transform: capitalize;
}

/* ─── Digest main layout ────────────────────────────────────────────────────── */
.digest-main {
  max-width: 1080px;
  margin: 0 auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* two-column grid wrapper for tareas + notas */
.digest-grid {
  display: contents;
}

/* ─── Section blocks ────────────────────────────────────────────────────────── */
.digest-section {
  background: var(--surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
  transition: box-shadow .2s;
}
.digest-section:hover { box-shadow: var(--shadow-md); }

.section-header {
  display: flex;
  align-items: center;
  gap: .625rem;
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--border);
}

.section-header h2 {
  font-size: 1rem;
  font-weight: 700;
  flex: 1;
}

.section-icon {
  width: 32px;
  height: 32px;
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.section-tareas .section-header { background: var(--clr-tareas); }
.tareas-icon { background: var(--clr-tareas-acc); color: white; }

.section-notas .section-header { background: var(--clr-notas); }
.notas-icon { background: var(--clr-notas-acc); color: white; }

.section-mensajes .section-header { background: var(--clr-mensajes); }
.mensajes-icon { background: var(--clr-mensajes-acc); color: white; }

.section-observaciones .section-header { background: var(--clr-obs); }
.obs-icon { background: var(--clr-obs-acc); color: white; }

/* ─── Subsections ───────────────────────────────────────────────────────────── */
.subsection {
  padding: .875rem 1rem;
  border-bottom: 1px solid var(--border);
}
.subsection:last-child { border-bottom: none; }

.subsection-title {
  font-size: .8rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--muted);
  margin-bottom: .75rem;
  display: flex;
  align-items: center;
  gap: .4rem;
}

.subsection-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}
.dot-blue   { background: #3b82f6; }
.dot-orange { background: #f97316; }
.dot-green  { background: #22c55e; }
.dot-teal   { background: #14b8a6; }
.dot-red    { background: #ef4444; }

.count-chip {
  margin-left: auto;
  background: var(--bg);
  border: 1px solid var(--border);
  color: var(--muted);
  font-size: .7rem;
  padding: .1rem .45rem;
  border-radius: 999px;
  font-weight: 600;
}

.empty-state {
  font-size: .875rem;
  color: var(--muted);
  text-align: center;
  padding: .75rem 0;
  font-style: italic;
}

/* ─── Cards ─────────────────────────────────────────────────────────────────── */
.card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: .875rem;
  margin-bottom: .625rem;
  transition: box-shadow .18s, border-color .18s;
}
.card:last-child { margin-bottom: 0; }
.card:hover { box-shadow: var(--shadow-sm); border-color: #c3cde6; }

.card-header-row {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  margin-bottom: .5rem;
  flex-wrap: wrap;
}

.card-footer {
  display: flex;
  align-items: center;
  gap: .625rem;
  margin-top: .625rem;
  flex-wrap: wrap;
}

/* ─── Subject names ─────────────────────────────────────────────────────────── */
.subject-name {
  font-size: .875rem;
  font-weight: 700;
  color: var(--text);
  flex: 1;
  min-width: 0;
}

/* ─── Badges ────────────────────────────────────────────────────────────────── */
.badge {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  font-size: .65rem;
  font-weight: 700;
  padding: .2rem .5rem;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: .03em;
  white-space: nowrap;
  flex-shrink: 0;
}

.badge-red    { background: #fee2e2; color: #b91c1c; }
.badge-orange { background: #ffedd5; color: #c2410c; }
.badge-blue   { background: #dbeafe; color: #1d4ed8; }
.badge-indigo { background: #e0e7ff; color: #4338ca; }
.badge-purple { background: #f3e8ff; color: #7e22ce; }
.badge-teal   { background: #ccfbf1; color: #0f766e; }
.badge-pink   { background: #fce7f3; color: #be185d; }
.badge-cyan   { background: #cffafe; color: #0e7490; }
.badge-green  { background: #dcfce7; color: #15803d; }
.badge-gray   { background: #f1f5f9; color: #475569; }

/* ─── Tareas ────────────────────────────────────────────────────────────────── */
.tarea-desc {
  font-size: .8rem;
  color: var(--muted);
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.tarea-resumen {
  font-size: .85rem;
  color: var(--text);
  line-height: 1.6;
  background: white;
  border-left: 3px solid var(--brandBlue);
  padding: .5rem .75rem;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
}

.tarea-resumen p { margin-bottom: .35rem; }
.tarea-resumen p:last-child { margin-bottom: 0; }
.md-num { font-weight: 600; color: var(--brandBlue); }
.md-bullet { padding-left: .5rem; }

.tarea-meta-row {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  margin-bottom: .5rem;
}

.badge-dificultad { gap: .3rem; }
.dif-icon { font-style: normal; letter-spacing: -.05em; }

.tarea-meta-chip {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .7rem;
  font-weight: 600;
  padding: .2rem .5rem;
  border-radius: 4px;
  background: #f1f5f9;
  color: var(--muted);
  white-space: nowrap;
}

.tarea-tips {
  margin-top: .5rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: var(--radius-sm);
  padding: .5rem .75rem;
}

.tips-label {
  display: block;
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #92400e;
  margin-bottom: .3rem;
}

.tips-body {
  font-size: .8rem;
  color: #78350f;
  line-height: 1.55;
}

.due-label {
  font-size: .75rem;
  color: var(--muted);
  font-weight: 500;
}

.attachments {
  display: flex;
  flex-wrap: wrap;
  gap: .375rem;
  margin-top: .375rem;
}

.attachment-link {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .72rem;
  color: var(--brandBlue);
  background: white;
  border: 1px solid #c3cde6;
  padding: .2rem .5rem;
  border-radius: 4px;
  transition: background .15s;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.attachment-link:hover { background: var(--clr-tareas); text-decoration: none; }

/* ─── Notas ─────────────────────────────────────────────────────────────────── */
.nota-value {
  font-size: 1.1rem;
  font-weight: 800;
  width: 52px;
  height: 36px;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nota-great  { background: #dcfce7; color: #15803d; }
.nota-good   { background: #dbeafe; color: #1d4ed8; }
.nota-warn   { background: #fef9c3; color: #a16207; }
.nota-fail   { background: #fee2e2; color: #b91c1c; }
.nota-neutral{ background: #f1f5f9; color: #475569; }

.nota-detail {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: .25rem;
}

.detail-chip {
  font-size: .7rem;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--muted);
  background: white;
  border: 1px solid var(--border);
  padding: .15rem .45rem;
  border-radius: 4px;
}

.nota-tema {
  font-size: .8rem;
  color: var(--text);
  font-weight: 500;
}

.nota-indicador {
  font-size: .75rem;
  color: var(--muted);
  font-style: italic;
  line-height: 1.4;
  margin-bottom: .25rem;
}

.nota-obs {
  font-size: .8rem;
  color: var(--clr-obs-acc);
  background: var(--clr-obs);
  padding: .375rem .5rem;
  border-radius: var(--radius-sm);
}

/* ─── Promedios grid ────────────────────────────────────────────────────────── */
.promedios-grid {
  display: flex;
  flex-direction: column;
  gap: .5rem;
}

.promedio-item {
  display: grid;
  grid-template-columns: 1fr auto auto;
  align-items: center;
  gap: .625rem;
}

.promedio-subject {
  font-size: .8rem;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.promedio-bar-wrap {
  height: 8px;
  background: var(--border);
  border-radius: 99px;
  overflow: hidden;
  min-width: 60px;
  max-width: 140px;
  width: 100%;
}

.promedio-bar {
  height: 100%;
  border-radius: 99px;
  transition: width .4s ease;
}

.prom-great { background: #22c55e; }
.prom-good  { background: #3b82f6; }
.prom-warn  { background: #eab308; }
.prom-fail  { background: #ef4444; }

.promedio-val {
  font-size: .8rem;
  font-weight: 800;
  min-width: 36px;
  text-align: right;
}

/* ─── Mensajes ──────────────────────────────────────────────────────────────── */
.msg-subject {
  font-size: .875rem;
  font-weight: 700;
  flex: 1;
  min-width: 0;
}

.msg-meta {
  display: flex;
  align-items: center;
  gap: .4rem;
  flex-wrap: wrap;
  margin-bottom: .5rem;
}

.msg-sender {
  font-size: .75rem;
  font-weight: 600;
  color: var(--text);
}

.msg-role {
  font-size: .68rem;
  text-transform: uppercase;
  color: var(--muted);
  background: var(--bg);
  border: 1px solid var(--border);
  padding: .1rem .35rem;
  border-radius: 3px;
}

.msg-date {
  font-size: .72rem;
  color: var(--muted);
  margin-left: auto;
}

.msg-body {
  font-size: .8rem;
  color: var(--muted);
  line-height: 1.55;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-wrap;
  word-break: break-word;
}

/* ─── Homework badges ───────────────────────────────────────────────────────── */
.hw-badge {
  font-size: .68rem;
  font-weight: 700;
  padding: .2rem .5rem;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}

.hw-yes     { background: #dcfce7; color: #15803d; }
.hw-no      { background: #f1f5f9; color: #475569; }
.hw-unknown { background: #fff7ed; color: #92400e; }

/* ─── Observaciones ─────────────────────────────────────────────────────────── */
.obs-text {
  font-size: .85rem;
  color: var(--text);
  line-height: 1.6;
  background: var(--clr-obs);
  border-left: 3px solid var(--clr-obs-acc);
  padding: .5rem .75rem;
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-bottom: .5rem;
}

.obs-by {
  font-size: .72rem;
  color: var(--muted);
}

/* ─── Footer ────────────────────────────────────────────────────────────────── */
.digest-footer {
  text-align: center;
  padding: 1.5rem 1rem 2rem;
  font-size: .8rem;
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  max-width: 1080px;
  margin: 0 auto;
}

.digest-footer a { color: var(--muted); }
.digest-footer a:hover { color: var(--brandBlue); }

/* ─── Tablet tweaks ─────────────────────────────────────────────────────────── */
@media (min-width: 640px) {
  .digest-main { padding: 1.25rem; gap: 1.25rem; }
  .header-inner { padding: 1rem 1.25rem .5rem; }
  .header-date  { padding-left: 1.25rem; padding-bottom: .875rem; }
  .header-name  { font-size: 1.25rem; }
  .card { padding: 1rem 1.125rem; }
  .tarea-desc { -webkit-line-clamp: unset; }
  .msg-body   { -webkit-line-clamp: unset; }
  .promedio-bar-wrap { max-width: 200px; }
}

@media (min-width: 768px) {
  .promedios-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .625rem;
  }
}

/* ─── Desktop two-column layout ─────────────────────────────────────────────── */
@media (min-width: 1024px) {
  .digest-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    align-items: start;
  }

  .digest-main {
    padding: 1.5rem;
    gap: 1.25rem;
  }

  .header-inner { padding: 1rem 1.5rem .5rem; }
  .header-date  { padding-left: 1.5rem; }
  .header-logo-img { height: 40px; }
  .header-name { font-size: 1.35rem; }

  .promedios-grid {
    grid-template-columns: 1fr;
  }
  .promedio-bar-wrap { max-width: unset; }
}

/* ─── Top navigation bar ─────────────────────────────────────────────────────── */
.top-nav {
  background: var(--brandBlue);
  color: white;
  position: sticky;
  top: 0;
  z-index: 200;
  box-shadow: var(--shadow-hdr);
}
.top-nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .5rem 1rem;
  max-width: 1080px;
  margin: 0 auto;
  gap: 1rem;
}
.top-nav-logo-link { flex-shrink: 0; display: flex; align-items: center; }
.top-nav-logo-img {
  height: 28px;
  width: auto;
  display: block;
  filter: brightness(0) invert(1);
  opacity: .9;
}
.top-nav-logo-link:hover .top-nav-logo-img { opacity: 1; }
.top-nav-right { display: flex; align-items: center; gap: .625rem; }
.top-nav-user {
  font-size: .85rem;
  font-weight: 600;
  opacity: .9;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}
.top-nav-settings {
  font-size: .8rem;
  padding: .3rem .65rem;
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.15);
  color: white;
  border: 1px solid rgba(255,255,255,.3);
  cursor: pointer;
  transition: background .15s;
}
.top-nav-settings:hover { background: rgba(255,255,255,.28); }
.top-nav-disabled { opacity: .35; cursor: not-allowed; pointer-events: none; }
.top-nav-logout-form { margin: 0; }
.top-nav-logout {
  font-size: .8rem;
  padding: .3rem .75rem;
  background: rgba(255,255,255,.1);
  color: white;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: background .15s;
}
.top-nav-logout:hover { background: rgba(255,255,255,.25); }


/* ─── Students selection page ────────────────────────────────────────────────── */
.students-page { background: var(--bg); min-height: 100vh; }
.students-main { max-width: 720px; margin: 2rem auto; padding: 0 1rem; }
.students-heading { font-size: 1.15rem; font-weight: 600; color: var(--text); margin-bottom: 1.25rem; }
.students-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 1rem; }
.student-card {
  display: block;
  background: var(--surface);
  border: 1.5px solid var(--border);
  border-radius: var(--radius-md);
  padding: 1.25rem 1rem;
  transition: box-shadow .15s, border-color .15s, transform .1s;
  text-decoration: none;
}
.student-card:hover { box-shadow: var(--shadow-md); border-color: var(--brandBlue); transform: translateY(-2px); text-decoration: none; }
.student-card-name { font-weight: 700; font-size: 1rem; color: var(--brandBlue); margin-bottom: .25rem; }
.student-card-school { font-size: .8rem; color: var(--muted); }

/* ─── Attachment unavailable ─────────────────────────────────────────────────── */
.attachment-unavailable {
  opacity: .45;
  cursor: not-allowed;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  font-size: .8rem;
  color: var(--muted);
}

/* ─── Ajustes overlay / modal ────────────────────────────────────────────────── */
.ajustes-overlay[hidden] { display: none !important; }
.ajustes-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);
  z-index: 500;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  padding: 56px 1rem 1rem;
}
.ajustes-panel {
  background: var(--surface);
  border-radius: var(--radius-lg);
  box-shadow: 0 8px 40px rgba(0,0,0,.25);
  width: 100%;
  max-width: 420px;
  max-height: calc(100vh - 72px);
  overflow-y: auto;
  display: flex;
  flex-direction: column;
}
.ajustes-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 1rem 1.25rem;
  border-bottom: 1px solid var(--border);
  position: sticky;
  top: 0;
  background: var(--surface);
  z-index: 1;
}
.ajustes-title { font-size: 1rem; font-weight: 700; color: var(--text); }
.ajustes-close {
  background: none;
  border: none;
  font-size: 1.1rem;
  cursor: pointer;
  color: var(--muted);
  padding: .25rem .5rem;
  border-radius: var(--radius-sm);
  transition: background .15s, color .15s;
}
.ajustes-close:hover { background: var(--bg); color: var(--text); }
.ajustes-body { padding: 1rem 1.25rem; display: flex; flex-direction: column; gap: 1rem; }
.ajustes-recipient-card {
  background: var(--bg);
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  padding: .875rem 1rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
}
.ajustes-field { display: flex; align-items: center; gap: .5rem; }
.ajustes-field-label {
  font-size: .75rem;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .04em;
  min-width: 64px;
  flex-shrink: 0;
}
.ajustes-field-value { font-size: .9rem; color: var(--text); flex: 1; word-break: break-all; }
.ajustes-pencil {
  background: none;
  border: none;
  font-size: .9rem;
  color: var(--muted);
  cursor: not-allowed;
  opacity: .4;
  padding: .2rem .35rem;
  border-radius: var(--radius-sm);
  flex-shrink: 0;
}
.ajustes-empty { color: var(--muted); font-size: .9rem; text-align: center; padding: 1rem 0; }