:root {
  --bg: #0f172a;
  --panel: #1e293b;
  --panel-light: #273449;
  --accent: #3b82f6;
  --text: #e2e8f0;
  --text-dim: #94a3b8;
  --danger: #ef4444;
  --warn: #f59e0b;
  --border: #334155;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
}

.app { max-width: 800px; margin: 0 auto; padding: 20px; }

/* ---------- HERO (pagina principala) ---------- */
.landing-body { margin: 0; }

.hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(180deg, #7dc4e8 0%, #a8dff0 55%, #d9f2c4 100%);
  padding: 78px 20px 70px;
  text-align: center;
}

.public-account-bar {
  position: absolute;
  top: 18px;
  right: 22px;
  z-index: 120;
}

.top-signin-btn,
.account-menu-trigger {
  border: 1px solid rgba(22, 50, 79, 0.22);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.88);
  color: #16324f;
  padding: 9px 17px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 5px 16px rgba(22, 50, 79, 0.16);
  backdrop-filter: blur(8px);
}
.top-signin-btn:hover,
.account-menu-trigger:hover { background: white; }
.account-menu { position: relative; display: flex; align-items: center; gap: 8px; }
.account-menu-trigger {
  display: flex;
  align-items: center;
  gap: 7px;
  max-width: min(320px, calc(100vw - 44px));
}
.account-menu-trigger #account-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.account-avatar {
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: rgba(59, 130, 246, 0.12);
  font-size: 13px;
}
.account-dropdown {
  position: absolute;
  z-index: 130;
  top: calc(100% + 8px);
  right: 0;
  width: 190px;
  padding: 7px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--panel);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.3);
  text-align: left;
}
.account-dropdown button {
  display: block;
  width: 100%;
  padding: 9px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.account-dropdown button:hover { background: var(--panel-light); }
.account-dropdown .account-logout { color: var(--danger); }

.notification-bell {
  display: grid;
  place-items: center;
  position: relative;
  width: 43px;
  height: 43px;
  border: 1px solid rgba(22, 50, 79, 0.22);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 5px 16px rgba(22, 50, 79, 0.16);
  cursor: pointer;
}
.notification-bell-icon { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.notification-count, .tab-count {
  display: inline-grid;
  place-items: center;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
}
.notification-count { position: absolute; top: -5px; right: -5px; border: 2px solid white; }
.tab-count { margin-left: 5px; vertical-align: middle; }
.notification-dropdown {
  position: absolute;
  z-index: 125;
  top: calc(100% + 9px);
  right: 0;
  width: min(390px, calc(100vw - 30px));
  max-height: min(540px, 70vh);
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--panel);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.32);
  text-align: left;
}
.notification-heading { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--border); }
.notification-heading span { color: var(--muted); font-size: 12px; }
.notification-item { display: grid; grid-template-columns: 32px 1fr 8px; gap: 9px; width: 100%; padding: 12px 14px; border: 0; border-bottom: 1px solid var(--border); background: transparent; color: var(--text); text-align: left; cursor: pointer; }
.notification-item:hover, .notification-item.unread { background: rgba(59, 130, 246, 0.09); }
.notification-item span:nth-child(2) { min-width: 0; display: grid; gap: 3px; }
.notification-item strong, .notification-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.notification-item small, .notification-item time { color: var(--muted); font-size: 12px; }
.notification-item i { width: 7px; height: 7px; margin-top: 7px; border-radius: 50%; background: #2563eb; }
.notification-item-icon { font-size: 18px; }
.notification-empty { padding: 20px; }

.hero-decor { position: absolute; inset: 0; pointer-events: none; }

.hero-sun {
  position: absolute;
  top: 30px; right: 12%;
  width: 70px; height: 70px;
  border-radius: 50%;
  background: #ffe066;
  box-shadow: 0 0 40px 10px rgba(255, 224, 102, 0.6);
}

.hero-hill {
  position: absolute;
  bottom: -40px; left: -10%;
  width: 140%; height: 100px;
  background: #bfe6a0;
  border-radius: 50%;
}

.hero-house {
  position: absolute;
  bottom: 10px; left: 50%;
  transform: translateX(-50%);
  font-size: 54px;
  filter: drop-shadow(0 4px 6px rgba(0,0,0,0.15));
}

.hero-content { position: relative; max-width: 560px; margin: 0 auto; }
.hero-title { font-size: 30px; margin: 0 0 12px 0; color: #16324f; }
.hero-desc { font-size: 15px; color: #1e3a4c; line-height: 1.6; margin: 0; }

@media (max-width: 560px) {
  .hero { padding-top: 88px; }
  .public-account-bar { top: 14px; right: 14px; }
}

.landing-app { margin-top: -30px; position: relative; }

.landing-app { max-width: 1160px; }
.landing-app.portal-active { max-width: 920px; }

.portal-column { min-width: 0; }
.landing-app.portal-active .public-presentation { display: none; }
.landing-app.portal-active .parent-portal { margin-top: 0; }

@media (max-width: 900px) {
  .landing-app.portal-active { display: block; max-width: 800px; }
}

.board-section {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 20px;
  margin-bottom: 28px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.25);
}
.board-section h2 { margin-top: 0; }
.board-card .child-name { color: var(--accent); }

/* Prezentarea publică */
.public-presentation {
  overflow: hidden;
  border: 1px solid #dbe7dc;
  border-radius: 22px;
  background: #f8fbf7;
  color: #24372e;
  box-shadow: 0 18px 48px rgba(15, 23, 42, .22);
}
.presentation-intro { padding: 42px; background: linear-gradient(135deg, #fff 0%, #eef8e9 100%); text-align: center; }
.presentation-kicker, .public-section-heading > span { color: #448453; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.presentation-intro h2 { margin: 9px 0 12px; color: #173c29; font-size: clamp(27px, 4vw, 42px); }
.presentation-intro > p { max-width: 720px; margin: 0 auto; color: #52665b; font-size: 16px; line-height: 1.75; }
.presentation-highlights { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 25px; }
.presentation-highlights span { padding: 9px 13px; border: 1px solid #d5e7d7; border-radius: 999px; background: rgba(255,255,255,.86); color: #355943; font-size: 13px; font-weight: 700; }
.public-section-heading { padding: 38px 38px 8px; text-align: center; }
.public-section-heading h2 { margin: 6px 0 0; color: #173c29; font-size: 27px; }
.public-section-heading.compact { padding: 0; text-align: left; }
.public-section-heading.compact h2 { font-size: 22px; }
.public-feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; padding: 20px 32px 42px; }
.public-feature-grid article { padding: 22px 18px; border: 1px solid #dce9dd; border-radius: 15px; background: #fff; box-shadow: 0 7px 20px rgba(45,77,57,.07); }
.feature-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #eef8e9; font-size: 22px; }
.public-feature-grid h3 { margin: 14px 0 7px; color: #244d32; font-size: 16px; }
.public-feature-grid p { margin: 0; color: #65756c; font-size: 13px; line-height: 1.55; }
.public-two-columns { display: grid; grid-template-columns: 1.2fr .8fr; gap: 18px; padding: 36px 32px; background: #edf5ea; }
.calendar-card, .enrollment-card { padding: 27px; border: 1px solid #d7e4d5; border-radius: 17px; background: #fff; }
.demo-notice { padding: 9px 11px; border-radius: 8px; background: #fff6dc; color: #7a5a0a; font-size: 12px; line-height: 1.45; }
.calendar-list { display: grid; gap: 0; margin: 18px 0 0; padding: 0; list-style: none; }
.calendar-list li { display: grid; grid-template-columns: 118px 1fr; gap: 15px; padding: 14px 0; border-bottom: 1px solid #e4ece3; }
.calendar-list li:last-child { border-bottom: 0; }
.calendar-list time { color: #448453; font-size: 12px; font-weight: 800; }
.calendar-list div { display: grid; gap: 4px; }
.calendar-list strong { color: #2e4938; font-size: 14px; }
.calendar-list div span, .enrollment-card > p, .required-docs span { color: #6a796f; font-size: 12px; line-height: 1.5; }
.enrollment-steps { display: grid; gap: 11px; margin: 20px 0; padding: 0; list-style: none; }
.enrollment-steps li { display: flex; align-items: center; gap: 11px; color: #385945; font-size: 13px; font-weight: 700; }
.enrollment-steps b { display: grid; place-items: center; width: 29px; height: 29px; border-radius: 50%; background: #448453; color: #fff; }
.enrollment-form-btn { width: 100%; margin: 3px 0 15px; padding: 12px 15px; border: 0; border-radius: 10px; background: #448453; color: #fff; font-weight: 800; cursor: pointer; box-shadow: 0 7px 18px rgba(68,132,83,.24); }
.enrollment-form-btn:hover { background: #366d43; }
.enrollment-form-btn:disabled { opacity: .65; cursor: wait; }
.required-docs { display: grid; gap: 5px; padding: 14px; border-radius: 10px; background: #f2f7f0; }
.daily-program { padding: 38px 32px; }
.program-timeline { display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-top: 21px; }
.program-timeline span { display: grid; gap: 5px; padding: 14px 10px; border-radius: 11px; background: #edf5ea; color: #5a6f61; font-size: 11px; text-align: center; }
.program-timeline b { color: #2f7141; font-size: 14px; }
.public-contact-panel { display: flex; justify-content: space-between; gap: 25px; padding: 34px 38px; background: #234f34; color: #fff; }
.public-contact-panel h2 { margin: 6px 0; font-size: 26px; }
.public-contact-panel p { margin: 0; color: #c9dfce; font-size: 12px; }
.public-contact-panel .presentation-kicker { color: #a9d9b3; }
.public-contact-panel address { display: grid; align-content: center; gap: 8px; min-width: 285px; font-size: 13px; font-style: normal; }
.public-contact-panel a { color: #fff; text-decoration: none; }
.enrollment-modal-card { position: relative; width: min(760px, calc(100vw - 28px)); max-height: calc(100vh - 36px); overflow-y: auto; padding: 30px; border: 1px solid #d9e7da; border-radius: 18px; background: #f8fbf7; color: #24372e; box-shadow: 0 24px 60px rgba(0,0,0,.4); }
.enrollment-modal-card > h2 { margin: 7px 0; color: #173c29; font-size: 27px; }
.enrollment-modal-card > p { margin: 0 0 20px; color: #65756c; font-size: 13px; }
.enrollment-modal-card fieldset { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; margin: 0 0 15px; padding: 17px; border: 1px solid #dbe7dc; border-radius: 12px; background: #fff; }
.enrollment-modal-card legend { padding: 0 7px; color: #448453; font-size: 13px; font-weight: 800; }
.enrollment-modal-card label { display: grid; gap: 6px; color: #455a4c; font-size: 12px; font-weight: 700; }
.enrollment-modal-card input, .enrollment-modal-card select, .enrollment-modal-card textarea { width: 100%; padding: 10px 11px; border: 1px solid #cdddcf; border-radius: 8px; background: #fff; color: #1f3025; font: inherit; font-weight: 400; }
.form-date-parts { display: grid; align-content: start; gap: 6px; color: #455a4c; font-size: 12px; font-weight: 700; }
.form-date-parts > div { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; }
.form-date-parts > div label { display: grid; gap: 4px; min-width: 0; }
.form-date-parts small { color: #557260; font-size: 11px; font-weight: 800; }
.form-date-parts select { min-width: 0; padding-inline: 6px; }
.enrollment-modal-card textarea { resize: vertical; }
.enrollment-modal-card input[readonly] { background: #eef6ea; color: #356342; font-weight: 800; }
.enroll-age-error { min-height: 0; margin: -5px 0 0; color: #b42318; font-size: 12px; font-weight: 700; }
.enrollment-modal-card .full-field { grid-column: 1 / -1; }
.enrollment-modal-card .enrollment-consent { display: flex; grid-template-columns: none; align-items: flex-start; gap: 9px; margin: 16px 2px; font-weight: 500; line-height: 1.5; }
.enrollment-consent input { width: auto; margin-top: 3px; }
.required-fields-note { margin: 12px 2px 0 !important; color: #6b5b22 !important; font-size: 12px !important; }
.required-fields-note strong { color: #b42318; }
.consent-submit-info { margin: -7px 2px 14px !important; padding: 10px 12px; border-radius: 8px; background: #eef6ea; color: #496352 !important; font-size: 12px !important; line-height: 1.5; }
.enrollment-form-message { min-height: 20px; margin: 0 !important; color: #b42318 !important; font-weight: 700; text-align: center; }
.enrollment-form-message.success { color: #2f7a42 !important; }
.enrollment-admin-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 18px; }
.enrollment-admin-heading h2 { margin: 0 0 5px; }
.enrollment-admin-heading p { margin: 0; color: var(--text-dim); font-size: 13px; }
.enrollment-admin-list button { padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px; background: var(--panel-light); color: var(--text); cursor: pointer; }
.enrollment-search { display: grid; gap: 6px; min-width: min(310px, 100%); color: var(--text-dim); font-size: 12px; font-weight: 700; }
.enrollment-search input { width: 100%; padding: 10px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--panel-light); color: var(--text); outline: none; }
.enrollment-search input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px rgba(59,130,246,.14); }
.enrollment-admin-list { display: grid; gap: 10px; }
.enrollment-admin-list article { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-light); }
.enrollment-admin-list article > div { display: grid; gap: 5px; }
.enrollment-admin-list strong { color: #86b7ff; }
.enrollment-admin-list span { color: var(--text-dim); font-size: 12px; overflow-wrap: anywhere; }
.tab-notification-count { display: inline-grid; place-items: center; min-width: 20px; height: 20px; margin-left: 5px; padding: 0 6px; border-radius: 999px; background: #ef4444; color: #fff; font-size: 11px; font-weight: 900; line-height: 1; box-shadow: 0 0 0 2px rgba(239,68,68,.18); }
.calendar-admin-heading { margin-bottom: 16px; }
.calendar-admin-heading h2 { margin: 0 0 5px; }
.calendar-admin-heading p { margin: 0; color: var(--text-dim); font-size: 13px; }
.calendar-event-form { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 22px; padding: 16px; border: 1px solid var(--border); border-radius: 11px; background: var(--panel-light); }
.calendar-event-form label { display: grid; gap: 6px; color: var(--text-dim); font-size: 12px; font-weight: 700; }
.calendar-event-form input, .calendar-event-form textarea { width: 100%; padding: 10px 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--panel); color: var(--text); font: inherit; }
.calendar-event-form input[readonly] { background: rgba(15,23,42,.65); color: #8fbea0; font-weight: 700; }
.date-parts-fieldset { display: grid; grid-template-columns: .7fr 1.3fr 1fr; gap: 6px; margin: 0; padding: 9px; border: 1px solid var(--border); border-radius: 9px; }
.date-parts-fieldset legend { padding: 0 5px; color: var(--text-dim); font-size: 12px; font-weight: 700; }
.date-parts-fieldset select { min-width: 0; padding: 9px 6px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel); color: var(--text); }
.calendar-event-form .calendar-description-field, .calendar-event-form #calendar-event-message { grid-column: 1 / -1; }
.calendar-form-actions { display: flex; gap: 8px; grid-column: 1 / -1; }
.calendar-form-actions button { padding: 10px 13px; border: 1px solid var(--border); border-radius: 8px; background: var(--accent); color: #fff; cursor: pointer; }
.calendar-form-actions #calendar-event-cancel { background: var(--panel); }
.calendar-admin-list { display: grid; gap: 10px; }
.calendar-admin-list article { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 15px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-light); }
.calendar-admin-list article > div:first-child { display: grid; gap: 5px; }
.calendar-admin-list strong { color: #86b7ff; }
.calendar-admin-list span, .calendar-admin-list p { margin: 0; color: var(--text-dim); font-size: 12px; }
.calendar-admin-list article > div:last-child { display: flex; gap: 7px; }
.calendar-admin-list button { padding: 8px 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel); color: var(--text); cursor: pointer; }
.calendar-admin-list .calendar-delete-btn { color: #fda4af; }
@media (max-width: 850px) {
  .public-feature-grid { grid-template-columns: repeat(2, 1fr); }
  .public-two-columns { grid-template-columns: 1fr; }
  .program-timeline { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 560px) {
  .presentation-intro { padding: 32px 20px; }
  .public-section-heading { padding-inline: 20px; }
  .public-feature-grid, .public-two-columns, .daily-program { padding: 22px 16px; }
  .public-feature-grid { grid-template-columns: 1fr; }
  .calendar-card, .enrollment-card { padding: 20px; }
  .calendar-list li { grid-template-columns: 1fr; gap: 6px; }
  .program-timeline { grid-template-columns: repeat(2, 1fr); }
  .public-contact-panel { display: grid; padding: 28px 20px; }
  .public-contact-panel address { min-width: 0; }
  .enrollment-modal-card { padding: 24px 16px; }
  .enrollment-modal-card fieldset { grid-template-columns: 1fr; }
  .enrollment-admin-list article, .enrollment-admin-heading { align-items: stretch; flex-direction: column; }
  .calendar-event-form { grid-template-columns: 1fr; }
  .calendar-admin-list article { align-items: stretch; flex-direction: column; }
}

/* Pagina de start */
.access-section { text-align: center; padding: 10px 0 30px; }

.signin-btn {
  background: var(--accent);
  color: white;
  border: none;
  padding: 16px 48px;
  border-radius: 999px;
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(59, 130, 246, 0.35);
}
.signin-btn:hover { filter: brightness(1.08); }

.auth-overlay.hidden { display: none; }

.auth-box.wide { max-width: 380px; position: relative; }

.modal-close {
  position: absolute;
  top: 10px; right: 12px;
  background: none;
  border: none;
  color: var(--text-dim);
  font-size: 16px;
  cursor: pointer;
}

.auth-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 14px;
}
.auth-links a {
  color: var(--accent);
  font-size: 13px;
  text-decoration: none;
}
.auth-links a:hover { text-decoration: underline; }

.forgot-text {
  color: var(--text-dim);
  font-size: 14px;
  line-height: 1.6;
  text-align: left;
  margin: 0 0 6px 0;
}

#view-register select {
  width: 100%;
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px;
  font-size: 14px;
  margin-bottom: 12px;
}

/* Link inapoi */
.back-link {
  display: inline-block;
  color: var(--text-dim);
  text-decoration: none;
  font-size: 13px;
  margin-bottom: 8px;
}
.back-link:hover { color: var(--text); }

/* Panou admin */
.admin-section {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 18px;
  margin-bottom: 24px;
}

.admin-section h2 { margin-top: 0; }

.admin-table { width: 100%; border-collapse: collapse; font-size: 13px; margin-bottom: 16px; }
.admin-table th, .admin-table td {
  text-align: left;
  padding: 8px 10px;
  border-bottom: 1px solid var(--border);
}
.admin-table th { color: var(--text-dim); font-weight: 500; }

.row-actions { display: flex; gap: 10px; }
.row-actions button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 13px;
  padding: 0;
}
.edit-btn { color: var(--accent); }
.delete-btn { color: var(--danger); }

.inline-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.inline-form input, .inline-form select {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px;
  font-size: 13px;
  flex: 1;
  min-width: 140px;
}

.inline-form button {
  background: var(--accent);
  color: white;
  border: none;
  padding: 8px 14px;
  border-radius: 6px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.inline-form .cancel-btn {
  background: var(--panel-light);
  color: var(--text-dim);
}

/* Administrare modernă, organizată pe secțiuni */
.admin-app { max-width: 1180px; padding-top: 14px; }
.admin-app > .topbar {
  margin-bottom: 12px;
  padding: 14px 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: rgba(30, 41, 59, 0.92);
}
.admin-app > .topbar h1 { font-size: 21px; }
.admin-navigation {
  position: sticky;
  top: 8px;
  z-index: 50;
  display: flex;
  gap: 7px;
  margin-bottom: 16px;
  padding: 8px;
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(15, 23, 42, 0.94);
  backdrop-filter: blur(12px);
}
.admin-nav-btn {
  flex: 1;
  min-width: max-content;
  padding: 10px 13px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-dim);
  font-weight: 600;
  cursor: pointer;
}
.admin-nav-btn:hover { background: var(--panel-light); color: var(--text); }
.admin-nav-btn.active { background: var(--accent); color: white; }
.admin-main { min-height: 580px; }
.admin-panel { display: none; margin-bottom: 0; }
.admin-panel.active { display: block; animation: admin-panel-in 160ms ease-out; }
.report-filters { display: grid; grid-template-columns: repeat(3, minmax(150px, 1fr)) auto; gap: 12px; align-items: end; margin: 20px 0; padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-light); }
.report-filters label { display: grid; gap: 6px; color: var(--text-dim); font-size: 12px; font-weight: 700; }
.report-filters input, .report-filters select { padding: 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--panel); color: var(--text); }
.report-filters button { padding: 11px 15px; border: 0; border-radius: 7px; background: #2563eb; color: white; cursor: pointer; }
.report-summary-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.report-summary-grid > div { display: grid; gap: 6px; padding: 16px; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-light); }
.report-summary-grid span { color: var(--text-dim); font-size: 12px; }
.report-summary-grid strong { color: #86b7ff; font-size: 25px; }
@media (max-width: 800px) { .report-filters { grid-template-columns: 1fr 1fr; } .report-summary-grid { grid-template-columns: 1fr 1fr; } }
@keyframes admin-panel-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

.dashboard-eyebrow {
  display: block;
  margin-bottom: 6px;
  color: var(--accent);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.dashboard-welcome h2 { margin-bottom: 5px; font-size: 25px; }
.admin-stat-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin: 22px 0 26px;
}
.admin-stat-card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-height: 132px;
  padding: 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--panel-light);
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.admin-stat-card:hover { border-color: var(--accent); transform: translateY(-1px); }
.admin-stat-card span { color: var(--text-dim); font-size: 12px; }
.admin-stat-card strong { margin: 9px 0 auto; font-size: 31px; }
.admin-stat-card small { color: var(--accent); }
.admin-quick-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}
.admin-quick-actions > button {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: var(--text);
  text-align: left;
  cursor: pointer;
}
.admin-quick-actions > button:hover { background: var(--panel-light); border-color: var(--accent); }
.admin-quick-actions > button > span {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 9px;
  background: rgba(59, 130, 246, 0.14);
  color: var(--accent);
  font-size: 20px;
}
.admin-quick-actions strong, .admin-quick-actions small { display: block; }
.admin-quick-actions small { margin-top: 3px; color: var(--text-dim); }
.server-monitor {
  margin: 0 0 26px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: linear-gradient(145deg, rgba(39, 52, 73, 0.78), rgba(30, 41, 59, 0.9));
}
.server-monitor-heading {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 15px;
}
.server-monitor-heading h3 { margin: 5px 0 0; font-size: 19px; }
.server-status-line { display: flex; align-items: center; gap: 7px; color: var(--text-dim); font-size: 12px; }
#server-status-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--text-dim);
}
#server-status-dot.online { background: #22c55e; box-shadow: 0 0 0 4px rgba(34, 197, 94, 0.12); }
#server-status-dot.restarting { background: var(--warn); box-shadow: 0 0 0 4px rgba(245, 158, 11, 0.12); }
#server-status-dot.offline { background: var(--danger); box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.12); }
.restart-server-btn {
  padding: 9px 12px;
  border: 1px solid rgba(245, 158, 11, 0.45);
  border-radius: 8px;
  background: rgba(245, 158, 11, 0.1);
  color: var(--warn);
  font-weight: 700;
  cursor: pointer;
}
.restart-server-btn:hover { background: rgba(245, 158, 11, 0.18); }
.restart-server-btn:disabled { opacity: 0.55; cursor: wait; }
.server-monitor-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.maintenance-toggle-btn {
  border: 1px solid rgba(14, 165, 233, 0.48);
  border-radius: 9px;
  background: rgba(14, 165, 233, 0.12);
  color: #075985;
  padding: 9px 13px;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}
.maintenance-toggle-btn:hover { background: rgba(14, 165, 233, 0.2); }
.maintenance-toggle-btn[data-enabled="true"] {
  border-color: rgba(34, 197, 94, 0.5);
  background: rgba(34, 197, 94, 0.14);
  color: #166534;
}
.maintenance-toggle-btn:disabled { opacity: 0.55; cursor: wait; }
.server-clock {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 14px;
  padding: 12px 14px;
  border-radius: 10px;
  background: rgba(15, 23, 42, 0.55);
}
.server-clock span { color: var(--text-dim); font-size: 12px; }
.server-clock strong { text-align: right; font-size: 15px; }
.server-metrics {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}
.server-metrics > div {
  min-height: 72px;
  padding: 11px;
  border: 1px solid rgba(51, 65, 85, 0.75);
  border-radius: 9px;
  background: rgba(15, 23, 42, 0.32);
}
.server-metrics span, .server-metrics small { display: block; color: var(--text-dim); font-size: 11px; }
.server-metrics strong { display: block; margin-top: 7px; font-size: 15px; }
.server-metrics small { margin-top: 4px; }
.server-restart-message { margin: 12px 0 0; color: var(--warn); font-size: 12px; }
.role-legend { display: flex; gap: 7px; flex-wrap: wrap; }
.role-legend span {
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
}
.role-parent { background: rgba(59, 130, 246, 0.14); color: var(--accent); }
.role-educator { background: rgba(34, 197, 94, 0.14); color: #22c55e; }
.role-monitor { background: rgba(168, 85, 247, 0.14); color: #c084fc; }
.unified-account-form {
  margin: 18px 0 28px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: rgba(39, 52, 73, 0.42);
}
.unified-account-form label {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: var(--text-dim);
  font-size: 12px;
}
.unified-account-form input, .unified-account-form select {
  width: 100%;
  padding: 9px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--panel-light);
  color: var(--text);
}
.role-fields, .account-credentials {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.role-fields.hidden { display: none; }
.role-description { grid-column: 1 / -1; margin: 0; color: var(--text-dim); font-size: 12px; }
.unified-account-form > button {
  margin-top: 14px;
  padding: 10px 15px;
  border: 0;
  border-radius: 8px;
  background: var(--accent);
  color: white;
  font-weight: 700;
  cursor: pointer;
}
#unified-account-message { margin-bottom: 0; color: var(--text-dim); font-size: 13px; }
.admin-data-table { max-height: 54vh; margin-bottom: 16px; }
.admin-data-table .admin-table { margin-bottom: 0; min-width: 680px; }
.admin-data-table thead, .audit-table thead { position: sticky; top: 0; z-index: 2; background: var(--panel); }
.admin-panel .inline-form {
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(39, 52, 73, 0.45);
}

@media (max-width: 820px) {
  .admin-stat-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .server-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .admin-navigation { justify-content: flex-start; }
  .admin-nav-btn { flex: 0 0 auto; }
}
@media (max-width: 560px) {
  .admin-app { padding: 10px; }
  .admin-stat-grid, .admin-quick-actions { grid-template-columns: 1fr; }
  .server-monitor-heading, .server-clock { align-items: stretch; flex-direction: column; }
  .server-clock strong { text-align: left; }
  .server-metrics { grid-template-columns: 1fr; }
  .role-fields, .account-credentials { grid-template-columns: 1fr; }
  .admin-stat-card { min-height: 112px; }
}

/* Selector copil comun (pagina parinte) */
.child-picker {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 20px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 14px;
}

.child-picker label {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: var(--text-dim);
  gap: 4px;
  flex: 1;
  min-width: 160px;
}

.child-picker select {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px;
  font-size: 14px;
}

/* Formular vertical (anunturi, teme) */
.stacked-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 460px;
}

.stacked-form label {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: var(--text-dim);
  gap: 4px;
}

.stacked-form input, .stacked-form select, .stacked-form textarea {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 9px;
  font-size: 14px;
  font-family: inherit;
  resize: vertical;
}

.stacked-form button {
  background: var(--accent);
  color: white;
  border: none;
  padding: 10px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
}

#ann-msg, #hw-msg { font-size: 14px; color: var(--accent); }

.absence-list .absence-card .delete-btn {
  background: none;
  border: none;
  color: var(--danger);
  cursor: pointer;
  font-size: 16px;
  align-self: flex-start;
}

/* Ecran de login (overlay peste toata pagina) */
.auth-overlay {
  position: fixed;
  inset: 0;
  background: var(--bg);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1000;
}

.auth-box {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 14px;
  padding: 32px 28px;
  width: 100%;
  max-width: 320px;
  text-align: center;
}

.auth-icon { font-size: 32px; margin-bottom: 4px; }
.auth-box h2 { margin: 8px 0 4px 0; font-size: 18px; }
.auth-box p { color: var(--text-dim); font-size: 13px; margin: 0 0 16px 0; }

.auth-box input {
  width: 100%;
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px;
  font-size: 15px;
  margin-bottom: 12px;
  text-align: center;
}

.auth-box button {
  width: 100%;
  background: var(--accent);
  color: white;
  border: none;
  padding: 11px;
  border-radius: 8px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
}

.auth-error { color: var(--danger) !important; font-size: 13px; margin-top: 10px !important; min-height: 16px; }

/* Buton iesire */
.logout-btn {
  background: none;
  border: 1px solid var(--border);
  color: var(--text-dim);
  padding: 6px 12px;
  border-radius: 6px;
  font-size: 12px;
  cursor: pointer;
  margin-left: auto;
}

.active-session { text-align: center; }
.active-session p { color: var(--text-dim); margin: 0 0 10px; }
.session-actions {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.session-actions .logout-btn { margin-left: 0; padding: 10px 18px; }

.topbar h1 { margin: 0 0 16px 0; font-size: 22px; display: inline-block; }
.topbar { position: relative; }
.topbar-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.topbar-row h1 { margin: 0; }
.role-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-dim);
  background: var(--panel-light);
  font-size: 11px;
  font-weight: 600;
}
.topbar-row .back-link { margin: 0; }
.child-info { color: var(--text-dim); font-size: 13px; margin: 4px 0 12px 0; }
.hint-text { color: var(--text-dim); font-size: 13px; margin: -4px 0 14px 0; }

.tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--border);
  padding-bottom: 12px;
  margin-bottom: 20px;
}

.tab-btn {
  background: var(--panel);
  color: var(--text-dim);
  border: 1px solid var(--border);
  padding: 8px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
}

/* Buton discret pentru închiderea ferestrei Sign In */
.auth-box .modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 50%;
  background: var(--panel-light);
  color: var(--text-dim);
  font-size: 12px;
  line-height: 26px;
  font-weight: 500;
  box-shadow: none;
}

.auth-box .modal-close:hover {
  background: var(--border);
  color: var(--text);
}

.tab-btn.active {
  background: var(--accent);
  color: white;
  font-weight: 600;
  border-color: var(--accent);
}

.tab-panel { display: none; }
.tab-panel.active { display: block; }

h2 { font-size: 18px; margin-top: 0; }

/* Formular parinte */
#absence-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 420px;
}

#absence-form label {
  display: flex;
  flex-direction: column;
  font-size: 13px;
  color: var(--text-dim);
  gap: 4px;
}

#absence-form input, #absence-form select {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 9px;
  font-size: 14px;
}

#absence-form button {
  background: var(--accent);
  color: white;
  border: none;
  padding: 11px;
  border-radius: 8px;
  font-weight: 600;
  cursor: pointer;
  margin-top: 4px;
}

#form-msg { font-size: 14px; color: var(--accent); }

.status-buttons {
  display: flex;
  gap: 10px;
  margin-top: 4px;
}

.status-btn {
  flex: 1;
  padding: 14px;
  border-radius: 10px;
  border: 2px solid var(--border);
  background: var(--panel);
  color: var(--text);
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
}

.present-btn.selected {
  background: rgba(34, 197, 94, 0.15);
  border-color: #22c55e;
  color: #22c55e;
}

.absent-btn.selected {
  background: rgba(239, 68, 68, 0.15);
  border-color: var(--danger);
  color: var(--danger);
}

.absent-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.hidden { display: none !important; }

/* Filtru educatoare */
.filter-label {
  display: block;
  font-size: 13px;
  color: var(--text-dim);
  margin-bottom: 14px;
}

.summary-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.summary-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.summary-card span { color: var(--text-dim); font-size: 12px; }
.summary-card strong { font-size: 26px; line-height: 1; }
.summary-present strong { color: #22c55e; }
.summary-absent strong { color: var(--danger); }
.summary-pending strong { color: var(--warn); }

@media (max-width: 640px) {
  .summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.filter-label select {
  display: block;
  margin-top: 4px;
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 8px;
  font-size: 14px;
  max-width: 300px;
}

/* Lista absente */
.absence-list { display: flex; flex-direction: column; gap: 10px; }

.absence-card {
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 12px 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
}

.absence-card .child-name { font-weight: 600; }
.absence-card .class-name { font-size: 12px; color: var(--text-dim); }
.absence-card .note { font-size: 13px; color: var(--text-dim); margin-top: 2px; }
.absence-card .parent-info { font-size: 12px; color: var(--text-dim); }

.reason-badge {
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.reason-bolnav { background: rgba(239, 68, 68, 0.15); color: var(--danger); }
.reason-vacanta { background: rgba(59, 130, 246, 0.15); color: var(--accent); }
.reason-altul { background: rgba(245, 158, 11, 0.15); color: var(--warn); }
.reason-prezent { background: rgba(34, 197, 94, 0.15); color: #22c55e; }
.reason-neanuntat { background: rgba(148, 163, 184, 0.15); color: var(--text-dim); }

.empty-msg { color: var(--text-dim); font-style: italic; }

.account-status {
  display: inline-block;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: 12px;
  white-space: nowrap;
}
.status-active { background: rgba(34, 197, 94, 0.15); color: #22c55e; }
.status-pending { background: rgba(245, 158, 11, 0.15); color: var(--warn); }
.reset-btn { color: var(--warn); }

.admin-access-link {
  display: block;
  width: fit-content;
  margin: 20px auto 0;
  color: var(--text-dim);
  font-size: 12px;
  text-decoration: none;
}
.admin-access-link:hover { color: var(--text); }

.parent-portal {
  margin-top: 24px;
  padding: 24px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 16px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16);
}
.parent-portal-header h2 { margin: 8px 0 2px; font-size: 22px; }
.parent-tabs { margin-top: 18px; }
.section-intro { margin-top: -6px; color: var(--text-dim); }
.class-events-list { display: grid; gap: 12px; margin-top: 16px; }
.class-event-card { display: grid; grid-template-columns: 82px 1fr auto; gap: 15px; align-items: start; padding: 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--panel-light); }
.class-event-date { display: grid; gap: 4px; padding: 10px 6px; border-radius: 10px; background: rgba(59, 130, 246, .13); color: #86b7ff; text-align: center; }
.class-event-date strong { font-size: 16px; text-transform: capitalize; }
.class-event-date span { color: var(--text-dim); font-size: 11px; }
.class-event-details h3 { margin: 5px 0; }
.class-event-details p { margin: 0 0 9px; color: var(--text-dim); }
.event-type { display: inline-block; padding: 3px 8px; border-radius: 999px; background: rgba(34, 197, 94, .13); color: #86efac; font-size: 11px; font-weight: 800; text-transform: uppercase; }
.event-confirmation { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.event-confirmation button { padding: 7px 10px; border: 0; border-radius: 7px; background: #15803d; color: white; cursor: pointer; }
.event-confirmation .decline-event { background: #b91c1c; }
.event-confirmation button:disabled { opacity: .55; cursor: not-allowed; }
.event-confirmation small { flex-basis: 100%; color: var(--text-dim); }
.class-event-form { margin-bottom: 18px; }
@media (max-width: 650px) { .class-event-card { grid-template-columns: 70px 1fr; } .class-event-card > .delete-btn { grid-column: 2; justify-self: start; } }
.journal-list { display: grid; gap: 14px; margin-top: 16px; }
.journal-card { overflow: hidden; border: 1px solid var(--border); border-radius: 13px; background: var(--panel-light); }
.journal-card-heading { display: flex; justify-content: space-between; gap: 15px; padding: 14px 16px; border-bottom: 1px solid var(--border); background: rgba(59, 130, 246, .08); }
.journal-card-heading > div { display: grid; gap: 3px; }
.journal-card-heading time { color: #86b7ff; font-weight: 800; text-transform: capitalize; }
.journal-card-heading span { color: var(--text-dim); font-size: 11px; }
.journal-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--border); }
.journal-metrics > div { display: grid; gap: 4px; padding: 13px 16px; background: var(--panel-light); }
.journal-metrics span { color: var(--text-dim); font-size: 12px; }
.journal-text { padding: 15px 16px; }
.journal-text p { margin: 4px 0 13px; color: var(--text-dim); white-space: pre-wrap; }
@media (max-width: 600px) { .journal-metrics { grid-template-columns: 1fr; } }
.weekly-menu-heading { display: flex; justify-content: space-between; gap: 20px; align-items: flex-start; }
.week-navigation { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px; }
.week-navigation button { padding: 8px 10px; border: 1px solid var(--border); border-radius: 8px; background: var(--panel-light); color: var(--text); cursor: pointer; }
.week-navigation strong { min-width: 170px; color: #86b7ff; text-align: center; text-transform: capitalize; }
.educator-menu-navigation { margin: 20px 0 14px; }
.weekly-menu-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; overflow: visible; padding: 3px 2px 12px; }
.meal-day-card { min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 13px; background: var(--panel-light); }
.meal-day-card header { display: flex; justify-content: space-between; gap: 8px; padding: 13px; border-bottom: 1px solid var(--border); background: rgba(59, 130, 246, .1); }
.meal-day-card header > div:first-child { display: grid; gap: 3px; }
.meal-day-card header span { color: #86b7ff; font-size: 12px; font-weight: 800; text-transform: capitalize; }
.meal-day-card header strong { font-size: 14px; text-transform: capitalize; }
.meal-day-card header button { padding: 5px 7px; border: 1px solid var(--border); border-radius: 6px; background: var(--panel); color: var(--text); cursor: pointer; }
.meal-day-card dl { margin: 0; }
.meal-day-card dl > div { padding: 11px 13px; border-bottom: 1px solid var(--border); }
.meal-day-card dt { margin-bottom: 4px; color: var(--text-dim); font-size: 11px; font-weight: 800; }
.meal-day-card dd { margin: 0; font-size: 13px; white-space: pre-wrap; }
.allergen-box { display: grid; gap: 4px; margin: 11px; padding: 9px; border: 1px solid rgba(245, 158, 11, .35); border-radius: 8px; background: rgba(245, 158, 11, .09); }
.allergen-box strong { color: #fbbf24; font-size: 11px; text-transform: uppercase; }
.allergen-box span { font-size: 12px; }
.meal-day-empty { opacity: .72; }
.meal-menu-form { margin-top: 16px; }
@media (max-width: 1100px) { .weekly-menu-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .weekly-menu-heading { flex-direction: column; } .week-navigation { width: 100%; } .weekly-menu-grid { grid-template-columns: 1fr; } }
.locked-date {
  display: flex;
  gap: 7px;
  align-items: baseline;
  flex-wrap: wrap;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--panel-light);
  color: var(--text);
}
.locked-date span { color: var(--text-dim); font-size: 12px; }
#parent-attendance-form {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 480px;
}
#parent-attendance-form label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: var(--text-dim);
  font-size: 13px;
}
#parent-attendance-form input,
#parent-attendance-form select {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 9px;
}
#parent-submit-btn {
  background: var(--accent);
  color: white;
  border: 0;
  border-radius: 8px;
  padding: 11px;
  font-weight: 600;
  cursor: pointer;
}

.admin-login-body {
  min-height: 100vh;
  display: grid;
  place-items: center;
  background: var(--bg);
  padding: 24px;
}
.admin-login-shell { width: min(100%, 420px); }
.admin-login-shell > .back-link { display: inline-block; margin-bottom: 16px; }
.admin-login-box { max-width: none; position: relative; }
.admin-login-box h1 { font-size: 22px; margin: 8px 0; }

.section-heading-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.audit-controls { display: flex; gap: 8px; align-items: center; }
.audit-controls select {
  background: var(--panel-light);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 7px 9px;
}
.table-scroll { overflow-x: auto; }
.audit-table { min-width: 760px; }
.http-method { font-size: 10px; font-weight: 700; color: var(--text-dim); margin-right: 5px; }
.audit-result { padding: 3px 8px; border-radius: 999px; font-size: 11px; white-space: nowrap; }
.audit-success { background: rgba(34, 197, 94, 0.15); color: #22c55e; }
.audit-failure { background: rgba(239, 68, 68, 0.15); color: var(--danger); }

.new-badge {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--accent);
  color: white;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.03em;
  line-height: 1.4;
  vertical-align: middle;
  box-shadow: 0 3px 9px rgba(59, 130, 246, 0.28);
}

.checkbox-label {
  flex-direction: row !important;
  align-items: center;
  gap: 8px !important;
  cursor: pointer;
}
.checkbox-label input { width: auto !important; margin: 0; }
.checkbox-label.disabled-option { opacity: 0.45; cursor: not-allowed; }

.announcement-conversation {
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--panel);
}
.announcement-conversation .absence-card { padding: 0; border: 0; background: transparent; }
.announcement-main { cursor: default; }
.confirmation-box {
  margin-top: 13px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
}
.confirmation-box > strong { display: block; margin-bottom: 8px; font-size: 13px; }
.confirmation-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.confirmation-actions button,
.open-message-btn,
.private-reply button {
  border: 1px solid var(--border);
  border-radius: 7px;
  padding: 8px 11px;
  background: var(--panel-light);
  color: var(--text);
  cursor: pointer;
}
.confirmation-actions .confirm-yes.selected { border-color: #22c55e; color: #22c55e; background: rgba(34, 197, 94, 0.12); }
.confirmation-actions .confirm-no.selected { border-color: var(--danger); color: var(--danger); background: rgba(239, 68, 68, 0.12); }
.confirmation-actions button:disabled { cursor: not-allowed; opacity: 0.55; }
.confirmation-actions button.selected:disabled { opacity: 1; }
.private-message-content { margin-top: 8px; }
.response-status { display: block; margin-top: 7px; color: var(--text-dim); font-size: 12px; }
.open-message-btn { margin-top: 12px; color: var(--accent); }
.private-reply { margin-top: 10px; }
.private-reply textarea {
  width: 100%;
  margin-bottom: 7px;
  padding: 9px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--panel-light);
  color: var(--text);
  resize: vertical;
}
.sent-comment, .parent-comment {
  padding: 9px 11px;
  border-radius: 7px;
  background: rgba(59, 130, 246, 0.1);
  color: var(--text-dim);
  font-size: 13px;
}
.educator-response-panel, .private-message-status {
  margin-top: 12px;
  padding-top: 11px;
  border-top: 1px solid var(--border);
}
.response-summary { display: flex; gap: 12px; flex-wrap: wrap; color: var(--text-dim); font-size: 12px; }
.educator-response-panel details { margin-top: 9px; }
.educator-response-panel summary { cursor: pointer; color: var(--accent); font-size: 13px; }
.educator-response-panel ul { list-style: none; padding: 0; margin: 8px 0 0; }
.educator-response-panel li { display: flex; justify-content: space-between; gap: 10px; padding: 5px 0; font-size: 12px; border-bottom: 1px solid var(--border); }
.educator-response-panel .participa, .read-status { color: #22c55e; }
.educator-response-panel .nu_participa, .unread-status { color: var(--danger); }
.educator-response-panel .pending { color: var(--text-dim); }
.private-message-status > span { font-size: 12px; font-weight: 600; }

/* Ecran TV pentru monitorizarea prezenței */
.monitor-body {
  min-height: 100vh;
  background: #08111f;
  color: #f1f5f9;
}
.monitor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 20px 28px;
  border-bottom: 1px solid #23324a;
  background: #0d192b;
}
.monitor-kicker { color: #60a5fa; font-size: 12px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.monitor-header h1 { margin: 4px 0 0; font-size: clamp(25px, 3vw, 40px); }
.monitor-header-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
.monitor-connection { display: flex; align-items: center; gap: 7px; margin-right: 8px; color: #94a3b8; font-size: 12px; }
#monitor-status-dot { width: 9px; height: 9px; border-radius: 50%; background: #64748b; }
#monitor-status-dot.online { background: #22c55e; box-shadow: 0 0 12px #22c55e; }
#monitor-status-dot.offline { background: #ef4444; box-shadow: 0 0 12px #ef4444; }
.monitor-header button { padding: 8px 11px; border: 1px solid #334155; border-radius: 7px; background: #17243a; color: #cbd5e1; cursor: pointer; }
.monitor-main { padding: 22px 28px 32px; }
.monitor-summary {
  display: grid;
  grid-template-columns: 1.7fr repeat(4, minmax(130px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.monitor-summary > div {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100px;
  padding: 16px;
  border: 1px solid #23324a;
  border-radius: 13px;
  background: #101d31;
}
.monitor-summary span { color: #94a3b8; font-size: 13px; }
.monitor-summary strong { margin-top: 6px; font-size: clamp(27px, 3vw, 42px); }
.monitor-clock strong { font-variant-numeric: tabular-nums; color: #60a5fa; }
.monitor-present strong { color: #22c55e; }
.monitor-absent strong { color: #f87171; }
.monitor-pending strong { color: #fbbf24; }
.monitor-classes { display: grid; grid-template-columns: repeat(auto-fit, minmax(430px, 1fr)); gap: 16px; }
.monitor-class-card { overflow: hidden; border: 1px solid #23324a; border-radius: 14px; background: #0d192b; }
.monitor-class-card > header { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 15px 18px; border-bottom: 1px solid #23324a; }
.monitor-class-card h2 { margin: 0 0 3px; font-size: 20px; }
.monitor-class-card header span { color: #94a3b8; font-size: 12px; }
.monitor-class-card header > strong { color: #60a5fa; font-size: 25px; }
.monitor-child-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 13px; }
.monitor-child { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 8px; background: #17243a; }
.monitor-child span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.monitor-child strong { flex: 0 0 auto; font-size: 11px; }
.monitor-child.monitor-prezent { border-left: 4px solid #22c55e; }.monitor-child.monitor-prezent strong { color: #22c55e; }
.monitor-child.monitor-absent { border-left: 4px solid #ef4444; }.monitor-child.monitor-absent strong { color: #f87171; }
.monitor-child.monitor-neanuntat { border-left: 4px solid #f59e0b; }.monitor-child.monitor-neanuntat strong { color: #fbbf24; }
@media (max-width: 900px) {
  .monitor-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .monitor-clock { grid-column: 1 / -1; }
  .monitor-classes { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .monitor-header { align-items: flex-start; flex-direction: column; padding: 16px; }
  .monitor-header-actions { justify-content: flex-start; }
  .monitor-main { padding: 14px; }
  .monitor-summary { grid-template-columns: 1fr 1fr; }
  .monitor-child-grid { grid-template-columns: 1fr; }
}
.monitor-password-dialog {
  width: min(92vw, 440px);
  border: 0;
  border-radius: 22px;
  padding: 0;
  box-shadow: 0 24px 80px rgba(15, 23, 42, .35);
}
.monitor-password-dialog::backdrop { background: rgba(15, 23, 42, .72); backdrop-filter: blur(6px); }
.monitor-password-dialog form { display: grid; gap: 14px; padding: 28px; }
.monitor-password-dialog h2, .monitor-password-dialog p { margin: 0; }
.monitor-password-dialog label { display: grid; gap: 6px; font-weight: 700; }
.monitor-password-dialog input { padding: 12px; border: 1px solid #cbd5e1; border-radius: 10px; font: inherit; }
.monitor-password-dialog button { padding: 13px; border: 0; border-radius: 10px; background: #2563eb; color: white; font-weight: 800; cursor: pointer; }
.monitor-password-dialog .monitor-password-error { min-height: 20px; color: #b91c1c; font-weight: 700; }
.status-btn:disabled { cursor: not-allowed; opacity: .55; }
.status-btn.selected:disabled { opacity: 1; }

/* Administrare inspirată de Windows Server 2019 */
body:has(.admin-app) {
  min-height: 100vh;
  padding-bottom: 42px;
  background: #dfe5ea;
  color: #20252b;
}
.admin-app {
  display: grid;
  grid-template-columns: 238px minmax(0, 1fr);
  grid-template-rows: 64px minmax(calc(100vh - 106px), auto);
  width: 100%;
  max-width: none;
  min-height: calc(100vh - 42px);
  margin: 0;
  padding: 0;
  background: #eef1f4;
}
.admin-app > .topbar {
  grid-column: 1 / -1;
  grid-row: 1;
  z-index: 60;
  margin: 0;
  padding: 0 22px;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #075a9c, #0878c9);
  box-shadow: 0 1px 4px rgba(0, 0, 0, .35);
  color: #fff;
}
.admin-app > .topbar .topbar-row { height: 64px; justify-content: space-between; flex-wrap: nowrap; }
.server-title-group, .server-top-actions { display: flex; align-items: center; gap: 12px; }
.server-title-group h1 { margin: 0; color: #fff; font-size: 20px; font-weight: 400; }
.server-title-group small { display: block; margin-top: 2px; color: #d7efff; font-size: 11px; }
.server-shield { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.55); font-size: 15px; }
.server-environment { padding: 6px 10px; border: 1px solid rgba(255,255,255,.42); border-radius: 0; background: rgba(0,0,0,.12); color: #fff; font-size: 10px; font-weight: 700; letter-spacing: .08em; cursor: pointer; }
.server-environment:hover { background: rgba(255,255,255,.16); }
.admin-app .logout-btn { position: static; padding: 7px 12px; border: 1px solid rgba(255,255,255,.55); border-radius: 2px; background: transparent; color: #fff; }
.admin-app .logout-btn:hover { background: rgba(255,255,255,.15); }
.admin-navigation {
  position: sticky;
  top: 0;
  grid-column: 1;
  grid-row: 2;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 0;
  height: calc(100vh - 106px);
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #20262c;
  backdrop-filter: none;
  box-shadow: 2px 0 5px rgba(0,0,0,.18);
}
.admin-nav-brand { display: flex; align-items: center; gap: 11px; min-height: 74px; padding: 14px 18px; border-bottom: 1px solid #384149; color: #fff; }
.admin-nav-brand strong, .admin-nav-brand small { display: block; }
.admin-nav-brand strong { font-size: 13px; letter-spacing: .12em; }
.admin-nav-brand small { margin-top: 3px; color: #8f9aa4; font-size: 9px; letter-spacing: .16em; }
.windows-mark { display: grid; grid-template-columns: repeat(2, 9px); grid-template-rows: repeat(2, 9px); gap: 2px; }
.windows-mark i { display: block; background: #28a8e8; }
.admin-nav-caption { padding: 17px 18px 7px; color: #77828c; font-size: 9px; font-weight: 700; letter-spacing: .14em; }
.admin-nav-btn {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 13px;
  width: 100%;
  min-width: 0;
  padding: 12px 18px;
  border-left: 3px solid transparent;
  border-radius: 0;
  color: #cbd2d8;
  font-weight: 400;
  text-align: left;
}
.admin-nav-btn b { width: 22px; color: #8f9aa4; font-size: 18px; font-weight: 400; text-align: center; }
.admin-nav-btn:hover { background: #2b333a; color: #fff; }
.admin-nav-btn.active { border-left-color: #28a8e8; background: #343d45; color: #fff; }
.admin-nav-btn.active b { color: #28a8e8; }
.admin-nav-footer { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 15px 17px; border-top: 1px solid #384149; color: #dbe2e7; }
.admin-nav-footer strong, .admin-nav-footer small { display: block; }
.admin-nav-footer strong { font-size: 10px; }
.admin-nav-footer small { margin-top: 3px; color: #7f8a93; font-size: 9px; }
.nav-health-dot { width: 9px; height: 9px; border-radius: 50%; background: #49b34a; box-shadow: 0 0 0 3px rgba(73,179,74,.15); }
.admin-main { grid-column: 2; grid-row: 2; min-width: 0; min-height: 0; padding: 22px 26px 34px; overflow: auto; }
.admin-section { border: 1px solid #c2c8cd; border-radius: 0; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.08); color: #252a30; }
.admin-panel { padding: 22px; }
.dashboard-eyebrow { color: #68737c; letter-spacing: .1em; }
.dashboard-welcome { padding-bottom: 14px; border-bottom: 1px solid #d7dce0; }
.dashboard-welcome h2 { color: #1a5f93; font-size: 27px; font-weight: 400; }
.admin-app .hint-text, .admin-app .server-status-line, .admin-app .server-metrics span, .admin-app .server-metrics small { color: #68737c; }
.admin-stat-grid { gap: 14px; margin: 18px 0; }
.admin-stat-card { min-height: 112px; border: 1px solid #c9cfd4; border-top: 4px solid #0b78bd; border-radius: 0; background: #fff; color: #252a30; box-shadow: 0 1px 2px rgba(0,0,0,.07); }
.admin-stat-card:hover { border-color: #0b78bd; transform: none; box-shadow: 0 2px 7px rgba(0,0,0,.14); }
.admin-stat-card span { color: #5f6a73; text-transform: uppercase; letter-spacing: .05em; }
.admin-stat-card strong { color: #1a5f93; font-weight: 400; }
.admin-stat-card small { color: #0878c9; }
.server-monitor { border: 1px solid #bcc4ca; border-radius: 0; background: #f7f8f9; box-shadow: inset 0 3px #0b78bd; }
.server-monitor-heading { padding-bottom: 12px; border-bottom: 1px solid #d4d9dd; }
.server-monitor-heading h3 { color: #1a5f93; font-weight: 400; }
.server-clock { border: 1px solid #d4d9dd; border-radius: 0; background: #fff; }
.server-clock span { color: #68737c; }
.server-metrics > div { border: 1px solid #d4d9dd; border-radius: 0; background: #fff; }
.server-metrics strong { color: #252a30; font-weight: 600; }
.restart-server-btn { border-radius: 2px; background: #fff7e5; }
.admin-quick-actions > button { border-color: #c9cfd4; border-radius: 0; background: #fff; color: #252a30; }
.admin-quick-actions > button:hover { border-color: #0b78bd; background: #f1f8fc; }
.admin-quick-actions > button > span { border-radius: 0; background: #e5f3fb; color: #0878c9; }
.admin-quick-actions small { color: #68737c; }
.admin-app .admin-table { color: #252a30; }
.admin-app .admin-table th { background: #e8ecef; color: #3c464e; font-weight: 600; }
.admin-app .admin-table th, .admin-app .admin-table td { border-color: #d0d5d9; }
.admin-app .admin-data-table thead, .admin-app .audit-table thead { background: #e8ecef; }
.admin-app .inline-form, .admin-app .unified-account-form { border-color: #c9cfd4; border-radius: 0; background: #f4f6f7; }
.admin-app input, .admin-app select { border-color: #aeb6bc; border-radius: 2px; background: #fff; color: #252a30; }
.admin-app .unified-account-form label { color: #4d5861; }
.admin-app h2, .admin-app h3 { color: #1a5f93; font-weight: 400; }
.role-legend span { border-radius: 2px; }
.windows-taskbar { position: fixed; right: 0; bottom: 0; left: 0; z-index: 100; display: flex; align-items: center; height: 42px; padding: 0 8px; background: #171c21; color: #dce3e8; box-shadow: 0 -1px 4px rgba(0,0,0,.3); }
.taskbar-start { display: grid; place-items: center; width: 44px; height: 42px; border: 0; background: transparent; cursor: pointer; }
.taskbar-start:hover { background: #2b333a; }
.taskbar-app { display: flex; align-items: center; gap: 8px; height: 100%; padding: 0 16px; border-bottom: 3px solid #28a8e8; background: #2b333a; font-size: 12px; }
.taskbar-spacer { flex: 1; }
.taskbar-network { padding: 0 15px; color: #aeb8c0; font-size: 11px; }
#admin-taskbar-clock { min-width: 142px; padding-right: 8px; font-size: 11px; text-align: right; }
.server-environment-dialog { width: min(92vw, 560px); padding: 0; border: 1px solid #6c747b; border-radius: 0; background: #f3f5f7; color: #252a30; box-shadow: 0 18px 55px rgba(0,0,0,.42); }
.server-environment-dialog::backdrop { background: rgba(10,18,24,.62); }
.server-environment-dialog > header { display: flex; align-items: center; justify-content: space-between; padding: 13px 16px; background: #0878c9; color: #fff; }
.server-environment-dialog > header > div { display: flex; align-items: center; gap: 11px; }
.server-environment-dialog h2 { margin: 0; color: #fff; font-size: 18px; font-weight: 400; }
.server-environment-dialog header small { color: #d8efff; }
.environment-dialog-icon { font-size: 24px; }
.server-environment-dialog header button { width: 30px; height: 30px; border: 0; background: transparent; color: #fff; font-size: 23px; cursor: pointer; }
.server-environment-dialog header button:hover { background: #d13438; }
.environment-dialog-body { padding: 20px; }
.environment-state { display: flex; align-items: center; gap: 12px; padding: 14px; border: 1px solid #b8c0c6; background: #fff; }
.environment-state i { width: 12px; height: 12px; flex: 0 0 12px; border-radius: 50%; background: #49b34a; box-shadow: 0 0 0 4px rgba(73,179,74,.15); }
.environment-state strong, .environment-state span { display: block; }
.environment-state span { margin-top: 3px; color: #68737c; font-size: 12px; }
.server-environment-dialog dl { margin: 16px 0; border: 1px solid #c8cfd4; background: #fff; }
.server-environment-dialog dl div { display: grid; grid-template-columns: 160px 1fr; padding: 10px 12px; border-bottom: 1px solid #d9dde0; }
.server-environment-dialog dl div:last-child { border-bottom: 0; }
.server-environment-dialog dt { color: #68737c; }
.server-environment-dialog dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.environment-warning { margin: 0; padding: 11px; border-left: 4px solid #e5a100; background: #fff7df; color: #5d4a16; font-size: 12px; }
.server-environment-dialog > footer { display: flex; justify-content: flex-end; gap: 8px; padding: 12px 16px; border-top: 1px solid #c8cfd4; background: #e5e9ec; }
.server-environment-dialog > footer button { padding: 7px 13px; border: 1px solid #8c969e; border-radius: 2px; background: #fff; color: #252a30; cursor: pointer; }
.server-environment-dialog > footer button:first-child { border-color: #0878c9; background: #0878c9; color: #fff; }

.photo-upload-label small { margin-top: 3px; color: var(--text-dim); font-weight: 400; }
.inline-photo-upload { display: flex; min-width: 190px; flex-direction: column; gap: 4px; color: var(--text-dim); font-size: 11px; }
.inline-photo-upload input { padding: 6px; }
.admin-child-cell { display: flex; align-items: center; gap: 9px; min-width: 150px; }
.admin-child-cell img, .admin-child-placeholder { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; object-fit: cover; }
.admin-child-placeholder { display: grid; place-items: center; background: #dce8f1; color: #1a5f93; }
.parent-portal-header { display: flex; align-items: center; gap: 15px; }
.child-profile-photo { width: 86px; height: 86px; flex: 0 0 86px; border: 4px solid rgba(255,255,255,.75); border-radius: 50%; object-fit: cover; box-shadow: 0 5px 16px rgba(15,23,42,.22); }
.contact-profile-card { display: grid; gap: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 10px; background: var(--panel-light); }
.contact-profile-card > div { display: grid; grid-template-columns: 130px 1fr; gap: 14px; padding: 13px 15px; border-bottom: 1px solid var(--border); }
.contact-profile-card > div:last-child { border-bottom: 0; }
.contact-profile-card span { color: var(--text-dim); }
.contact-profile-card strong { overflow-wrap: anywhere; }
.contact-directory-title { margin-top: 24px; }
.parent-contact-directory { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.parent-contact-directory article { display: grid; gap: 5px; padding: 14px; border: 1px solid var(--border); border-radius: 9px; background: var(--panel-light); }
.parent-contact-directory article strong { color: var(--accent); }
.parent-contact-directory article span { color: var(--text-dim); font-size: 12px; overflow-wrap: anywhere; }
@media (max-width: 560px) {
  .contact-profile-card > div { grid-template-columns: 1fr; gap: 4px; }
  .child-profile-photo { width: 68px; height: 68px; flex-basis: 68px; }
  .parent-contact-directory { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .admin-app { grid-template-columns: 76px minmax(0, 1fr); }
  .admin-nav-brand { justify-content: center; padding: 12px; }
  .admin-nav-brand div, .admin-nav-caption, .admin-nav-btn span, .admin-nav-footer div { display: none; }
  .admin-nav-btn { justify-content: center; padding: 13px 0; border-left-width: 3px; }
  .admin-nav-btn b { width: auto; }
  .admin-nav-footer { justify-content: center; }
  .admin-main { padding: 16px; }
}
@media (max-width: 560px) {
  .server-title-group small, .server-environment, .taskbar-app strong, .taskbar-network { display: none; }
  .admin-app > .topbar { padding: 0 10px; }
  .server-title-group h1 { font-size: 16px; }
  .admin-panel { padding: 14px; }
  #admin-taskbar-clock { min-width: 126px; }
}

/* ========================================================================== 
   DESIGN SYSTEM PREMIUM — portal familie
   ========================================================================== */
.brand-mark {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-right: 7px;
  border-radius: 12px 12px 12px 4px;
  background: #2f5143;
  color: #f4df9b;
  font: 800 20px/1 Georgia, serif;
  box-shadow: 0 8px 20px rgba(35, 71, 57, .2);
  vertical-align: middle;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline: 3px solid rgba(88, 126, 99, .34); outline-offset: 2px; }

body.parent-session-active {
  --bg: #f4f2ec;
  --panel: #ffffff;
  --panel-light: #f7f8f4;
  --accent: #496b58;
  --text: #26372e;
  --text-dim: #718078;
  --muted: #718078;
  --border: #dfe6df;
  background:
    radial-gradient(circle at 8% 18%, rgba(197, 214, 193, .36), transparent 26rem),
    linear-gradient(180deg, #f7f5ef, #eef2ec);
}

body.portal-session-active .hero {
  z-index: 100;
  overflow: visible;
  min-height: 82px;
  padding: 18px 24px;
  background: linear-gradient(120deg, #eff3ea 0%, #f8f5eb 48%, #e8efe7 100%);
  border-bottom: 1px solid rgba(70, 100, 82, .12);
  text-align: left;
}
body.portal-session-active .hero-decor,
body.portal-session-active .hero-desc { display: none; }
body.portal-session-active .hero-content { max-width: 1240px; margin: 0 auto; }
body.portal-session-active .hero-title { display: flex; align-items: center; margin: 0; color: #294538; font: 700 21px/1.2 Georgia, 'Times New Roman', serif; }
body.portal-session-active .brand-mark { width: 42px; height: 42px; border-radius: 13px 13px 13px 5px; }
body.portal-session-active .public-account-bar { top: 19px; right: max(24px, calc((100vw - 1240px) / 2)); }
body.parent-session-active .notification-bell,
body.parent-session-active .account-menu-trigger {
  height: 44px;
  border-color: rgba(54, 84, 67, .15);
  background: rgba(255, 255, 255, .9);
  color: #294538;
  box-shadow: 0 8px 26px rgba(45, 72, 58, .1);
}
body.parent-session-active .notification-bell { color: #496b58; }
body.parent-session-active .account-avatar { background: #e6eee7; color: #42634f; }
body.parent-session-active .account-dropdown,
body.parent-session-active .notification-dropdown { border-color: #dfe6df; background: #fff; color: #26372e; box-shadow: 0 22px 55px rgba(39, 65, 51, .16); }

.landing-app.portal-active { width: min(1240px, calc(100% - 40px)); max-width: 1240px; padding: 30px 0 60px; }
#parent-portal {
  display: grid;
  grid-template-columns: 248px minmax(0, 1fr);
  align-items: start;
  gap: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
#parent-portal.hidden { display: none; }
#parent-portal .parent-portal-header {
  grid-column: 1 / -1;
  position: relative;
  min-height: 150px;
  padding: 27px 30px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 24px;
  background:
    radial-gradient(circle at 86% 10%, rgba(244, 223, 155, .24), transparent 15rem),
    linear-gradient(128deg, #294b3c, #486c57 62%, #6f8a70);
  color: #fff;
  box-shadow: 0 22px 55px rgba(39, 67, 52, .18);
}
#parent-portal .parent-portal-header::after {
  content: '';
  position: absolute;
  right: -35px;
  bottom: -72px;
  width: 240px;
  height: 160px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 50%;
  transform: rotate(-12deg);
}
#parent-portal .child-profile-photo { width: 94px; height: 94px; flex-basis: 94px; border: 4px solid rgba(255,255,255,.8); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.parent-profile-copy { position: relative; z-index: 1; }
#parent-portal .portal-eyebrow { display: block; margin-bottom: 7px; color: #f1dfa5; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
#parent-portal .parent-portal-header h2 { margin: 0 0 6px; color: #fff; font: 700 31px/1.15 Georgia, 'Times New Roman', serif; }
#parent-portal .child-info { margin: 0; color: rgba(255,255,255,.76); }
.parent-profile-badge { position: relative; z-index: 1; display: grid; gap: 3px; margin-left: auto; padding: 12px 16px; border: 1px solid rgba(255,255,255,.2); border-radius: 14px; background: rgba(255,255,255,.09); backdrop-filter: blur(8px); text-align: right; }
.parent-profile-badge span { color: rgba(255,255,255,.66); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.parent-profile-badge strong { color: #fff; font-size: 13px; }

#parent-portal .parent-tabs {
  position: sticky;
  top: 18px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin: 0;
  padding: 15px;
  overflow: visible;
  border: 1px solid #e1e7df;
  border-radius: 18px;
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 38px rgba(47, 73, 59, .09);
  backdrop-filter: blur(12px);
}
.parent-nav-label { padding: 7px 10px 10px; color: #8a968e; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
#parent-portal .parent-tab-btn {
  display: grid;
  grid-template-columns: 30px 1fr auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 45px;
  padding: 8px 10px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #617067;
  font-size: 13px;
  font-weight: 650;
  text-align: left;
  white-space: normal;
  box-shadow: none;
}
#parent-portal .parent-tab-btn:hover { background: #f1f5ef; color: #355342; transform: none; }
#parent-portal .parent-tab-btn.active { background: #e8f0e8; color: #31513f; box-shadow: inset 3px 0 #64846b; }
.tab-line-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: #f0f3ef; color: #789080; font-size: 15px; }
#parent-portal .parent-tab-btn.active .tab-line-icon { background: #496b58; color: #fff; }
#parent-portal .tab-count { min-width: 20px; background: #b55d53; }

#parent-portal > .parent-tab-panel {
  grid-column: 2;
  min-height: 430px;
  margin: 0;
  padding: 26px 28px;
  border: 1px solid #e1e7df;
  border-radius: 20px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 16px 42px rgba(47, 73, 59, .09);
}
#parent-portal > .parent-tab-panel > h2,
#parent-portal .weekly-menu-heading h2 { margin-top: 0; color: #294739; font: 700 25px/1.2 Georgia, 'Times New Roman', serif; }
#parent-portal .section-intro { color: #7c8981; }
#parent-portal .locked-date { border-color: #dae5da; background: linear-gradient(90deg, #f0f6ef, #fafbf8); }
#parent-portal .status-btn { min-height: 50px; border-radius: 12px; font-weight: 750; }
#parent-portal .absence-card,
#parent-portal .announcement-conversation,
#parent-portal .class-event-card,
#parent-portal .journal-card,
#parent-portal .meal-day-card,
#parent-portal .contact-profile-card { border-color: #e1e7df; background: #fafbf8; box-shadow: 0 6px 18px rgba(48, 73, 59, .045); }
#parent-portal .announcement-conversation { border-radius: 14px; }
#parent-portal .child-name,
#parent-portal .journal-card-heading time { color: #365845; }
#parent-portal .event-type { background: #e6efe7; color: #426650; }
#parent-portal .class-event-date { background: #e8f0e8; color: #41634f; }
#parent-portal .journal-card-heading,
#parent-portal .meal-day-card header { background: #eef4ed; }
#parent-portal .journal-card-heading time,
#parent-portal .meal-day-card header span,
#parent-portal .week-navigation strong { color: #496b58; }
#parent-portal .week-navigation button { border-color: #dce5dc; background: #f8faf6; color: #496251; }
#parent-portal input,
#parent-portal select,
#parent-portal textarea { border-color: #d9e2d9; background: #fff; color: #26372e; }

@media (max-width: 900px) {
  body.portal-session-active .public-account-bar { right: 18px; }
  body.portal-session-active .hero-title { font-size: 18px; }
  .landing-app.portal-active { width: min(100% - 24px, 800px); padding-top: 18px; }
  #parent-portal { grid-template-columns: 1fr; gap: 13px; }
  #parent-portal .parent-portal-header { grid-column: 1; min-height: 128px; padding: 22px; border-radius: 19px; }
  #parent-portal .parent-tabs { position: static; grid-column: 1; flex-direction: row; padding: 8px; overflow-x: auto; border-radius: 14px; }
  .parent-nav-label { display: none; }
  #parent-portal .parent-tab-btn { display: flex; flex: 0 0 auto; width: auto; min-height: 42px; padding: 7px 11px; white-space: nowrap; }
  #parent-portal .parent-tab-btn.active { box-shadow: inset 0 -3px #64846b; }
  #parent-portal > .parent-tab-panel { grid-column: 1; min-height: 360px; padding: 22px; border-radius: 17px; }
}

@media (max-width: 620px) {
  body.portal-session-active .hero { min-height: 72px; padding: 14px 12px; }
  body.portal-session-active .hero-title { max-width: 145px; font-size: 15px; }
  body.portal-session-active .brand-mark { width: 38px; height: 38px; }
  body.portal-session-active .public-account-bar { top: 14px; right: 12px; }
  body.parent-session-active .account-menu-trigger { max-width: 150px; padding: 8px 10px; }
  body.parent-session-active .account-menu-trigger #account-name { max-width: 76px; }
  .landing-app.portal-active { width: min(100% - 16px, 800px); padding-top: 12px; }
  #parent-portal .parent-portal-header { min-height: 116px; padding: 18px; }
  #parent-portal .child-profile-photo { width: 72px; height: 72px; flex-basis: 72px; }
  #parent-portal .parent-portal-header h2 { font-size: 23px; }
  .parent-profile-badge { display: none; }
  #parent-portal > .parent-tab-panel { padding: 18px 15px; }
  #parent-portal > .parent-tab-panel > h2,
  #parent-portal .weekly-menu-heading h2 { font-size: 22px; }
}

/* ---------- Portal premium pentru toate conturile de educator ---------- */
body.educator-session-active {
  --bg: #edf1f5;
  --panel: #ffffff;
  --panel-light: #f5f7fa;
  --accent: #315f88;
  --text: #243546;
  --text-dim: #718090;
  --muted: #718090;
  --border: #dce3ea;
  background: radial-gradient(circle at 90% 5%, rgba(91, 128, 163, .13), transparent 32rem), #edf1f5;
}
body.educator-session-active .account-menu-trigger { border-color: #dbe3ea; background: #fff; color: #27445e; box-shadow: 0 8px 24px rgba(29, 57, 82, .12); }
body.educator-session-active .account-avatar { background: #e7eef5; color: #315f88; }
body.educator-session-active .account-dropdown { border-color: #dce3ea; background: #fff; color: #243546; }
#educator-portal {
  display: grid;
  grid-template-columns: 250px minmax(0, 1fr);
  align-items: start;
  gap: 20px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
#educator-portal.hidden { display: none; }
#educator-portal .parent-portal-header {
  grid-column: 1 / -1;
  display: flex;
  min-height: 142px;
  padding: 26px 30px;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: 22px;
  background: radial-gradient(circle at 88% 0, rgba(118, 166, 202, .28), transparent 17rem), linear-gradient(125deg, #183a58, #315f88 64%, #527b9d);
  color: #fff;
  box-shadow: 0 22px 55px rgba(27, 58, 84, .19);
}
.educator-profile-mark { display: grid; place-items: center; width: 78px; height: 78px; flex: 0 0 78px; border: 1px solid rgba(255,255,255,.28); border-radius: 20px 20px 20px 7px; background: rgba(255,255,255,.12); color: #d8eafa; font: 800 31px/1 Georgia, serif; }
.educator-profile-copy .portal-eyebrow { color: #bcd8ee; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
#educator-portal .parent-portal-header h2 { margin: 6px 0 4px; color: #fff; font: 700 29px/1.15 Georgia, serif; }
#educator-portal .child-info { margin: 0; color: rgba(255,255,255,.72); }
.educator-profile-badge { display: grid; gap: 3px; margin-left: auto; padding: 11px 15px; border: 1px solid rgba(255,255,255,.2); border-radius: 13px; background: rgba(255,255,255,.09); text-align: right; }
.educator-profile-badge span { color: rgba(255,255,255,.65); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.educator-profile-badge strong { color: #fff; font-size: 13px; }
#educator-portal .educator-tabs { position: sticky; top: 18px; display: flex; flex-direction: column; gap: 5px; margin: 0; padding: 14px; overflow: visible; border: 1px solid #dce3ea; border-radius: 18px; background: rgba(255,255,255,.94); box-shadow: 0 14px 38px rgba(29, 57, 82, .09); }
#educator-portal .educator-tab-btn { width: 100%; min-height: 44px; padding: 9px 12px; border: 0; border-radius: 10px; background: transparent; color: #617487; font-size: 13px; font-weight: 650; text-align: left; white-space: normal; box-shadow: none; }
#educator-portal .educator-tab-btn:hover { background: #f0f4f8; color: #284d6e; transform: none; }
#educator-portal .educator-tab-btn.active { background: #e6eef5; color: #234d70; box-shadow: inset 3px 0 #43739a; }
#educator-portal > .educator-tab-panel { grid-column: 2; min-height: 470px; margin: 0; padding: 26px 28px; border: 1px solid #dce3ea; border-radius: 20px; background: rgba(255,255,255,.97); box-shadow: 0 16px 42px rgba(29, 57, 82, .085); }
#educator-portal > .educator-tab-panel > h2,
#educator-portal .calendar-admin-heading h2 { color: #244b6b; font: 700 24px/1.2 Georgia, serif; }
#educator-portal .summary-card,
#educator-portal .absence-card,
#educator-portal .announcement-conversation,
#educator-portal .class-event-card,
#educator-portal .journal-card,
#educator-portal .meal-day-card,
#educator-portal .contact-profile-card,
#educator-portal .parent-contact-directory article { border-color: #dfe6ec; background: #f7f9fb; box-shadow: 0 6px 18px rgba(29,57,82,.04); }
#educator-portal input,
#educator-portal select,
#educator-portal textarea { border-color: #d6e0e8; background: #fff; color: #243546; }
#educator-portal form > button[type='submit'] { border: 0; border-radius: 10px; background: #315f88; color: #fff; box-shadow: 0 7px 18px rgba(49,95,136,.2); }

@media (max-width: 900px) {
  #educator-portal { grid-template-columns: 1fr; gap: 13px; }
  #educator-portal .parent-portal-header { grid-column: 1; min-height: 122px; padding: 21px; }
  #educator-portal .educator-tabs { position: static; grid-column: 1; flex-direction: row; padding: 8px; overflow-x: auto; }
  #educator-portal .educator-tab-btn { flex: 0 0 auto; width: auto; min-height: 41px; padding: 8px 11px; white-space: nowrap; }
  #educator-portal .educator-tab-btn.active { box-shadow: inset 0 -3px #43739a; }
  #educator-portal > .educator-tab-panel { grid-column: 1; min-height: 380px; padding: 21px; }
}
@media (max-width: 620px) {
  .educator-profile-mark { width: 62px; height: 62px; flex-basis: 62px; }
  .educator-profile-badge { display: none; }
  #educator-portal .parent-portal-header h2 { font-size: 22px; }
  #educator-portal > .educator-tab-panel { padding: 17px 14px; }
}

/* ---------- Administrare premium, aplicată tuturor administratorilor ---------- */
body:has(.admin-app) { background: #e9edf2; color: #253444; }
.admin-app { background: #e9edf2; }
.admin-app > .topbar { border-bottom: 1px solid rgba(255,255,255,.12); background: linear-gradient(90deg, #153957, #245b83); box-shadow: 0 4px 18px rgba(20,49,73,.2); }
.admin-app > .topbar .topbar-row { height: 70px; }
.admin-app .server-shield { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 9px 9px 9px 3px; background: rgba(255,255,255,.12); color: #bcd9ed; }
.admin-navigation { padding-top: 8px; border-right: 0; background: linear-gradient(180deg, #102a41, #183d5a); box-shadow: 5px 0 24px rgba(19,45,66,.14); }
.admin-nav-brand { margin: 9px 11px 14px; padding: 13px; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; background: rgba(255,255,255,.055); }
.admin-nav-btn { margin: 2px 9px; padding: 11px 13px; border: 0; border-radius: 9px; color: #bfd0dc; }
.admin-nav-btn:hover { background: rgba(255,255,255,.075); color: #fff; }
.admin-nav-btn.active { border: 0; background: linear-gradient(90deg, rgba(93,155,199,.3), rgba(93,155,199,.1)); color: #fff; box-shadow: inset 3px 0 #73b4df; }
.admin-nav-footer { margin: auto 10px 12px; border: 1px solid rgba(255,255,255,.08); border-radius: 10px; background: rgba(0,0,0,.1); }
.admin-main { padding: 26px 30px 38px; background: radial-gradient(circle at 100% 0, rgba(75,115,150,.09), transparent 30rem), #e9edf2; }
.admin-section { padding: 25px; border: 1px solid #d7dee5; border-radius: 16px; background: #fff; box-shadow: 0 12px 34px rgba(30,55,75,.075); color: #253444; }
.admin-app h2, .admin-app h3 { color: #234f71; font-weight: 650; }
.admin-app .dashboard-welcome,
.admin-app .server-monitor,
.admin-app .inline-form,
.admin-app .unified-account-form { border-color: #dce3e9; border-radius: 12px; background: #f6f8fa; }
.admin-app .server-metrics > div,
.admin-app .quick-action-card,
.admin-app .report-summary-grid > div { border-color: #dfe5ea; border-radius: 11px; background: #f8fafb; box-shadow: 0 5px 16px rgba(30,55,75,.04); }
.admin-app input, .admin-app select, .admin-app textarea { min-height: 40px; border-color: #cfd9e1; border-radius: 8px; background: #fff; color: #253444; }
.admin-app .admin-table { overflow: hidden; border-radius: 10px; color: #253444; }
.admin-app .admin-table th { background: #edf2f6; color: #405466; }
.admin-app .admin-table tbody tr:hover { background: #f3f7fa; }
.admin-app button { border-radius: 8px; }
.admin-app .edit-btn { border-color: #bfd0dd; background: #edf4f8; color: #285d82; }
.admin-app .report-filters { border-color: #dce3e9; border-radius: 12px; background: #f6f8fa; }

/* ---------- Monitorizare TV premium ---------- */
.monitor-body { background: radial-gradient(circle at 50% -20%, #254767, transparent 38rem), #091624; color: #eef5fa; }
.monitor-header { padding: 22px 30px; border-bottom: 1px solid rgba(255,255,255,.08); background: rgba(7,20,32,.74); box-shadow: 0 10px 30px rgba(0,0,0,.18); backdrop-filter: blur(12px); }
.monitor-kicker { color: #8bc2e6; }
.monitor-header h1 { font-family: Georgia, serif; font-weight: 600; }
.monitor-header button { border-color: rgba(255,255,255,.12); border-radius: 9px; background: rgba(255,255,255,.065); color: #dceaf3; }
.monitor-main { padding: 26px 30px 38px; }
.monitor-summary { gap: 13px; }
.monitor-summary > div { border: 1px solid rgba(255,255,255,.085); border-radius: 14px; background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.035)); box-shadow: 0 12px 28px rgba(0,0,0,.12); }
.monitor-class-card { border-color: rgba(255,255,255,.09); border-radius: 16px; background: rgba(12,29,45,.88); box-shadow: 0 16px 36px rgba(0,0,0,.16); }
.monitor-class-card > header { border-color: rgba(255,255,255,.08); background: rgba(255,255,255,.025); }
.monitor-child { border: 1px solid rgba(255,255,255,.055); border-left-width: 4px; border-radius: 9px; background: rgba(255,255,255,.045); }

/* ---------- Autentificare premium ---------- */
.auth-overlay { background: rgba(21, 39, 31, .55); backdrop-filter: blur(10px); }
.auth-box { border: 1px solid rgba(255,255,255,.55); border-radius: 20px; background: #fff; color: #26372e; box-shadow: 0 28px 75px rgba(25,49,37,.25); }
.auth-box h1, .auth-box h2 { color: #294b3a; font-family: Georgia, serif; }
.auth-box input, .auth-box select { border-color: #d9e3da; border-radius: 10px; background: #f9faf7; color: #26372e; }
.auth-box button:not(.modal-close) { border-radius: 10px; background: #426852; box-shadow: 0 7px 17px rgba(55,91,70,.19); }
.auth-box .modal-close { background: #edf2ec; color: #496653; }
.admin-login-body { background: radial-gradient(circle at 50% 0, #315e82, transparent 30rem), #10283d; }
.admin-login-box { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.97); }

/* ---------- Pagina publică premium ---------- */
body.landing-body:not(.portal-session-active) { background: #f1efe9; color: #2b3d32; }
body.landing-body:not(.portal-session-active) .hero { min-height: 360px; padding-top: 92px; background: linear-gradient(145deg, #dfe9dc 0%, #eef1df 48%, #f4e8c9 100%); }
body.landing-body:not(.portal-session-active) .hero-title { color: #29493a; font: 700 clamp(30px, 5vw, 50px)/1.1 Georgia, serif; }
body.landing-body:not(.portal-session-active) .hero-desc { max-width: 720px; margin-inline: auto; color: #51675a; font-size: 17px; line-height: 1.75; }
body.landing-body:not(.portal-session-active) .hero-sun { background: #f1d885; box-shadow: 0 0 55px rgba(224,189,92,.38); }
body.landing-body:not(.portal-session-active) .hero-hill { background: #cbdcbd; }
body.landing-body:not(.portal-session-active) .top-signin-btn { border-color: rgba(52,82,64,.15); background: rgba(255,255,255,.88); color: #31513f; box-shadow: 0 9px 28px rgba(51,80,63,.12); }
body.landing-body:not(.portal-session-active) .landing-app { max-width: 1120px; }
body.landing-body:not(.portal-session-active) .public-presentation { overflow: hidden; border: 1px solid rgba(76,104,86,.12); border-radius: 28px; background: #fff; box-shadow: 0 28px 70px rgba(47,73,59,.11); }
body.landing-body:not(.portal-session-active) .presentation-intro { background: radial-gradient(circle at 85% 15%, rgba(218,229,205,.55), transparent 19rem), #fbfcf8; }
body.landing-body:not(.portal-session-active) .presentation-kicker,
body.landing-body:not(.portal-session-active) .public-section-heading > span { color: #5d7c64; }
body.landing-body:not(.portal-session-active) .public-presentation h2,
body.landing-body:not(.portal-session-active) .public-presentation h3 { color: #294b39; }
body.landing-body:not(.portal-session-active) .public-feature-grid article,
body.landing-body:not(.portal-session-active) .calendar-card,
body.landing-body:not(.portal-session-active) .enrollment-card { border-color: #e1e7df; background: #fbfcf9; box-shadow: 0 8px 24px rgba(47,73,59,.055); }
body.landing-body:not(.portal-session-active) .enrollment-form-btn { border-radius: 11px; background: #426852; box-shadow: 0 8px 20px rgba(55,91,70,.18); }
body.landing-body:not(.portal-session-active) .public-contact-panel { border-radius: 18px; background: linear-gradient(125deg, #294b3c, #52725c); box-shadow: 0 16px 35px rgba(39,67,52,.17); }

/* ========================================================================== 
   TEMĂ LUMINOASĂ / ÎNTUNECATĂ — preferință persistentă pe dispozitiv
   ========================================================================== */
.public-account-bar { display: flex; align-items: center; gap: 8px; }
.theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px 12px;
  border: 1px solid rgba(57,82,67,.17);
  border-radius: 999px;
  background: rgba(255,255,255,.86);
  color: #345342;
  font: 700 12px/1 'Segoe UI', sans-serif;
  box-shadow: 0 7px 20px rgba(37,62,48,.1);
  cursor: pointer;
  backdrop-filter: blur(9px);
}
.theme-toggle:hover { background: #fff; }
.theme-toggle-icon { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: #e7eee5; font-size: 14px; }
.theme-toggle-floating { position: fixed; top: 18px; right: 18px; z-index: 50; }
.admin-app .theme-toggle-admin { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.09); color: #fff; box-shadow: none; }
.admin-app .theme-toggle-admin:hover { background: rgba(255,255,255,.16); }

/* Monitorizarea are și o variantă luminoasă reală. */
html[data-theme='light'] .monitor-body { background: #edf1f4; color: #25394a; }
html[data-theme='light'] .monitor-header { border-color: #dce4ea; background: rgba(255,255,255,.9); box-shadow: 0 8px 26px rgba(34,58,77,.1); }
html[data-theme='light'] .monitor-header h1 { color: #234a69; }
html[data-theme='light'] .monitor-header button { border-color: #d4dfe7; background: #f5f8fa; color: #31546e; }
html[data-theme='light'] .monitor-connection { color: #657887; }
html[data-theme='light'] .monitor-summary > div { border-color: #dbe4ea; background: #fff; box-shadow: 0 9px 25px rgba(34,58,77,.07); }
html[data-theme='light'] .monitor-summary span,
html[data-theme='light'] .monitor-class-card header span { color: #71818e; }
html[data-theme='light'] .monitor-class-card { border-color: #d9e2e8; background: #fff; box-shadow: 0 12px 30px rgba(34,58,77,.08); }
html[data-theme='light'] .monitor-class-card > header { border-color: #e0e6eb; background: #f6f8fa; }
html[data-theme='light'] .monitor-child { border-color: #e0e6eb; background: #f7f9fa; color: #2d4354; }

html[data-theme='dark'] body {
  --bg: #0c1117;
  --panel: #161d25;
  --panel-light: #1c252f;
  --accent: #7fae8b;
  --text: #e8eee9;
  --text-dim: #9aa8a0;
  --muted: #9aa8a0;
  --border: #2d3942;
  background-color: #0c1117;
  color: #e8eee9;
}
html[data-theme='dark'] .theme-toggle { border-color: rgba(255,255,255,.11); background: rgba(21,28,35,.9); color: #e1e9e3; box-shadow: 0 8px 24px rgba(0,0,0,.22); }
html[data-theme='dark'] .theme-toggle:hover { background: #222c35; }
html[data-theme='dark'] .theme-toggle-icon { background: #303c45; color: #f1d98c; }

/* Pagina publică întunecată */
html[data-theme='dark'] body.landing-body:not(.portal-session-active) { background: #0c1210; color: #e4ebe5; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .hero { background: radial-gradient(circle at 84% 12%, rgba(196,160,75,.12), transparent 17rem), linear-gradient(145deg, #14231c, #1d3026 55%, #302b1e); }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .hero-title { color: #edf3ed; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .hero-desc { color: #a9b9ae; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .hero-hill { background: #263c2e; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .hero-sun { background: #b99649; box-shadow: 0 0 55px rgba(202,165,77,.16); }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .top-signin-btn { border-color: #35463c; background: #17231d; color: #e7eee8; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .public-presentation { border-color: #29362e; background: #141c17; box-shadow: 0 28px 70px rgba(0,0,0,.3); }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .presentation-intro { background: radial-gradient(circle at 85% 15%, rgba(79,105,77,.2), transparent 19rem), #172019; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .public-presentation h2,
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .public-presentation h3 { color: #e6eee7; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .public-presentation p { color: #a7b4aa; }
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .presentation-highlights span,
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .public-feature-grid article,
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .calendar-card,
html[data-theme='dark'] body.landing-body:not(.portal-session-active) .enrollment-card { border-color: #2b3930; background: #19221c; color: #dfe8e0; }

/* Portalul familiei întunecat */
html[data-theme='dark'] body.parent-session-active { --panel:#151d18; --panel-light:#1a241e; --text:#e6eee8; --text-dim:#9ca9a0; --border:#2b3930; background: radial-gradient(circle at 8% 15%, rgba(65,90,70,.2), transparent 28rem), #0e1511; }
html[data-theme='dark'] body.portal-session-active .hero { border-color: #28362d; background: linear-gradient(120deg, #111b15, #171d17 55%, #1d2118); }
html[data-theme='dark'] body.portal-session-active .hero-title { color: #edf3ed; }
html[data-theme='dark'] body.parent-session-active .notification-bell,
html[data-theme='dark'] body.parent-session-active .account-menu-trigger,
html[data-theme='dark'] body.parent-session-active .account-dropdown,
html[data-theme='dark'] body.parent-session-active .notification-dropdown { border-color: #2d3b32; background: #17201a; color: #e6eee8; }
html[data-theme='dark'] #parent-portal .parent-tabs,
html[data-theme='dark'] #parent-portal > .parent-tab-panel { border-color: #2b3930; background: rgba(20,28,23,.97); box-shadow: 0 17px 42px rgba(0,0,0,.22); }
html[data-theme='dark'] #parent-portal .parent-tab-btn { color: #a9b7ad; }
html[data-theme='dark'] #parent-portal .parent-tab-btn:hover { background: #202c24; color: #e1ebe3; }
html[data-theme='dark'] #parent-portal .parent-tab-btn.active { background: #26372c; color: #edf4ee; }
html[data-theme='dark'] #parent-portal > .parent-tab-panel > h2,
html[data-theme='dark'] #parent-portal .weekly-menu-heading h2,
html[data-theme='dark'] #parent-portal .child-name { color: #dfeae1; }
html[data-theme='dark'] #parent-portal .absence-card,
html[data-theme='dark'] #parent-portal .announcement-conversation,
html[data-theme='dark'] #parent-portal .class-event-card,
html[data-theme='dark'] #parent-portal .journal-card,
html[data-theme='dark'] #parent-portal .meal-day-card,
html[data-theme='dark'] #parent-portal .contact-profile-card { border-color: #2c3a31; background: #19221c; }
html[data-theme='dark'] #parent-portal .journal-card-heading,
html[data-theme='dark'] #parent-portal .meal-day-card header,
html[data-theme='dark'] #parent-portal .locked-date { border-color: #304036; background: #202b24; }
html[data-theme='dark'] #parent-portal input,
html[data-theme='dark'] #parent-portal select,
html[data-theme='dark'] #parent-portal textarea { border-color: #34443a; background: #111914; color: #e6eee8; }

/* Portalul educatorului întunecat */
html[data-theme='dark'] body.educator-session-active { --panel:#151d25; --panel-light:#1a242e; --text:#e6edf3; --text-dim:#9cabb8; --border:#2a3946; background: radial-gradient(circle at 90% 5%, rgba(65,100,132,.18), transparent 32rem), #0d141b; }
html[data-theme='dark'] body.educator-session-active .account-menu-trigger,
html[data-theme='dark'] body.educator-session-active .account-dropdown { border-color: #2c3b48; background: #162029; color: #e6edf3; }
html[data-theme='dark'] #educator-portal .educator-tabs,
html[data-theme='dark'] #educator-portal > .educator-tab-panel { border-color: #2a3946; background: rgba(20,29,37,.97); box-shadow: 0 17px 42px rgba(0,0,0,.23); }
html[data-theme='dark'] #educator-portal .educator-tab-btn { color: #a3b2bf; }
html[data-theme='dark'] #educator-portal .educator-tab-btn:hover { background: #202d38; color: #e7eef4; }
html[data-theme='dark'] #educator-portal .educator-tab-btn.active { background: #263a4a; color: #edf4f9; }
html[data-theme='dark'] #educator-portal > .educator-tab-panel > h2,
html[data-theme='dark'] #educator-portal .calendar-admin-heading h2 { color: #dceaf4; }
html[data-theme='dark'] #educator-portal .summary-card,
html[data-theme='dark'] #educator-portal .absence-card,
html[data-theme='dark'] #educator-portal .announcement-conversation,
html[data-theme='dark'] #educator-portal .class-event-card,
html[data-theme='dark'] #educator-portal .journal-card,
html[data-theme='dark'] #educator-portal .meal-day-card,
html[data-theme='dark'] #educator-portal .contact-profile-card,
html[data-theme='dark'] #educator-portal .parent-contact-directory article { border-color: #2c3b48; background: #19232c; }
html[data-theme='dark'] #educator-portal input,
html[data-theme='dark'] #educator-portal select,
html[data-theme='dark'] #educator-portal textarea { border-color: #344654; background: #111a22; color: #e6edf3; }

/* Administrarea întunecată */
html[data-theme='dark'] body:has(.admin-app),
html[data-theme='dark'] .admin-app { background: #0d141b; color: #e5edf3; }
html[data-theme='dark'] .admin-navigation { background: linear-gradient(180deg, #081825, #102a3c); }
html[data-theme='dark'] .admin-main { background: radial-gradient(circle at 100% 0, rgba(68,104,134,.12), transparent 30rem), #101820; }
html[data-theme='dark'] .admin-section { border-color: #2b3945; background: #17212a; color: #e5edf3; box-shadow: 0 15px 38px rgba(0,0,0,.25); }
html[data-theme='dark'] .admin-app h2,
html[data-theme='dark'] .admin-app h3 { color: #b9d7ea; }
html[data-theme='dark'] .admin-app .dashboard-welcome,
html[data-theme='dark'] .admin-app .server-monitor,
html[data-theme='dark'] .admin-app .inline-form,
html[data-theme='dark'] .admin-app .unified-account-form,
html[data-theme='dark'] .admin-app .report-filters { border-color: #2d3c48; background: #1b2630; }
html[data-theme='dark'] .admin-app .server-metrics > div,
html[data-theme='dark'] .admin-app .quick-action-card,
html[data-theme='dark'] .admin-app .report-summary-grid > div { border-color: #2e3d49; background: #1c2832; }
html[data-theme='dark'] .admin-app input,
html[data-theme='dark'] .admin-app select,
html[data-theme='dark'] .admin-app textarea { border-color: #394a57; background: #111a22; color: #e5edf3; }
html[data-theme='dark'] .admin-app .admin-table { color: #e2eaf0; }
html[data-theme='dark'] .admin-app .admin-table th { background: #22313c; color: #c5d3dd; }
html[data-theme='dark'] .admin-app .admin-table td { border-color: #2d3b46; }
html[data-theme='dark'] .admin-app .admin-table tbody tr:hover { background: #1d2a34; }
html[data-theme='dark'] .admin-app .hint-text,
html[data-theme='dark'] .admin-app .server-status-line,
html[data-theme='dark'] .admin-app .server-metrics span,
html[data-theme='dark'] .admin-app .server-metrics small { color: #9cabb7; }

/* Login și ferestre în tema întunecată */
html[data-theme='dark'] .auth-overlay { background: rgba(0,0,0,.68); }
html[data-theme='dark'] .auth-box { border-color: #334139; background: #151d18; color: #e5ede7; box-shadow: 0 30px 80px rgba(0,0,0,.44); }
html[data-theme='dark'] .auth-box h1,
html[data-theme='dark'] .auth-box h2 { color: #e6eee8; }
html[data-theme='dark'] .auth-box input,
html[data-theme='dark'] .auth-box select { border-color: #35443a; background: #0e1611; color: #e6eee8; }
html[data-theme='dark'] .auth-box .modal-close { background: #26332b; color: #dfe9e1; }
html[data-theme='dark'] .admin-login-body { background: radial-gradient(circle at 50% 0, #1b3b54, transparent 30rem), #091722; }
html[data-theme='dark'] .admin-login-box { border-color: #30404c; background: #151f27; color: #e4edf3; }
html[data-theme='dark'] .admin-login-box h1 { color: #dceaf3; }

@media (max-width: 620px) {
  .theme-toggle-compact .theme-toggle-label,
  .theme-toggle-admin .theme-toggle-label { display: none; }
  .theme-toggle-compact,
  .theme-toggle-admin { width: 40px; padding-inline: 8px; }
  .theme-toggle-floating { top: 10px; right: 10px; }
}
