:root {
  --bg: #f6f7fb;
  --surface: #ffffff;
  --surface-soft: #eef2f6;
  --ink: #07080d;
  --muted: #626674;
  --line: #dedff0;
  --brand: #07080d;
  --accent: #c7ff42;
  --accent-dark: #304800;
  --danger: #db5a42;
  --ok-bg: #eaf4ef;
  --ok-text: #14613c;
  --info-bg: #eef2f6;
  --info-text: #273345;
  --warn-bg: #fff4d8;
  --warn-text: #7a4b00;
  --off-bg: #ffe7e3;
  --off-text: #b83220;
  --shadow: 0 14px 35px rgba(7, 8, 13, .08);
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-size: 16px;
  font-family: "Inter", "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, Arial, sans-serif;
}

.app-header {
  background: var(--surface);
  color: var(--ink);
  padding: 14px 24px;
  border-bottom: 1px solid var(--line);
  box-shadow: 0 10px 30px rgba(7, 8, 13, .06);
}

.brandbar,
main {
  width: min(1240px, 100%);
  margin: 0 auto;
}

.brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  flex-wrap: wrap;
}

.brand img {
  width: 168px;
  height: auto;
  display: block;
}

.brand-module {
  font-size: 1rem;
  font-weight: 700;
  text-align: right;
}

.brand-subtitle {
  margin-top: 3px;
  color: var(--muted);
  font-size: .86rem;
  font-weight: 600;
  text-align: right;
}

main {
  padding: 18px;
}

.topbar,
.filters,
.actions,
.legend {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.topbar {
  justify-content: space-between;
  margin-bottom: 14px;
}

.space-between { justify-content: space-between; }
.end { justify-content: flex-end; margin-top: 14px; }

.tabs,
.segmented {
  display: inline-flex;
  border: 1px solid var(--line);
  background: var(--surface);
  border-radius: 8px;
  overflow: hidden;
}

button,
select,
input,
textarea {
  font: inherit;
}

button {
  border: 0;
  cursor: pointer;
}

.tab,
.segment {
  background: transparent;
  color: var(--ink);
  min-height: 40px;
  padding: 0 14px;
  border-right: 1px solid var(--line);
}

.tab:last-child,
.segment:last-child {
  border-right: 0;
}

.tab.active,
.segment.active {
  background: var(--brand);
  color: #fff;
}

.btn {
  min-height: 40px;
  padding: 0 14px;
  border-radius: 8px;
  background: var(--brand);
  color: #fff;
  font-weight: 700;
}

.btn:hover {
  background: var(--accent);
  color: var(--ink);
}

.btn.secondary {
  background: #fff;
  color: var(--ink);
  border: 1px solid var(--line);
}

.btn.danger {
  background: var(--danger);
  color: #fff;
}

.panel {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 14px;
  box-shadow: var(--shadow);
}

.panel h1,
.panel h2,
.panel h3 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 1.1rem;
}

.panel p {
  color: var(--muted);
  margin: 0 0 12px;
}

label {
  display: block;
  font-weight: 700;
  margin: 10px 0 5px;
}

input,
select,
textarea {
  width: 100%;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 10px;
  background: #fff;
  color: var(--ink);
}

input:focus,
select:focus,
textarea:focus {
  outline: 3px solid rgba(199, 255, 66, .38);
  border-color: var(--accent);
}

textarea {
  min-height: 92px;
  resize: vertical;
}

.grid {
  display: grid;
  grid-template-columns: 310px 1fr;
  gap: 14px;
  align-items: start;
}

.field-sm {
  min-width: 220px;
}

.month {
  margin-bottom: 16px;
}

.month h3 {
  margin: 0 0 10px;
  font-size: 1rem;
  color: var(--ink);
  text-transform: capitalize;
}

.calendar {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 7px;
}

.weekday {
  color: var(--muted);
  font-size: .82rem;
  font-weight: 700;
  text-align: center;
}

.day {
  min-height: 128px;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 8px;
  background: #fbfcfd;
}

.day.empty {
  background: var(--surface-soft);
}

.day-number {
  font-weight: 700;
  margin-bottom: 6px;
}

.event {
  width: 100%;
  text-align: left;
  border-left: 4px solid var(--accent);
  background: #fbfcfd;
  border-radius: 6px;
  padding: 7px;
  margin-top: 6px;
  color: var(--ink);
  line-height: 1.3;
}

.event small {
  display: block;
  color: var(--muted);
  margin-top: 2px;
}

.event.unavailable {
  opacity: .5;
  cursor: not-allowed;
}

.badge,
.legend span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 9px;
  border-radius: 999px;
  font-size: .82rem;
  font-weight: 700;
}

.status-agendado { background: var(--info-bg); color: var(--info-text); }
.status-confirmado { background: var(--ok-bg); color: var(--ok-text); }
.status-andamento { background: var(--warn-bg); color: var(--warn-text); }
.status-cancelado { background: var(--off-bg); color: var(--off-text); }
.status-reagendado { background: #f4fae8; color: var(--accent-dark); }

.list {
  display: grid;
  gap: 10px;
}

.row {
  display: grid;
  grid-template-columns: 1.2fr .75fr .75fr .75fr auto;
  gap: 10px;
  align-items: center;
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 12px;
  background: #fff;
}

.row strong,
.row span {
  display: block;
}

.muted {
  color: var(--muted);
  font-size: .9rem;
}

.notice {
  border: 1px solid #dfe5ec;
  background: #f4fae8;
  color: var(--accent-dark);
  padding: 11px;
  border-radius: 8px;
  line-height: 1.45;
}

.hidden { display: none !important; }

dialog {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 0;
  width: min(560px, calc(100% - 24px));
  box-shadow: 0 20px 60px rgba(12, 24, 38, .24);
}

dialog::backdrop {
  background: rgba(11, 24, 36, .42);
}

.modal-body {
  padding: 18px;
}

@media (max-width: 900px) {
  .grid,
  .row {
    grid-template-columns: 1fr;
  }

  .day {
    min-height: 112px;
  }

  .brand,
  .brand-module,
  .brand-subtitle {
    text-align: left;
  }
}
.login-panel {max-width:500px;margin:50px auto;padding:32px;}
.login-options {margin-top:16px;flex-wrap:wrap;}
.login-panel h1 {font-size:30px;line-height:1.2;margin:16px 0;}
.eyebrow {font-size:11px;letter-spacing:2px;font-weight:700;color:#65704c;}
form .btn {margin-top:20px;}
.login-help {margin-top:20px!important;font-size:13px;}
a {color:#355100;}
.section-heading {margin:28px 0 20px;}
.section-heading h2 {margin:0 0 8px;}
.section-heading p {color:var(--muted);}
.stats {display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.stat {padding:22px;}
.stat span {color:var(--muted);font-size:13px;}
.stat strong {display:block;font-size:32px;margin-top:12px;}
.slot-card {display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0;}
.slot-card h3 {margin-top:14px;}
.slot-card p {margin:0;}
.empty-state {padding:40px 20px;text-align:center;background:white;border:1px dashed var(--line);border-radius:8px;}
.empty-state p {color:var(--muted);font-size:14px;}
.person {padding:14px;border-bottom:1px solid var(--line);}
.person strong {display:block;margin-bottom:5px;}
.filters {margin-bottom:22px;align-items:end;}
.status-pendente {background:var(--warn-bg);color:var(--warn-text);}
.status-aprovado {background:var(--ok-bg);color:var(--ok-text);}
.status-recusado {background:var(--off-bg);color:var(--off-text);}
.error {background:var(--off-bg);color:var(--off-text);}
#message {margin-bottom:18px;position:sticky;top:10px;z-index:5;}
button:disabled {opacity:.5;cursor:wait;}
button:focus-visible,a:focus-visible {outline:3px solid #7ea224;outline-offset:3px;}
@media(max-width:650px) {.tabs {display:flex;flex-wrap:wrap;} .tab {flex:1 0 45%;padding:10px;}.stats {gap:8px;}.stat {padding:12px;}.slot-card {display:block;}.slot-card button {margin-top:16px;width:100%;}.login-panel {margin:20px auto;padding:22px;}.row .actions {flex-wrap:wrap;}}
.calendar-toolbar {display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:12px 0 20px;}
.calendar-toolbar h3 {margin:0 12px;text-transform:capitalize;font-size:20px;}
.month-calendar {display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border-left:1px solid var(--line);border-top:1px solid var(--line);border-radius:8px;overflow:hidden;}
.calendar-weekday {padding:12px 4px;text-align:center;font-size:12px;font-weight:700;color:var(--muted);background:#f8f9fb;border-right:1px solid var(--line);border-bottom:1px solid var(--line);}
.calendar-cell {min-height:145px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:5px;background:white;cursor:pointer;}
.calendar-cell:hover {background:#f9fbf3;}
.calendar-cell.outside {background:#f4f5f7;}
.day-add {display:flex;justify-content:space-between;align-items:center;width:100%;background:transparent;border-radius:5px;padding:5px;color:var(--ink);}
.day-add span:first-child {display:grid;place-items:center;width:28px;height:28px;font-size:13px;}
.is-today .day-add span:first-child {background:var(--brand);color:var(--accent);border-radius:50%;}
.day-plus {font-size:20px;color:#748452;}
.calendar-events {display:grid;gap:4px;}
.calendar-event {text-align:left;width:100%;padding:6px;border-radius:5px;font-size:11px;line-height:1.4;overflow:hidden;}
.calendar-event strong,.calendar-event span {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.free-slots {color:#416400;background:#f2f8e5;border:1px dashed #adc675;border-radius:4px;text-align:left;font-size:11px;padding:5px;}
.day-event {padding:12px;text-align:left;border-radius:6px;}
#dayBookingForm {margin-top:20px;border-top:1px solid var(--line);padding-top:20px;}
#dayDialog,#eventDialog {max-height:90vh;overflow-y:auto;}
@media(max-width:650px) {.calendar-cell {min-height:95px;padding:2px;}.day-add {padding:1px;}.day-plus {font-size:14px;}.calendar-event {font-size:9px;padding:3px;}.free-slots {font-size:9px;padding:3px;}.calendar-toolbar h3 {font-size:17px;margin:0;}.calendar-toolbar .btn {padding:0 10px;}.day-add span:first-child {width:24px;height:24px;}}
.form-pair {display:grid;grid-template-columns:1fr 1fr;gap:14px;}
#allDayField {display:flex;align-items:center;gap:8px;}
#allDayField input {width:auto;min-height:0;}
.blocked-event {background:repeating-linear-gradient(135deg,#f5e8e8,#f5e8e8 8px,#f9eeee 8px,#f9eeee 16px);color:#8b3434;border:1px solid #e5bbbb;}
.schedule-card {display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:7px;background-color:white;}
.schedule-card span {display:block;margin-top:4px;}
#daySchedule {margin-top:14px;}
#scheduleDialog {max-height:90vh;overflow:auto;}
@media(max-width:650px) {.form-pair {grid-template-columns:1fr;}.schedule-card {display:block;}.schedule-card button {margin-top:10px;}}
.date-entry {display:flex;gap:6px;align-items:center;}
.date-entry > input:first-child {min-width:0;}
.date-entry .date-picker {width:46px;min-width:46px;color:transparent;padding:8px;cursor:pointer;}
.date-picker::-webkit-datetime-edit {display:none;}
#scopeDialog {max-height:90vh;overflow:auto;}
.daily-view {display:grid;grid-template-columns:205px minmax(0,1fr);gap:24px;margin-top:18px;}
.daily-sidebar {padding:8px 0;}
.daily-sidebar>.btn {width:100%;margin-bottom:20px;}
.daily-sidebar h3 {font-size:14px;text-transform:capitalize;}
.mini-calendar {display:grid;grid-template-columns:repeat(7,1fr);gap:3px;text-align:center;}
.mini-calendar>span {font-size:11px;color:var(--muted);padding:6px 0;}
.mini-calendar button {aspect-ratio:1;border-radius:50%;background:transparent;font-size:11px;padding:0;}
.mini-calendar button:hover {background:#e7edf7;}
.mini-calendar button.selected {background:#1a73e8;color:white;}
.daily-legend {display:grid;gap:12px;margin:25px 0;font-size:12px;}
.daily-legend span {display:flex;align-items:center;gap:8px;}
.daily-legend i {width:12px;height:12px;border-radius:3px;}
.legend-free {background:#d9edc1;}.legend-booked {background:#b5d1ff;}.legend-block {background:#dfaaaa;}
.daily-sidebar p {font-size:12px;line-height:1.6;}
.daily-sheet {border:1px solid #e5e9f0;border-radius:16px;overflow:hidden;background:white;min-width:0;}
.daily-date {padding:18px 18px 10px 64px;display:flex;flex-direction:column;align-items:flex-start;gap:5px;}
.daily-date>span:first-child {text-transform:uppercase;font-size:12px;color:#52617b;}
.daily-date strong {font-size:28px;font-weight:500;display:grid;place-items:center;width:44px;height:44px;}
.daily-date .today-number {background:#1a73e8;color:white;border-radius:50%;}
.daily-date>span:last-child {font-size:10px;color:#697383;margin-top:8px;}
.daily-all-day {display:grid;grid-template-columns:60px 1fr;gap:4px;border-bottom:1px solid #dde3ed;padding:4px 8px 8px 0;min-height:30px;font-size:10px;}
.daily-all-day>span {text-align:right;padding-right:8px;}
.daily-all-day>div {display:grid;gap:4px;}
.daily-all-day button {text-align:left;padding:5px 9px;border-radius:4px;font-size:12px;}
.daily-scroll {height:570px;max-height:65vh;overflow-y:auto;overscroll-behavior:contain;}
.daily-grid {height:1440px;position:relative;display:grid;grid-template-columns:60px minmax(0,1fr);}
.daily-hour-labels {position:relative;background:white;}
.daily-hour-labels>span {position:absolute;right:8px;color:#667086;font-size:11px;transform:translateY(-50%);}
.daily-hour-labels>span:first-child {transform:none;}
.daily-time-column {position:relative;border-left:1px solid #e1e6ee;margin-right:8px;}
.daily-hour-cell {position:absolute;left:0;width:100%;height:60px;border-top:1px solid #e5eaf3;background:linear-gradient(to bottom,transparent 29px,#f4f6fa 30px,transparent 31px);border-radius:0;}
.daily-hour-cell:hover {background:#eef5ff;}
.daily-appointment {position:absolute;z-index:2;text-align:left;border:1px solid #fff;border-left:3px solid #548adb;border-radius:6px;padding:4px 8px;font-size:12px;overflow:hidden;min-height:20px;}
.daily-appointment strong,.daily-appointment span {display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.5;}
.daily-appointment span {font-size:11px;}
.daily-appointment.status-aprovado {background:#d9e7ff;color:#174ea6;}
.daily-appointment.daily-free {background:#eef6e6;color:#36591d;border-left-color:#8bad62;}
.daily-appointment.blocked-event {border-left-color:#c27070;}
.daily-now {position:absolute;left:0;right:0;border-top:2px solid #e84949;z-index:3;pointer-events:none;}
.daily-now span {position:absolute;left:-5px;top:-5px;width:8px;height:8px;background:#e84949;border-radius:50%;}
@media(max-width:850px) {.daily-view {grid-template-columns:1fr;gap:12px;}.daily-sidebar {display:flex;flex-wrap:wrap;align-items:center;gap:10px;}.daily-sidebar>.btn {width:auto;margin:0;}.daily-sidebar h3,.daily-sidebar .mini-calendar,.daily-sidebar p,.daily-legend {display:none;}.daily-date {padding-top:10px;}.daily-appointment {padding:3px 5px;font-size:11px;}}
/* Calendar workspace: shared sidebar for month, day and list. */
main,.brandbar {width:min(1580px,100%);}
#app>.topbar {margin:8px 0 14px;}
#app>.topbar h1 {font-size:20px;margin:5px 0;}
.agenda-title {font-size:17px;font-weight:500;margin:20px 0 12px;}
.calendar-workspace {display:grid;grid-template-columns:220px minmax(0,1fr);gap:22px;align-items:start;}
.calendar-sidebar {padding:5px 8px 20px 0;}
.calendar-main {min-width:0;}
.calendar-main .calendar-toolbar {margin:0 0 14px;min-height:48px;}
.calendar-main .filters {gap:12px;margin-bottom:12px;}
.calendar-main .filters label {font-size:11px;color:var(--muted);margin-top:0;}
.calendar-main .filters input,.calendar-main .filters select {font-size:13px;min-height:35px;padding:7px;}
.calendar-main .filters .btn {font-size:12px;min-height:35px;}
.calendar-main #search {max-width:225px;}
.calendar-main .date-entry {max-width:180px;}
.calendar-main #calendarHint {font-size:11px;margin:8px 0;}
.create-menu {position:relative;margin-bottom:28px;width:170px;z-index:8;}
.create-menu summary {list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;background:white;box-shadow:0 2px 5px #14234225;border:1px solid #dce2eb;border-radius:18px;padding:13px 18px;font-size:15px;}
.create-menu summary::-webkit-details-marker {display:none;}
.create-menu summary>span:first-child {font-size:27px;line-height:1;}
.create-chevron {margin-left:auto;font-size:12px;}
.create-options {position:absolute;top:calc(100% + 5px);left:0;width:225px;background:#f0f4fa;padding:8px 0;border-radius:8px;box-shadow:0 5px 18px #1f2f4930;border:1px solid #d6dfe9;}
.create-options button {display:block;width:100%;background:transparent;text-align:left;padding:13px 17px;color:#273348;font-size:14px;}
.create-options button:hover {background:#dfe8f6;}
.sidebar-month-heading {display:flex;align-items:center;margin-bottom:6px;gap:2px;}
.sidebar-month-heading h3 {font-size:13px;text-transform:capitalize;margin:0 auto 0 0;}
.sidebar-month-heading button {width:25px;height:28px;border-radius:50%;background:transparent;font-size:23px;color:#536176;}
.technician-heading {margin:28px 0 12px;}
.technician-heading h3 {font-size:14px;margin:0 0 5px;}
.technician-heading>span {font-size:12px;color:#677489;}
.technician-calendars {display:grid;gap:3px;max-height:330px;overflow:auto;}
.technician-toggle {display:flex;align-items:center;gap:10px;padding:8px 5px;margin:0;border-radius:6px;font-size:13px;font-weight:400;cursor:pointer;}
.technician-toggle:hover {background:#eaf0f8;}
.technician-toggle input {width:16px;height:16px;min-height:0;margin:0;accent-color:var(--tech-color);flex:0 0 16px;}
.unselected-scope {opacity:.5;}
#technicianHint {font-size:11px;line-height:1.5;margin-top:12px;}
.calendar-main .month-calendar {background:white;border-radius:18px;border-color:#e3e8f1;box-shadow:none;}
.calendar-main .calendar-weekday {background:white;color:#657186;font-size:11px;font-weight:500;border-bottom:0;border-color:#e3e8f1;padding:12px 0 3px;}
.calendar-main .calendar-cell {min-height:128px;border-color:#e3e8f1;padding:3px 4px;}
.calendar-main .calendar-cell.outside {background:#fafbfd;}
.calendar-main .day-add {justify-content:center;padding:2px;margin-bottom:3px;}
.calendar-main .day-add span:first-child {font-weight:400;font-size:12px;width:25px;height:25px;}
.calendar-main .is-today .day-add span:first-child {background:#1a73e8;color:white;}
.calendar-main .calendar-events {gap:3px;}
.calendar-event.technician-event {padding:3px 5px;border-left:3px solid var(--tech-color);font-size:11px;line-height:1.4;}
.technician-event {background-color:var(--tech-soft)!important;color:var(--tech-color)!important;border-color:var(--tech-border)!important;}
.calendar-event.technician-event strong {font-weight:600;}
.calendar-event.technician-event span {font-size:10px;}
.technician-event.blocked-event {background-image:repeating-linear-gradient(135deg,transparent,transparent 5px,#ffffff80 5px,#ffffff80 9px);}
.technician-event.free-summary {background:white!important;border:0!important;color:var(--tech-color);}
.free-summary span::before {content:'●';margin-right:5px;}
.month-more {text-align:left;padding:2px 6px;font-size:11px;color:#596579;background:transparent;border-radius:5px;}
.month-more:hover {background:#edf1f7;}
.daily-view {grid-template-columns:minmax(0,1fr);margin-top:10px;}
.daily-appointment.technician-event {border-left:3px solid var(--tech-color)!important;}
.daily-appointment.daily-free {border:1px dashed var(--tech-border)!important;}
.technician-row {border-left:4px solid var(--tech-color);}
@media(min-width:1400px) {.calendar-main .calendar-cell {min-height:145px;}}
@media(max-width:1000px) {.calendar-workspace {grid-template-columns:175px minmax(0,1fr);gap:12px;}.calendar-main .calendar-cell {min-height:115px;}.create-menu {width:160px;}.calendar-event.technician-event {font-size:10px;padding:2px 3px;}}
@media(max-width:700px) {.calendar-workspace {grid-template-columns:1fr;gap:8px;}.calendar-sidebar {display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap;padding:0;}.create-menu {margin:0;width:155px;}.sidebar-month-heading,.calendar-sidebar .mini-calendar,.technician-heading,#technicianHint {display:none;}.technician-calendars {display:flex;flex-wrap:wrap;max-height:110px;flex:1;min-width:160px;gap:0;}.technician-toggle {font-size:11px;padding:5px;}.calendar-main .calendar-cell {min-height:112px;padding:2px;}.calendar-event.technician-event span {font-size:9px;}.calendar-main .calendar-toolbar h3 {font-size:17px;}}
/* Technician tags use cool colors; every block is yellow. */
.technician-name-tag {display:inline-block;background:var(--tech-color);color:#fff!important;border-radius:6px;padding:5px 9px;font-size:12px;font-weight:500;line-height:1.35;}
.technician-toggle .technician-name-tag {flex:1;}
.blocked-event,.technician-event.blocked-event,.daily-appointment.blocked-event,.calendar-event.blocked-event {background:#fff2b3!important;background-image:repeating-linear-gradient(135deg,transparent,transparent 7px,#ffffff55 7px,#ffffff55 12px)!important;color:#6b5000!important;border-color:#e5bf42!important;border-left-color:#d5a900!important;}
.daily-appointment {display:flex;align-items:stretch;padding:0!important;}
.daily-appointment-main {flex:1;min-width:0;background:transparent;color:inherit;text-align:left;padding:5px 8px;overflow:hidden;}
.daily-appointment-main strong,.daily-appointment-main span {display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.slot-actions {display:flex;align-items:center;gap:4px;flex-shrink:0;padding:2px 4px;}
.slot-icon {width:28px;height:28px;display:grid;place-items:center;border-radius:5px;background:#ffffffc9;color:#374151;border:1px solid #cad2de;}
.slot-icon svg {width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;}
.slot-icon:hover {background:white;box-shadow:0 1px 5px #0002;}
.block-icon:hover {background:#fff0a3;color:#725600;border-color:#d5a900;}
.delete-icon:hover {background:#fce5e5;color:#a32626;}
.schedule-card-main {flex:1;min-width:0;text-align:left;background:transparent;color:inherit;padding:4px;}
.schedule-card-main strong,.schedule-card-main span {display:block;}
.color-settings {display:flex;flex-wrap:wrap;gap:16px;}
.color-setting {display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:8px;}
.color-setting label {font-size:12px;margin:0;}
.color-setting select {min-width:140px;margin-top:5px;}
.daily-appointment .slot-actions {flex-direction:column;justify-content:center;gap:1px;}
.daily-appointment .slot-icon {height:22px;width:24px;}
.daily-appointment .slot-icon svg {height:14px;width:14px;}
@media(max-width:700px) {.schedule-card .slot-actions {margin-top:8px;}.daily-appointment-main {padding:3px;font-size:10px;}.daily-appointment .slot-actions {padding:1px;}.daily-appointment .slot-icon {width:21px;}}
.tag-colors-shortcut {display:block;background:transparent;color:#52657e;font-size:11px;margin:8px 0 0;padding:4px 0;}
.tag-colors-shortcut:hover {text-decoration:underline;}
.daily-appointment .slot-actions {flex-direction:row;gap:2px;}
/* Status is indicated by a badge; the event always keeps its technician color. */
.technician-event.blocked-event,.daily-appointment.blocked-event,.calendar-event.blocked-event,.schedule-card.blocked-event {background:var(--tech-soft)!important;background-image:none!important;color:var(--tech-color)!important;border-color:var(--tech-border)!important;border-left-color:var(--tech-color)!important;}
.technician-event.free-summary {background:var(--tech-soft)!important;border-left:3px solid var(--tech-color)!important;}
.schedule-card {background:var(--tech-soft);border-left:3px solid var(--tech-color);}
.availability-tag,.calendar-event.technician-event .availability-tag,.daily-appointment .availability-tag {display:inline-block!important;width:fit-content;max-width:100%;border-radius:4px;padding:1px 5px;font-size:10px!important;line-height:1.4;font-weight:600;margin-top:2px;white-space:nowrap;}
.availability-available {background:#dcfce7!important;color:#166534!important;}
.availability-blocked {background:#fef08a!important;color:#713f12!important;}
.availability-booked {background:#dbeafe!important;color:#1e40af!important;}
.daily-appointment-main {position:relative;}
.daily-appointment-main strong,.daily-appointment-main>span:not(.availability-tag) {line-height:1.25;}
.daily-appointment .availability-tag {margin-top:1px;}
.calendar-main .calendar-cell {min-height:150px;}
@media(max-width:700px) {.calendar-main .calendar-cell {min-height:135px;}.availability-tag,.calendar-event.technician-event .availability-tag {font-size:9px!important;}}
.availability-cancelled,.availability-refused {background:#e5e7eb!important;color:#374151!important;}
/* One status badge, adjacent to the time. */
.time-status-line,.daily-appointment-main>.time-status-line,.calendar-event.technician-event>.time-status-line,.schedule-card-main>.time-status-line {display:flex!important;align-items:center;gap:6px;flex-wrap:wrap;overflow:visible;white-space:normal;}
.time-status-line .availability-tag,.daily-appointment .time-status-line .availability-tag {margin-top:0;flex:0 0 auto;}
.time-status-line strong,.time-status-line>span:not(.availability-tag) {display:inline!important;}
.calendar-event .time-status-line {gap:3px;}
.registration-color {display:flex;align-items:center;gap:14px;margin-top:10px;flex-wrap:wrap;}
.registration-color label {font-size:12px;margin:0;}
.registration-color select {min-width:150px;margin-top:4px;}
.color-preview {margin-top:10px;}
.contact-link {display:inline-flex;align-items:center;text-decoration:none;}
.request-card {display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-radius:8px;}
.request-card p {font-size:13px;line-height:1.5;}
#bookingClientInfo,#dayClientInfo {margin-top:12px;}
#bookingClientInfo small,#dayClientInfo small,.request-card small {display:block;margin-top:6px;}
#trainingRequests {max-height:500px;overflow:auto;}
@media(max-width:700px) {.request-card {display:block;}.request-card .actions {margin-top:12px;}}

.access-layout{display:grid;grid-template-columns:minmax(230px,1fr) minmax(0,2fr);gap:20px;align-items:start}.access-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.access-three{grid-template-columns:1fr 1fr 1fr}.access-users{display:grid;gap:6px;margin-top:16px;max-height:650px;overflow:auto}.access-user{position:relative;text-align:left;padding:14px 32px 14px 14px;border:1px solid #e2e8f0;background:white;border-radius:8px;cursor:pointer;display:grid;gap:5px}.access-user.selected{background:#eef2ff;border-color:#7c3aed}.access-user span,.access-user small{color:#64748b;overflow-wrap:anywhere}.access-color-dot{position:absolute;width:13px;height:13px;border-radius:50%;right:12px;top:16px}.access-permissions{padding:16px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:10px}.access-layout form h3{margin-top:16px}.access-layout .color-preview{display:inline-block;margin-bottom:12px}@media(max-width:850px){.access-layout{grid-template-columns:1fr}.access-three{grid-template-columns:1fr}}@media(max-width:520px){.access-fields{grid-template-columns:1fr}}

.user-avatar{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;object-fit:cover;background:#e8eef7;color:#42526e;font-weight:600;flex-shrink:0}.user-photo-editor{display:flex;gap:20px;align-items:center;padding:18px 0}.user-avatar.large,.user-avatar.large .user-avatar{width:88px;height:88px;font-size:32px}.user-photo-editor small{display:block;color:#64748b;margin-bottom:10px}.access-user{padding-left:66px;min-height:90px}.access-user>.user-avatar{position:absolute;left:12px;top:16px}@media(max-width:520px){.user-photo-editor{align-items:flex-start;flex-direction:column}}

.booking-credit-panel{margin:18px 0}.booking-credit-row{display:flex;align-items:flex-end;gap:20px}.booking-credit-row>.staff{flex:1;min-width:220px}.booking-credit-select{flex:2;min-width:0}.booking-credit-row select{width:100%}.booking-credit-panel #bookingClientInfo:empty{display:none}@media(max-width:700px){.booking-credit-row{flex-direction:column;align-items:stretch}.booking-credit-row>.staff{min-width:0}}

.booked-highlight,.technician-event.booked-highlight{background:color-mix(in srgb,var(--tech-color) 82%,#000)!important;color:#fff!important;border-color:var(--tech-color)!important}.booked-highlight .muted{color:#eaf0fa}.booking-client{display:block;font-size:18px;font-weight:750;line-height:1.25}.booking-training{display:block;font-size:15px;font-weight:600;line-height:1.25}.calendar-event.technician-event .booking-client{font-size:13px;font-weight:750}.calendar-event.technician-event .booking-training{font-size:12px}.daily-appointment-main .booking-client{font-size:15px;font-weight:750;line-height:1.15}.daily-appointment-main .booking-training{font-size:13px;line-height:1.15}.daily-appointment.booked-highlight .time-status-line{flex-wrap:nowrap;line-height:1.1}.daily-appointment.booked-highlight .availability-tag{margin-top:0}.booking-options-row{display:grid;grid-template-columns:1fr 1fr 2fr;gap:20px;align-items:start}.booking-note-field textarea{min-height:44px;height:44px;resize:vertical}.booking-slots{width:100%}@media(max-width:700px){.booking-options-row{grid-template-columns:1fr}.calendar-event.technician-event .booking-client{font-size:12px}.calendar-event.technician-event .booking-training{font-size:11px}}

.email-log-link{background:none;border:0;color:#64748b;font-size:12px;padding:8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}#emailLogDialog{width:min(860px,95vw)}.email-log-row{padding:14px;border-bottom:1px solid #e2e8f0}.email-log-row p{margin:6px 0;overflow-wrap:anywhere}.email-log-row small{color:#64748b;line-height:1.6}#emailLogFilter{width:auto;margin:0}#emailLogRows{margin:14px 0}

#message.toast-message{position:fixed;top:18px;right:20px;left:auto;z-index:1000;max-width:min(460px,calc(100vw - 32px));display:flex;align-items:center;gap:14px;margin:0;padding:12px 16px;box-shadow:0 5px 20px #17233b26}#messageClose{border:0;background:transparent;font-size:23px;line-height:1;color:inherit;cursor:pointer;padding:3px}.page-loading{position:fixed;top:0;left:0;right:0;z-index:999;display:flex;align-items:center;justify-content:center;gap:9px;min-height:34px;background:#eef3ff;color:#29477d;font-size:13px;box-shadow:0 1px 5px #1b31551a;pointer-events:none}.loading-spinner{width:16px;height:16px;border:2px solid #b8c8e7;border-top-color:#375eae;border-radius:50%;animation:loading-spin .7s linear infinite}@keyframes loading-spin{to{transform:rotate(360deg)}}#message.hidden,.page-loading.hidden{display:none!important}@media(prefers-reduced-motion:reduce){.loading-spinner{animation:none;border-color:#375eae}}
.order-heading {display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:16px;}
.order-heading h3 {margin:8px 0;}
.order-total {display:grid;gap:8px;text-align:right;white-space:nowrap;}
.order-total strong {font-size:24px;}
.order-items {margin-top:20px;border-top:1px solid var(--line);padding-top:16px;}
.order-table-wrap {overflow-x:auto;}
.order-table {width:100%;border-collapse:collapse;text-align:left;}
.order-table td,.order-table th {padding:12px;border-bottom:1px solid var(--line);}
.orders-pagination {justify-content:center;margin-top:20px;}
@media(max-width:650px) {.order-heading {align-items:flex-start;flex-direction:column;}.order-total {text-align:left;}.order-table {min-width:620px;}}
.btn.reschedule-button {background:#facc15;border-color:#eab308;color:#422006;}
.btn.reschedule-button:hover {background:#eab308;}