/* =========================================================
   WebCarry Enterprise Booking — Premium UI Theme
   All original class names preserved for full compatibility.
========================================================= */

:root {
  --wcab-primary: #4f46e5;
  --wcab-primary-dark: #3730a3;
  --wcab-primary-light: #eef0ff;
  --wcab-accent: #06b6d4;
  --wcab-body-text-color: #10162f;
  --wcab-ink: var(--wcab-body-text-color);
  --wcab-muted: #64748b;
  --wcab-border: #e6e9f4;
  --wcab-surface: #ffffff;
  --wcab-surface-soft: #f7f8fd;
  --wcab-success-bg: #ecfdf5;
  --wcab-success-fg: #067647;
  --wcab-error-bg: #fef2f2;
  --wcab-error-fg: #b42318;
  --wcab-shadow-sm: 0 1px 2px rgba(16, 22, 47, 0.06);
  --wcab-shadow-md: 0 8px 24px rgba(16, 22, 47, 0.08);
  --wcab-shadow-lg: 0 24px 60px rgba(16, 22, 47, 0.14);
  --wcab-radius-sm: 10px;
  --wcab-radius-md: 16px;
  --wcab-radius-lg: 24px;

  /* Admin-customizable (overridden inline from Settings > Appearance). */
  --wcab-button-text: #ffffff;
  --wcab-heading-color: #10162f;
  --wcab-heading-weight: 800;
  --wcab-slot-available: #4ade80;
  --wcab-slot-selected: #f5a623;
  --wcab-slot-booked: #f15757;
  --wcab-slot-lunch: #9aa2b1;
  --wcab-staff-btn: #4f46e5;
  --wcab-staff-btn-hover: #3730a3;
  --wcab-staff-heading-weight: 800;
  --wcab-cal-available: #eef0f3;
  --wcab-cal-available-text: #334155;
  --wcab-cal-selected: #12b886;
  --wcab-cal-today: #4f46e5;
  --wcab-cal-today-text: #ffffff;

  /* Item 1/2: full per-button customization (color, border, size, hover,
     shadow) for every reusable button style used across the plugin —
     admin-customizable from Settings > Booking Form / Dashboard. */
  --wcab-btn-primary-border-color: transparent;
  --wcab-btn-primary-border-width: 0px;
  --wcab-btn-primary-radius: var(--wcab-radius-sm);
  --wcab-btn-primary-pad-y: 12px;
  --wcab-btn-primary-pad-x: 26px;
  --wcab-btn-primary-shadow-color: rgba(79, 70, 229, 0.25);
  --wcab-btn-primary-shadow-x: 0px;
  --wcab-btn-primary-shadow-y: 8px;
  --wcab-btn-primary-shadow-blur: 18px;
  --wcab-btn-primary-hover-shadow-color: rgba(79, 70, 229, 0.35);
  --wcab-btn-primary-hover-shadow-y: 16px;
  --wcab-btn-primary-hover-shadow-blur: 30px;

  --wcab-btn-secondary-bg: var(--wcab-surface-soft);
  --wcab-btn-secondary-hover-bg: #eef0ff;
  --wcab-btn-secondary-text: var(--wcab-ink);
  --wcab-btn-secondary-border-color: var(--wcab-border);
  --wcab-btn-secondary-border-width: 1.5px;
  --wcab-btn-secondary-radius: var(--wcab-radius-sm);
  --wcab-btn-secondary-pad-y: 12px;
  --wcab-btn-secondary-pad-x: 18px;
  --wcab-btn-secondary-shadow-color: transparent;
  --wcab-btn-secondary-shadow-x: 0px;
  --wcab-btn-secondary-shadow-y: 0px;
  --wcab-btn-secondary-shadow-blur: 0px;

  --wcab-btn-whatsapp-bg-start: #25d366;
  --wcab-btn-whatsapp-bg-end: #12b76a;
  --wcab-btn-whatsapp-text: #ffffff;
  --wcab-btn-whatsapp-border-color: transparent;
  --wcab-btn-whatsapp-border-width: 0px;
  --wcab-btn-whatsapp-radius: var(--wcab-radius-sm);
  --wcab-btn-whatsapp-pad-y: 11px;
  --wcab-btn-whatsapp-pad-x: 16px;
  --wcab-btn-whatsapp-shadow-color: rgba(18, 183, 106, 0.3);
  --wcab-btn-whatsapp-shadow-x: 0px;
  --wcab-btn-whatsapp-shadow-y: 10px;
  --wcab-btn-whatsapp-shadow-blur: 20px;

  --wcab-btn-print-bg: var(--wcab-surface-soft);
  --wcab-btn-print-hover-bg: var(--wcab-primary-light);
  --wcab-btn-print-text: var(--wcab-ink);
  --wcab-btn-print-border-color: var(--wcab-border);
  --wcab-btn-print-hover-border-color: var(--wcab-primary);
  --wcab-btn-print-border-width: 1.5px;
  --wcab-btn-print-radius: var(--wcab-radius-sm);
  --wcab-btn-print-pad-y: 11px;
  --wcab-btn-print-pad-x: 16px;

  --wcab-staff-btn-border-color: transparent;
  --wcab-staff-btn-border-width: 0px;
  --wcab-staff-btn-radius: var(--wcab-radius-sm);
  --wcab-staff-btn-shadow-color: rgba(79, 70, 229, 0.2);
  --wcab-staff-btn-shadow-x: 0px;
  --wcab-staff-btn-shadow-y: 4px;
  --wcab-staff-btn-shadow-blur: 12px;

  /* Item 2: general text styling, used wherever body copy is shown. */
  --wcab-body-font-size: 14px;
}

.wcab-wrapper,
.wcab-dashboard-panel,
.wcab-staff-login {
  font-family: var(--wcab-font-family, inherit);
  font-size: var(--wcab-body-font-size);
  color: var(--wcab-ink);
}

/* ---------- Main booking wrapper ---------- */
.wcab-wrapper {
  max-width: 1180px;
  margin: 30px auto;
  padding: 30px;
  border-radius: var(--wcab-radius-lg);
  background: linear-gradient(180deg, #ffffff 0%, #fbfbff 100%);
  border: 1px solid var(--wcab-border);
  box-shadow: var(--wcab-shadow-lg);
  position: relative;
}

.wcab-wrapper::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 4px;
  border-top-left-radius: var(--wcab-radius-lg);
  border-top-right-radius: var(--wcab-radius-lg);
  background: linear-gradient(90deg, var(--wcab-primary), var(--wcab-accent));
}

.wcab-header {
  display: flex;
  justify-content: space-between;
  gap: 20px;
  align-items: center;
  border-bottom: 1px solid var(--wcab-border);
  padding-bottom: 22px;
  margin-bottom: 26px;
}

.wcab-kicker {
  font-size: 12px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wcab-primary);
  font-weight: 700;
}

.wcab-header h2 {
  margin: 8px 0 6px;
  font-size: 30px;
  font-weight: var(--wcab-heading-weight);
  letter-spacing: -0.02em;
  color: var(--wcab-heading-color);
}

.wcab-header p {
  margin: 0;
  color: var(--wcab-muted);
  font-size: 15px;
}

.wcab-badge {
  background: linear-gradient(135deg, var(--wcab-primary), #6d5bf7);
  color: #fff;
  border: none;
  padding: 11px 20px;
  border-radius: 999px;
  font-weight: 700;
  white-space: nowrap;
  box-shadow: 0 10px 24px rgba(79, 70, 229, 0.3);
}

.wcab-grid {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 24px;
}

.wcab-panel {
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 22px;
  box-shadow: var(--wcab-shadow-sm);
  transition: box-shadow 0.2s ease;
}

.wcab-panel:hover {
  box-shadow: var(--wcab-shadow-md);
}

.wcab-panel h3 {
  margin-top: 0;
  color: var(--wcab-heading-color);
  font-size: 18px;
  font-weight: var(--wcab-heading-weight);
}

.wcab-wrapper label,
.wcab-dashboard-panel label {
  display: block;
  font-weight: 700;
  font-size: 13px;
  color: #364058;
  margin: 14px 0 7px;
}

.wcab-wrapper input,
.wcab-wrapper select,
.wcab-wrapper textarea,
.wcab-dashboard-panel input,
.wcab-dashboard-panel select,
.wcab-dashboard-panel textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  background: var(--wcab-surface);
  font-size: 15px;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  font-family: inherit;
}

.wcab-wrapper input:focus,
.wcab-wrapper select:focus,
.wcab-wrapper textarea:focus,
.wcab-dashboard-panel input:focus,
.wcab-dashboard-panel select:focus,
.wcab-dashboard-panel textarea:focus {
  outline: none;
  border-color: var(--wcab-primary);
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.12);
}

.wcab-info-box {
  background: var(--wcab-surface-soft);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  padding: 14px 16px;
  margin: 16px 0;
  color: #475467;
  font-size: 14px;
}

/* ---------- Employee picker with circular photo ---------- */
.wcab-employee-picker {
  position: relative;
}

.wcab-employee-input {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  background: var(--wcab-surface);
  cursor: pointer;
  font-size: 15px;
  color: var(--wcab-muted);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wcab-employee-input-label.has-value {
  color: var(--wcab-ink);
  font-weight: 600;
}

.wcab-employee-input-arrow {
  color: var(--wcab-muted);
  transition: transform 0.15s ease;
}

.wcab-employee-picker.active .wcab-employee-input {
  border-color: var(--wcab-primary);
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.12);
}

.wcab-employee-picker.active .wcab-employee-input-arrow {
  transform: rotate(180deg);
}

.wcab-employee-list {
  display: none;
  position: absolute;
  z-index: 20;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 280px;
  overflow-y: auto;
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  box-shadow: var(--wcab-shadow-lg);
  padding: 6px;
}

.wcab-employee-list.active {
  display: block;
}

.wcab-employee-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border-radius: var(--wcab-radius-sm);
  cursor: pointer;
  transition: background 0.15s ease;
}

.wcab-employee-item:hover {
  background: var(--wcab-primary-light);
}

.wcab-employee-avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: var(--wcab-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 700;
  font-size: 14px;
}

.wcab-employee-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.wcab-employee-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.wcab-employee-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--wcab-ink);
}

.wcab-employee-designation {
  font-size: 12px;
  font-weight: 400;
  color: var(--wcab-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wcab-employee-bio {
  font-size: 12px;
  color: var(--wcab-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wcab-employee-empty {
  padding: 14px;
  color: var(--wcab-muted);
  font-size: 13px;
  text-align: center;
}

/* ---------- Timezone row with auto-detect button ---------- */
.wcab-timezone-row {
  display: flex;
  gap: 8px;
  align-items: center;
}

.wcab-timezone-row .wcab-timezone {
  flex: 1 1 auto;
}

.wcab-tz-detect-btn {
  flex-shrink: 0;
  white-space: nowrap;
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-surface-soft);
  border-radius: var(--wcab-radius-sm);
  padding: 12px 14px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  color: var(--wcab-primary);
  transition: background 0.15s ease;
}

.wcab-tz-detect-btn:hover {
  background: var(--wcab-primary-light);
}

.wcab-calendar {
  overflow: hidden;
  border-radius: var(--wcab-radius-sm);
  border: 1px solid var(--wcab-border);
}

/* FullCalendar day-cell interactivity: hover, today, and selected states. */
.wcab-calendar .fc-daygrid-day {
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.wcab-calendar .fc-daygrid-day:hover {
  background-color: var(--wcab-primary-light);
}

.wcab-calendar .fc-day-today,
.wcab-calendar .wcab-fc-today {
  background-color: rgba(79, 70, 229, 0.1) !important;
}

.wcab-calendar .fc-daygrid-day.wcab-fc-today .fc-daygrid-day-number {
  font-weight: 800;
  color: var(--wcab-primary);
}

.wcab-calendar .fc-daygrid-day-number {
  padding: 6px 8px;
}

.wcab-calendar .fc-col-header-cell {
  background: var(--wcab-surface-soft);
}

.wcab-selected-date {
  background: var(--wcab-primary-light);
  border: 1px solid #d9defd;
  border-radius: var(--wcab-radius-sm);
  padding: 12px 14px;
  margin-bottom: 12px;
  color: var(--wcab-primary-dark);
  font-weight: 600;
  font-size: 14px;
}

.wcab-slots {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  min-height: 70px;
  margin-bottom: 22px;
}

.wcab-slot {
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-surface);
  border-radius: var(--wcab-radius-sm);
  padding: 13px;
  cursor: pointer;
  font-weight: 700;
  font-size: 14px;
  color: var(--wcab-ink);
  transition: all 0.15s ease;
}

.wcab-slot:hover:not(:disabled):not(.active):not(.wcab-slot-booked) {
  background: #111827 !important;
  border-color: #111827 !important;
  color: #ffffff !important;
  transform: translateY(-1px);
}

.wcab-slot.active {
  background: var(--wcab-slot-selected);
  color: #ffffff;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
}

.wcab-slot-available {
  border-color: var(--wcab-slot-available);
}

.wcab-slot-available::before {
  content: "";
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--wcab-slot-available);
  margin-right: 6px;
  vertical-align: middle;
}

.wcab-slot-booked,
.wcab-slot-lunch,
.wcab-slot-dinner {
  cursor: not-allowed;
  opacity: 0.75;
}

.wcab-slot-booked {
  background: color-mix(in srgb, var(--wcab-slot-booked) 14%, #fff);
  border-color: var(--wcab-slot-booked);
  color: var(--wcab-slot-booked);
}

.wcab-slot-lunch,
.wcab-slot-dinner {
  background: color-mix(in srgb, var(--wcab-slot-lunch) 16%, #fff);
  border-color: var(--wcab-slot-lunch);
  color: var(--wcab-slot-lunch);
}

.wcab-slot-lunch:hover,
.wcab-slot-dinner:hover,
.wcab-slot-booked:hover {
  transform: none;
}

.wcab-slot-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 14px;
  font-size: 13px;
  font-weight: 700;
  color: var(--wcab-ink);
}

.wcab-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.wcab-legend-dot {
  width: 12px;
  height: 12px;
  border-radius: 4px;
  display: inline-block;
}

.wcab-legend-available { background: var(--wcab-slot-available); }
.wcab-legend-selected { background: var(--wcab-slot-selected); }
.wcab-legend-booked { background: var(--wcab-slot-booked); }
.wcab-legend-lunch { background: var(--wcab-slot-lunch); }

.wcab-booking-ref {
  margin-top: 8px;
  font-size: 14px;
  color: var(--wcab-ink);
}

.wcab-submit {
  background: linear-gradient(135deg, var(--wcab-primary), var(--wcab-primary-dark));
  color: var(--wcab-button-text);
  border: var(--wcab-btn-primary-border-width) solid var(--wcab-btn-primary-border-color);
  border-radius: var(--wcab-btn-primary-radius);
  padding: var(--wcab-btn-primary-pad-y) var(--wcab-btn-primary-pad-x);
  font-size: 15px;
  font-weight: 800;
  cursor: pointer;
  letter-spacing: 0.01em;
  box-shadow: var(--wcab-btn-primary-shadow-x) var(--wcab-btn-primary-shadow-y) var(--wcab-btn-primary-shadow-blur) var(--wcab-btn-primary-shadow-color);
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.wcab-btn-secondary {
  background: var(--wcab-btn-secondary-bg);
  color: var(--wcab-btn-secondary-text);
  border: var(--wcab-btn-secondary-border-width) solid var(--wcab-btn-secondary-border-color);
  border-radius: var(--wcab-btn-secondary-radius);
  padding: var(--wcab-btn-secondary-pad-y) var(--wcab-btn-secondary-pad-x);
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--wcab-btn-secondary-shadow-x) var(--wcab-btn-secondary-shadow-y) var(--wcab-btn-secondary-shadow-blur) var(--wcab-btn-secondary-shadow-color);
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.wcab-btn-secondary:hover {
  background: var(--wcab-btn-secondary-hover-bg);
}

.wcab-submit:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: var(--wcab-btn-primary-shadow-x) var(--wcab-btn-primary-hover-shadow-y) var(--wcab-btn-primary-hover-shadow-blur) var(--wcab-btn-primary-hover-shadow-color);
}

.wcab-submit:active:not(:disabled) {
  transform: translateY(0);
}

.wcab-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

.wcab-success,
.wcab-error,
.wcab-empty,
.wcab-loading {
  margin-top: 12px;
  padding: 13px 15px;
  border-radius: var(--wcab-radius-sm);
  font-size: 14px;
  font-weight: 600;
}

.wcab-success {
  background: var(--wcab-success-bg);
  color: var(--wcab-success-fg);
  border: 1px solid #b7f0d3;
}

.wcab-error {
  background: var(--wcab-error-bg);
  color: var(--wcab-error-fg);
  border: 1px solid #fecdca;
}

.wcab-empty,
.wcab-loading {
  background: var(--wcab-surface-soft);
  color: var(--wcab-muted);
  border: 1px solid var(--wcab-border);
}

.wcab-whatsapp {
  display: inline-block;
  margin-top: 10px;
  background: linear-gradient(135deg, var(--wcab-btn-whatsapp-bg-start), var(--wcab-btn-whatsapp-bg-end));
  color: var(--wcab-btn-whatsapp-text) !important;
  text-decoration: none;
  border: var(--wcab-btn-whatsapp-border-width) solid var(--wcab-btn-whatsapp-border-color);
  padding: var(--wcab-btn-whatsapp-pad-y) var(--wcab-btn-whatsapp-pad-x);
  border-radius: var(--wcab-btn-whatsapp-radius);
  font-weight: 800;
  box-shadow: var(--wcab-btn-whatsapp-shadow-x) var(--wcab-btn-whatsapp-shadow-y) var(--wcab-btn-whatsapp-shadow-blur) var(--wcab-btn-whatsapp-shadow-color);
  transition: transform 0.15s ease;
}

.wcab-whatsapp:hover {
  transform: translateY(-1px);
}

.wcab-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: var(--wcab-surface);
  border-radius: var(--wcab-radius-sm);
  overflow: hidden;
  border: 1px solid var(--wcab-border);
  table-layout: auto;
}

.wcab-table-wrap .wcab-table {
  min-width: 1450px;
}

.wcab-table th,
.wcab-table td {
  border-bottom: 1px solid var(--wcab-border);
  padding: 12px 14px;
  text-align: left;
  font-size: var(--wcab-table-cell-size, 14px);
  color: var(--wcab-table-cell-color, var(--wcab-ink));
  vertical-align: top;
}

.wcab-table th {
  white-space: normal;
}

.wcab-table th {
  background: linear-gradient(180deg, #fbfbff, var(--wcab-surface-soft));
  font-weight: 700;
  color: var(--wcab-table-header-color, #364058);
  text-transform: uppercase;
  font-size: var(--wcab-table-header-size, 11px);
  letter-spacing: 0.04em;
  line-height: 1.35;
  border-bottom: 2px solid rgba(79, 70, 229, 0.14);
}

/* Item 3/4/5: per-column widths (including Select and Action) are now
   generated inline from Settings > Dashboard via [data-col="..."] rules,
   so no fixed nth-child sizing is needed here — it previously fell out of
   sync whenever a column was added/reordered and caused columns like
   Payment/Reason/Action to collapse under the table's fixed layout. */

.wcab-table tr:last-child td {
  border-bottom: none;
}

.wcab-table tbody tr {
  transition: background 0.15s ease, box-shadow 0.15s ease;
}

.wcab-table tbody tr:hover {
  background: var(--wcab-surface-soft);
  box-shadow: inset 3px 0 0 var(--wcab-primary);
}

@media (max-width: 850px) {
  .wcab-grid { grid-template-columns: 1fr; }
  .wcab-header { flex-direction: column; align-items: flex-start; }
  .wcab-slots { grid-template-columns: 1fr; }
  .wcab-wrapper { padding: 20px; }
}

/* ---------- Powered by ribbon ---------- */
/* ---------- Step wizard ---------- */
.wcab-wizard-steps {
  display: flex;
  justify-content: space-between;
  margin-bottom: 26px;
  position: relative;
}

.wcab-wizard-steps::before {
  content: "";
  position: absolute;
  top: 15px;
  left: 6%;
  right: 6%;
  height: 2px;
  background: var(--wcab-border);
  z-index: 0;
}

.wcab-wizard-step-dot {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 1;
  text-align: center;
}

.wcab-wizard-step-dot span {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--wcab-surface);
  border: 2px solid var(--wcab-border);
  color: var(--wcab-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  transition: all 0.2s ease;
}

.wcab-wizard-step-dot label {
  margin-top: 6px;
  font-size: 12px;
  color: var(--wcab-muted);
  font-weight: 600;
}

.wcab-wizard-step-dot.active span {
  background: var(--wcab-primary);
  border-color: var(--wcab-primary);
  color: #fff;
}

.wcab-wizard-step-dot.active label {
  color: var(--wcab-primary);
}

.wcab-wizard-step-dot.completed span {
  background: var(--wcab-success-fg);
  border-color: var(--wcab-success-fg);
  color: #fff;
}

.wcab-wizard-panel {
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 24px;
  box-shadow: 0 2px 8px rgba(16, 22, 47, 0.05);
  min-height: 520px;
}

.wcab-wrapper button:focus-visible,
.wcab-wrapper input:focus-visible,
.wcab-wrapper select:focus-visible,
.wcab-wrapper textarea:focus-visible,
.wcab-wrapper a:focus-visible {
  outline: 2px solid var(--wcab-primary);
  outline-offset: 2px;
}

.wcab-wizard-step {
  display: none;
  animation: wcab-step-fade 0.25s ease;
}

.wcab-wizard-step.active {
  display: block;
}

@keyframes wcab-step-fade {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.wcab-wizard-step h3 {
  margin-top: 0;
  font-size: 18px;
  font-weight: var(--wcab-heading-weight);
  color: var(--wcab-heading-color);
}

.wcab-nav-row {
  display: flex;
  justify-content: space-between;
  margin-top: 22px;
}

.wcab-btn-primary {
  background: linear-gradient(135deg, var(--wcab-primary), var(--wcab-primary-dark));
  color: var(--wcab-button-text);
  border: var(--wcab-btn-primary-border-width) solid var(--wcab-btn-primary-border-color);
  border-radius: var(--wcab-btn-primary-radius);
  padding: var(--wcab-btn-primary-pad-y) var(--wcab-btn-primary-pad-x);
  font-weight: 800;
  font-size: 15px;
  cursor: pointer;
  box-shadow: var(--wcab-btn-primary-shadow-x) var(--wcab-btn-primary-shadow-y) var(--wcab-btn-primary-shadow-blur) var(--wcab-btn-primary-shadow-color);
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.wcab-btn-primary:hover:not(:disabled) {
  transform: translateY(-1px);
}

.wcab-btn-primary:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  box-shadow: none;
}

/* ---------- Location selector ---------- */
.wcab-location-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 6px;
}

.wcab-location-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  padding: 14px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.wcab-location-option-custom {
  flex-direction: column;
  align-items: stretch;
  cursor: default;
}

.wcab-location-option-custom-row {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  cursor: pointer;
}

.wcab-location-option:hover {
  border-color: var(--wcab-primary);
  background: var(--wcab-surface-soft);
}

.wcab-location-option:has(.wcab-location-radio:checked),
.wcab-location-option.wcab-location-selected {
  border-color: var(--wcab-primary);
  background: var(--wcab-primary-light);
}

.wcab-location-radio {
  margin-top: 3px;
  accent-color: var(--wcab-primary);
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.wcab-location-icon {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--wcab-primary-light);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  flex-shrink: 0;
}

.wcab-location-icon-zoom {
  background: #2563eb;
  color: #fff;
}

.wcab-location-icon-custom {
  background: #1e3a5f;
  color: #fff;
}

.wcab-location-content {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.wcab-location-label {
  font-weight: 700;
  font-size: 14px;
  color: var(--wcab-ink);
}

.wcab-location-note {
  font-size: 12px;
  color: var(--wcab-primary);
}

.wcab-location-custom-input {
  width: 100%;
  padding: 12px 14px;
  border: 1.5px solid var(--wcab-primary);
  border-radius: var(--wcab-radius-sm);
  font-size: 14px;
  margin-top: 10px;
  box-sizing: border-box;
}

/* ---------- Legal notice + modal ---------- */
.wcab-legal-notice {
  font-size: 12px;
  color: var(--wcab-muted);
  line-height: 1.6;
  margin: 14px 0 4px;
}

.wcab-legal-link {
  color: var(--wcab-primary);
  font-weight: 700;
  text-decoration: underline;
}

.wcab-legal-modal-body {
  text-align: left;
  max-height: 50vh;
  overflow-y: auto;
  font-size: 14px;
  color: var(--wcab-ink);
  line-height: 1.6;
  margin-top: 10px;
}

/* ---------- Calendly-style circular calendar ---------- */
.wcab-calendar .fc-theme-standard td,
.wcab-calendar .fc-theme-standard th {
  border: none;
}

.wcab-calendar .fc-scrollgrid {
  border: none;
}

.wcab-calendar .fc-col-header-cell {
  background: transparent;
  border: none;
  padding: 6px 0 14px;
}

.wcab-calendar .fc-col-header-cell-cushion {
  color: var(--wcab-muted);
  font-weight: 700;
  font-size: 13px;
  text-decoration: none;
}

.wcab-calendar .fc-daygrid-day {
  border: none;
  text-align: center;
  padding: 4px 0;
}

.wcab-calendar .fc-daygrid-day-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 52px;
}

.wcab-calendar .fc-daygrid-day-top {
  display: flex;
  justify-content: center;
  width: 100%;
}

.wcab-calendar .fc-daygrid-day-number {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--wcab-cal-available);
  color: var(--wcab-cal-available-text);
  font-weight: 700;
  font-size: 14px;
  transition: all 0.15s ease;
  float: none;
}

.wcab-calendar .fc-day-past .fc-daygrid-day-number,
.wcab-calendar .fc-day-disabled .fc-daygrid-day-number {
  background: transparent;
  color: #cbd5e1;
}

.wcab-calendar .fc-daygrid-day:not(.fc-day-past):not(.fc-day-disabled) .fc-daygrid-day-number:hover {
  background: var(--wcab-cal-selected);
  color: #fff;
  cursor: pointer;
  transform: scale(1.05);
  opacity: 0.75;
}

.wcab-calendar .fc-day-today .fc-daygrid-day-number {
  background: var(--wcab-cal-today);
  color: var(--wcab-cal-today-text);
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18);
}

.wcab-calendar .wcab-fc-selected .fc-daygrid-day-number {
  background: var(--wcab-cal-selected) !important;
  color: #fff !important;
  box-shadow: none;
}

.wcab-calendar .fc-daygrid-day-events {
  display: none;
}

.wcab-calendar .fc-daygrid-body,
.wcab-calendar .fc-scrollgrid-sync-table {
  width: 100% !important;
}

.wcab-calendar .fc-toolbar.fc-header-toolbar {
  margin-bottom: 14px;
}

.wcab-calendar .fc-toolbar-title {
  font-size: 18px;
  font-weight: 800;
  color: var(--wcab-heading-color);
}

.wcab-calendar .fc-button {
  background: var(--wcab-surface-soft) !important;
  border: 1px solid var(--wcab-border) !important;
  color: var(--wcab-ink) !important;
  box-shadow: none !important;
  border-radius: 8px !important;
}

.wcab-calendar .fc-button:hover {
  background: var(--wcab-primary-light) !important;
}

.wcab-calendar .fc-button-primary:not(:disabled).fc-button-active {
  background: var(--wcab-primary) !important;
  border-color: var(--wcab-primary) !important;
  color: #fff !important;
}

/* ---------- Modal ---------- */
.wcab-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(16, 22, 47, 0.6);
  backdrop-filter: blur(2px);
  z-index: 99999;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.wcab-modal.active {
  display: flex;
}

.wcab-modal-card {
  max-width: 480px;
  width: 100%;
  background: var(--wcab-surface);
  border-radius: var(--wcab-radius-lg);
  padding: 30px;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
  position: relative;
  text-align: center;
  border-top: 4px solid var(--wcab-primary);
}

.wcab-modal-card h3 {
  margin: 0 0 12px;
  font-size: 22px;
  font-weight: 800;
}

.wcab-modal-card p {
  color: #475467;
  font-size: 15px;
  line-height: 1.6;
}

.wcab-modal-close {
  position: absolute;
  top: 10px;
  right: 14px;
  border: 0;
  background: transparent;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: var(--wcab-muted);
  transition: color 0.15s ease;
}

.wcab-modal-close:hover {
  color: var(--wcab-ink);
}

.wcab-modal-summary {
  margin-top: 14px;
  text-align: left;
}

.wcab-modal-summary-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--wcab-surface-soft);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  overflow: hidden;
}

.wcab-modal-summary-table td {
  padding: 9px 12px;
  font-size: 13px;
  border-bottom: 1px solid var(--wcab-border);
}

.wcab-modal-summary-table tr:last-child td {
  border-bottom: none;
}

.wcab-modal-summary-table td:first-child {
  color: var(--wcab-muted);
  font-weight: 700;
  width: 45%;
}

.wcab-modal-summary-table td:last-child {
  color: var(--wcab-ink);
  font-weight: 700;
  text-align: right;
}

.wcab-modal-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 18px;
}

.wcab-modal-actions .wcab-submit,
.wcab-modal-actions .wcab-btn-secondary {
  margin-top: 0;
  width: 100%;
}

.wcab-modal-actions-row {
  display: flex;
  gap: 10px;
}

.wcab-modal-actions-row .wcab-whatsapp,
.wcab-modal-actions-row .wcab-print-btn {
  flex: 1 1 50%;
  width: auto;
  margin-top: 0;
  border: 0;
  cursor: pointer;
  font-family: inherit;
  font-size: 14px;
}

.wcab-print-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--wcab-btn-print-bg);
  color: var(--wcab-btn-print-text) !important;
  border: var(--wcab-btn-print-border-width) solid var(--wcab-btn-print-border-color) !important;
  padding: var(--wcab-btn-print-pad-y) var(--wcab-btn-print-pad-x);
  border-radius: var(--wcab-btn-print-radius);
  font-weight: 800;
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}

.wcab-print-btn:hover {
  transform: translateY(-1px);
  border-color: var(--wcab-btn-print-hover-border-color) !important;
  background: var(--wcab-btn-print-hover-bg);
}

/* ---------- Staff dashboard ---------- */
.wcab-dashboard-panel {
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-lg);
  padding: 26px;
  margin: 24px 0;
  box-shadow: var(--wcab-shadow-md);
}

.wcab-dashboard-brand {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}

.wcab-dashboard-brand-logo {
  max-height: 42px;
  max-width: 160px;
  width: auto;
  height: auto;
  object-fit: contain;
}

.wcab-dashboard-brand-name {
  font-size: 15px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--wcab-ink);
}

.wcab-dashboard-head {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  align-items: flex-start;
  margin-bottom: 18px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--wcab-border);
}

.wcab-dashboard-head h3 {
  margin: 0 0 6px;
  font-size: var(--wcab-dash-heading-size, 24px);
  font-weight: var(--wcab-staff-heading-weight);
  letter-spacing: -0.01em;
  color: var(--wcab-heading-color);
}

.wcab-dashboard-head p,
.wcab-dashboard-note {
  margin: 0;
  color: var(--wcab-muted);
  font-size: 14px;
}

.wcab-stats-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(100px, 1fr));
  gap: 12px;
  margin: 18px 0 22px;
}

.wcab-stat-card {
  background: linear-gradient(160deg, #ffffff, var(--wcab-surface-soft));
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 16px 14px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-decoration: none !important;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  min-width: 0;
}

.wcab-stat-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--wcab-shadow-md);
}

.wcab-stat-card.wcab-stat-active {
  border-width: 2px;
  box-shadow: var(--wcab-shadow-md);
}

.wcab-stat-icon {
  width: 38px;
  height: 38px;
  border-radius: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  background: rgba(16, 22, 47, 0.07);
  color: var(--wcab-ink);
  flex-shrink: 0;
}

.wcab-stat-icon svg {
  width: 19px;
  height: 19px;
}

.wcab-stat-label {
  display: block;
  color: var(--wcab-muted);
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 6px;
}

.wcab-stat-card strong {
  display: block;
  font-size: 30px;
  line-height: 1;
  font-weight: 800;
  color: var(--wcab-ink);
}

/* Distinct color per status so the dashboard is scannable at a glance. */
.wcab-stat-total strong { color: var(--wcab-ink); }
.wcab-stat-total.wcab-stat-active { border-color: var(--wcab-ink); }
.wcab-stat-total .wcab-stat-icon { background: rgba(16, 22, 47, 0.08); color: var(--wcab-ink); }

.wcab-stat-pending strong { color: #b45309; }
.wcab-stat-pending.wcab-stat-active { border-color: #b45309; background: #fffbeb; }
.wcab-stat-pending .wcab-stat-icon { background: rgba(180, 83, 9, 0.12); color: #b45309; }

.wcab-stat-approved strong { color: #067647; }
.wcab-stat-approved.wcab-stat-active { border-color: #067647; background: #ecfdf5; }
.wcab-stat-approved .wcab-stat-icon { background: rgba(6, 118, 71, 0.12); color: #067647; }

.wcab-stat-cancelled strong { color: #b42318; }
.wcab-stat-cancelled.wcab-stat-active { border-color: #b42318; background: #fef2f2; }
.wcab-stat-cancelled .wcab-stat-icon { background: rgba(180, 35, 24, 0.12); color: #b42318; }

.wcab-stat-postponed strong { color: #c2410c; }
.wcab-stat-postponed.wcab-stat-active { border-color: #c2410c; background: #fff7ed; }
.wcab-stat-postponed .wcab-stat-icon { background: rgba(194, 65, 12, 0.12); color: #c2410c; }

.wcab-stat-pending_payment strong { color: #7c3aed; }
.wcab-stat-pending_payment.wcab-stat-active { border-color: #7c3aed; background: #f5f3ff; }
.wcab-stat-pending_payment .wcab-stat-icon { background: rgba(124, 58, 237, 0.12); color: #7c3aed; }

.wcab-stat-rescheduled strong { color: #0e7490; }
.wcab-stat-rescheduled.wcab-stat-active { border-color: #0e7490; background: #ecfeff; }
.wcab-stat-rescheduled .wcab-stat-icon { background: rgba(14, 116, 144, 0.12); color: #0e7490; }

.wcab-filter-form {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 14px;
  background: linear-gradient(160deg, #ffffff, var(--wcab-surface-soft));
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 20px;
  margin-bottom: 22px;
  box-shadow: var(--wcab-shadow-sm);
}

.wcab-filter-field {
  display: flex;
  flex-direction: column;
  flex: 1 1 150px;
  min-width: 150px;
}

.wcab-filter-field-search {
  flex: 2 1 220px;
}

.wcab-filter-form label {
  display: block;
  font-size: 11px;
  font-weight: 800;
  color: var(--wcab-muted);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin: 0 0 6px;
}

.wcab-filter-form input,
.wcab-filter-form select {
  width: 100%;
  min-height: 44px;
  border: 1.5px solid var(--wcab-border);
  border-radius: 12px;
  padding: 8px 14px;
  box-sizing: border-box;
  background: var(--wcab-surface);
  font-size: 14px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wcab-filter-form input:focus,
.wcab-filter-form select:focus {
  outline: none;
  border-color: var(--wcab-staff-btn);
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
}

.wcab-filter-actions {
  display: flex;
  gap: 16px;
  flex: 0 0 auto;
  margin-left: auto;
}

.wcab-filter-btn,
.wcab-clear-btn {
  min-height: 44px;
  border-radius: 12px;
  border: 0;
  padding: 10px 20px;
  font-weight: 800;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
  -webkit-tap-highlight-color: transparent;
}

.wcab-filter-btn svg,
.wcab-clear-btn svg {
  width: 15px;
  height: 15px;
  flex-shrink: 0;
}

.wcab-filter-btn {
  background: linear-gradient(135deg, var(--wcab-staff-btn), var(--wcab-staff-btn-hover));
  color: #fff;
  border: var(--wcab-staff-btn-border-width) solid var(--wcab-staff-btn-border-color);
  border-radius: var(--wcab-staff-btn-radius);
  box-shadow: var(--wcab-staff-btn-shadow-x) var(--wcab-staff-btn-shadow-y) var(--wcab-staff-btn-shadow-blur) var(--wcab-staff-btn-shadow-color);
}

.wcab-filter-btn:hover,
.wcab-filter-btn:focus-visible {
  transform: translateY(-1px);
  filter: brightness(1.05);
  outline: none;
}

.wcab-filter-btn:active {
  transform: translateY(0);
  filter: brightness(0.97);
}

/* ---------- Header action buttons (Calendar View / Refresh / Logout) ---------- */
/* Explicit hover / focus / active / visited states below so the buttons
   always return to their normal "premium outline" look and never stay
   stuck in the hover/tap-highlight color after a click or tap. */
.wcab-refresh-btn {
  min-height: 44px;
  border-radius: 12px;
  padding: 10px 18px;
  font-weight: 800;
  font-size: 14px;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: var(--wcab-surface-soft);
  color: var(--wcab-staff-btn) !important;
  border: 1.5px solid var(--wcab-staff-btn);
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

.wcab-refresh-btn .wcab-btn-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}

.wcab-calendar-toggle-btn {
  min-width: 172px;
}

.wcab-refresh-btn:visited {
  color: var(--wcab-staff-btn) !important;
}

.wcab-refresh-btn:hover {
  background: var(--wcab-staff-btn);
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(79, 70, 229, 0.22);
}

.wcab-refresh-btn:focus-visible {
  background: var(--wcab-surface-soft);
  color: var(--wcab-staff-btn) !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18);
}

.wcab-refresh-btn:active {
  transform: translateY(0) scale(0.98);
}

/* Once the mouse/finger leaves and the button is no longer focused, force it
   back to the default (non-hover) look, even if the browser/theme applies a
   lingering :focus or tap-highlight style. */
.wcab-refresh-btn:not(:hover):not(:focus-visible) {
  background: var(--wcab-surface-soft);
  color: var(--wcab-staff-btn) !important;
  box-shadow: none;
}

.wcab-dashboard-actions {
  display: flex;
  gap: 10px;
  align-items: center;
  flex-wrap: wrap;
}

.wcab-clear-btn {
  background: #fef2f2;
  color: var(--wcab-error-fg) !important;
  border: 1px solid #fecdca;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

.wcab-clear-btn:visited {
  color: var(--wcab-error-fg) !important;
}

.wcab-clear-btn:hover {
  background: #fee4e2;
}

.wcab-clear-btn:focus-visible {
  box-shadow: 0 0 0 3px rgba(180, 35, 24, 0.15);
}

.wcab-clear-btn:active {
  transform: translateY(0) scale(0.98);
}

.wcab-dashboard-actions .wcab-clear-btn:not(:hover):not(:focus-visible) {
  background: #fef2f2;
}

.wcab-table-wrap {
  width: 100%;
  overflow-x: auto;
  border-radius: var(--wcab-radius-sm);
}

.wcab-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 6px 12px 6px 10px;
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  background: var(--wcab-primary-light);
  color: var(--wcab-primary-dark);
  border: 1px solid rgba(16, 22, 47, 0.05);
  box-shadow: 0 1px 2px rgba(16, 22, 47, 0.04);
}

.wcab-status-badge::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: currentColor;
  flex-shrink: 0;
}

.wcab-status-pending { background: var(--wcab-status-pending-bg, #eef0ff); color: var(--wcab-status-pending-fg, #4338ca); }
.wcab-status-approved { background: var(--wcab-status-approved-bg, #ecfdf5); color: var(--wcab-status-approved-fg, #067647); }
.wcab-status-cancelled { background: var(--wcab-status-cancelled-bg, #fef2f2); color: var(--wcab-status-cancelled-fg, #b42318); }
.wcab-status-postponed { background: var(--wcab-status-postponed-bg, #fff7ed); color: var(--wcab-status-postponed-fg, #c2410c); }
.wcab-status-pending_payment { background: var(--wcab-status-pending_payment-bg, #fffbeb); color: var(--wcab-status-pending_payment-fg, #b45309); }
.wcab-status-rescheduled { background: var(--wcab-status-rescheduled-bg, #ecfeff); color: var(--wcab-status-rescheduled-fg, #0e7490); }

/* Item 8: slightly larger stat-card icon badges on desktop only (mobile keeps the compact size). */
@media (min-width: 901px) {
  .wcab-stat-icon {
    width: 46px;
    height: 46px;
    border-radius: 13px;
  }
  .wcab-stat-icon svg {
    width: 23px;
    height: 23px;
  }
}

@media (max-width: 1300px) {
  .wcab-stats-grid { grid-template-columns: repeat(4, 1fr); }
}

@media (max-width: 1100px) {
  .wcab-stats-grid { grid-template-columns: repeat(3, 1fr); }
  .wcab-filter-field { flex: 1 1 45%; min-width: 140px; }
}

@media (max-width: 650px) {
  .wcab-stats-grid { grid-template-columns: 1fr; }
  .wcab-filter-field,
  .wcab-filter-field-search { flex: 1 1 100%; }
  .wcab-filter-actions { width: 100%; margin-left: 0; }
  .wcab-filter-actions .wcab-filter-btn,
  .wcab-filter-actions .wcab-clear-btn { flex: 1 1 50%; }
  .wcab-dashboard-panel { padding: 18px; }
  .wcab-dashboard-head { flex-direction: column; }
  .wcab-dashboard-brand { margin-bottom: 12px; }
}

/* ---------- Plugin-only staff login ---------- */
.wcab-staff-login {
  max-width: 460px;
  margin: 50px auto;
}

.wcab-staff-login.wcab-dashboard-panel {
  text-align: left;
  box-shadow: var(--wcab-shadow-lg);
  border: 1px solid var(--wcab-border);
  position: relative;
  overflow: hidden;
}

.wcab-staff-login.wcab-dashboard-panel::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 5px;
  background: linear-gradient(90deg, var(--wcab-primary), var(--wcab-accent));
}

.wcab-staff-login .wcab-dashboard-head {
  border-bottom: none;
  padding-bottom: 6px;
  margin-bottom: 6px;
}

.wcab-staff-login h3 {
  font-size: 22px;
  font-weight: 800;
}

.wcab-login-form label {
  display: block;
  font-weight: 700;
  font-size: 13px;
  color: #364058;
  margin: 14px 0 7px;
}

.wcab-login-form input {
  width: 100%;
  padding: 13px 14px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  background: var(--wcab-surface);
  font-size: 15px;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wcab-login-form input:focus {
  outline: none;
  border-color: var(--wcab-primary);
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.12);
}

/* ---------- Password show/hide ---------- */
.wcab-password-field {
  display: flex;
  align-items: stretch;
  gap: 8px;
}

.wcab-password-field input {
  flex: 1 1 auto;
}

.wcab-password-toggle {
  min-width: 46px;
  cursor: pointer;
  border-radius: var(--wcab-radius-sm);
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-surface-soft);
  transition: background 0.15s ease;
}

.wcab-password-toggle:hover {
  background: var(--wcab-primary-light);
}

.wcab-admin-password-field input.regular-text,
.wcab-list-password-field input.regular-text {
  max-width: 11ch;
  width: 11ch;
  min-width: 11ch;
}

.wcab-list-password-field {
  min-width: 0;
  width: fit-content;
}

/* ---------- Frontend staff update action form ---------- */
.wcab-inline-action-form {
  min-width: 260px;
  display: grid;
  gap: 8px;
}

.wcab-inline-action-form select,
.wcab-inline-action-form textarea,
.wcab-inline-action-form input {
  width: 100%;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  padding: 9px 10px;
  box-sizing: border-box;
  background: var(--wcab-surface);
  font-size: 14px;
  transition: border-color 0.15s ease;
}

.wcab-inline-action-form select:focus,
.wcab-inline-action-form textarea:focus,
.wcab-inline-action-form input:focus {
  outline: none;
  border-color: var(--wcab-primary);
}

.wcab-inline-action-form textarea {
  min-height: 58px;
  resize: vertical;
}

.wcab-zoom-field-group {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  padding: 0 10px;
  box-sizing: border-box;
  background: linear-gradient(135deg, #ffffff, #f8fafc);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wcab-zoom-field-group:focus-within {
  border-color: var(--wcab-primary);
  box-shadow: 0 0 0 4px rgba(79, 70, 229, 0.12);
}

.wcab-zoom-field-group input {
  border: 0;
  box-shadow: none;
  padding-left: 0;
  padding-right: 0;
  background: transparent;
}

.wcab-zoom-field-group input:focus {
  border-color: transparent;
  box-shadow: none;
}

.wcab-inline-help {
  display: block;
  margin-top: -2px;
  color: var(--wcab-muted);
  font-size: 12px;
  line-height: 1.35;
}

.wcab-inline-date-time {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
}

@media (max-width: 650px) {
  .wcab-inline-date-time { grid-template-columns: 1fr; }
}

.wcab-inline-label {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--wcab-muted);
  margin: 6px 0 2px;
  display: block;
}

.wcab-delete-booking-form {
  margin-top: 8px;
}

.wcab-delete-booking-form .wcab-clear-btn {
  width: 100%;
  cursor: pointer;
}

/* ---------- Header actions + Check Booking Status toggle ---------- */
.wcab-header-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}

.wcab-lookup-toggle-btn {
  background: none;
  border: none;
  color: var(--wcab-primary);
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  text-decoration: underline;
  padding: 0;
}

.wcab-lookup-panel {
  background: var(--wcab-surface-soft);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 20px;
  margin-bottom: 22px;
}

.wcab-lookup-panel h3 {
  margin-top: 0;
}

.wcab-lookup-hint {
  color: var(--wcab-muted);
  font-size: 13px;
  margin-bottom: 14px;
}

.wcab-lookup-form-row {
  display: grid;
  grid-template-columns: 1.2fr 1fr auto;
  gap: 10px;
}

@media (max-width: 700px) {
  .wcab-lookup-form-row { grid-template-columns: 1fr; }
}

.wcab-lookup-form-row input {
  padding: 11px 13px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  font-size: 14px;
}

.wcab-lookup-result {
  margin-top: 16px;
}

.wcab-lookup-card {
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  padding: 16px;
}

.wcab-lookup-status-row {
  margin-bottom: 12px;
}

.wcab-lookup-reason {
  font-size: 13px;
  color: var(--wcab-ink);
  margin: 10px 0 0;
}

/* ---------- Sortable table headers ---------- */
.wcab-sort-link {
  color: inherit;
  text-decoration: none;
  font-weight: 700;
  white-space: nowrap;
}

.wcab-sort-link:hover {
  color: var(--wcab-primary);
}

/* ---------- Logged-in staff identity header ---------- */
.wcab-dashboard-head-identity {
  display: flex;
  align-items: center;
  gap: 14px;
}

.wcab-current-staff-avatar {
  width: 54px;
  height: 54px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--wcab-primary), #6d5bf7);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 800;
  font-size: 18px;
}

.wcab-current-staff-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ---------- One-page mini calendar (staff dashboard) ---------- */
.wcab-mini-calendar-wrap {
  background: var(--wcab-surface);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 16px;
  margin-bottom: 20px;
}

.wcab-cal-day-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin: 2px auto;
  border-radius: 50%;
  background: var(--wcab-cal-badge-bg, #4f46e5);
  color: var(--wcab-cal-badge-text, #ffffff);
  font-size: 12px;
  font-weight: 900;
  cursor: pointer;
  transition: transform 0.15s ease;
}

.wcab-cal-day-badge:hover {
  transform: scale(1.1);
}

/* ---------- Google Calendar quick-add link on approved rows ---------- */
.wcab-gcal-link {
  display: inline-block;
  margin-top: 4px;
  font-size: 11px;
  font-weight: 700;
  color: #1a73e8;
  text-decoration: none;
}

.wcab-gcal-link:hover {
  text-decoration: underline;
}

/* ---------- Live service duration/price info ---------- */
.wcab-service-info {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin: 8px 0 16px;
  font-size: 13px;
  font-weight: 700;
}

.wcab-service-info-duration {
  color: var(--wcab-muted);
}

.wcab-service-info-price {
  color: var(--wcab-primary-dark);
  background: var(--wcab-primary-light);
  padding: 3px 10px;
  border-radius: 999px;
}

.wcab-service-info-price.wcab-service-info-free {
  color: #067647;
  background: #ecfdf5;
}

.wcab-free-badge {
  color: #067647;
  background: #ecfdf5;
  padding: 2px 8px;
  border-radius: 999px;
  font-weight: 800;
  font-size: 12px;
}

/* ---------- Booking v1.6.1: combined date/slot step + live summary ---------- */
:root {
  --wcab-cal-today-text: #ffffff;
}

.wcab-booking-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 22px;
  align-items: start;
}

.wcab-booking-main {
  min-width: 0;
}

.wcab-selection-summary {
  position: sticky;
  top: 24px;
}

.wcab-summary-card {
  background: linear-gradient(180deg, #ffffff 0%, #f8f9ff 100%);
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 18px;
  box-shadow: var(--wcab-shadow-md);
}

.wcab-summary-kicker {
  display: inline-block;
  font-size: 11px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 800;
  color: var(--wcab-primary);
  margin-bottom: 6px;
}

.wcab-summary-card h3 {
  margin: 0 0 14px;
  font-size: 18px;
  color: var(--wcab-heading-color);
}

.wcab-summary-list {
  display: grid;
  gap: 10px;
}

.wcab-summary-list div {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--wcab-surface);
  border: 1px solid rgba(230, 233, 244, 0.8);
}

.wcab-summary-list span {
  font-size: 11px;
  color: var(--wcab-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 800;
}

.wcab-summary-list strong {
  font-size: 14px;
  color: var(--wcab-ink);
  word-break: break-word;
}

.wcab-calendar-slot-grid {
  display: grid;
  grid-template-columns: minmax(280px, 1.05fr) minmax(260px, 0.95fr);
  gap: 18px;
  align-items: start;
}

.wcab-calendar-area,
.wcab-slot-area,
.wcab-payment-card {
  background: #fff;
  border: 1px solid var(--wcab-border);
  border-radius: var(--wcab-radius-md);
  padding: 16px;
  box-shadow: var(--wcab-shadow-sm);
}

.wcab-working-info-box {
  margin-bottom: 18px;
}

.wcab-calendar .fc-col-header,
.wcab-calendar .fc-scrollgrid-sync-table,
.wcab-calendar .fc-daygrid-body,
.wcab-calendar .fc-daygrid-body table {
  width: 100% !important;
}

.wcab-calendar .fc-col-header {
  display: table !important;
  table-layout: fixed !important;
}

.wcab-calendar .fc-col-header-cell-cushion {
  display: block;
  min-height: 18px;
}

.wcab-calendar .fc-day-today .fc-daygrid-day-number,
.wcab-calendar .wcab-fc-today .fc-daygrid-day-number {
  background: var(--wcab-cal-today) !important;
  color: var(--wcab-cal-today-text) !important;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.18);
}

.wcab-location-icon img {
  width: 19px;
  height: 19px;
  display: block;
}

.wcab-location-option {
  position: relative;
}

.wcab-location-radio-dot {
  width: 18px;
  height: 18px;
  border: 2px solid var(--wcab-border);
  border-radius: 50%;
  flex: 0 0 auto;
  margin-top: 2px;
  box-shadow: inset 0 0 0 4px #fff;
}

.wcab-location-option .wcab-location-radio {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.wcab-location-option.wcab-location-selected .wcab-location-radio-dot,
.wcab-location-option:has(.wcab-location-radio:checked) .wcab-location-radio-dot {
  border-color: var(--wcab-primary);
  background: var(--wcab-primary);
}

.wcab-payment-service-summary {
  display: grid;
  gap: 8px;
  margin-bottom: 16px;
}

.wcab-payment-total-row {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 12px;
  border: 1px solid var(--wcab-border);
  border-radius: 12px;
  background: var(--wcab-surface-soft);
  font-size: 14px;
}

.wcab-payment-total-row span {
  color: var(--wcab-muted);
  font-weight: 700;
}

.wcab-payment-total-row strong {
  color: var(--wcab-ink);
  text-align: right;
}

.wcab-payment-discount strong {
  color: var(--wcab-success-fg);
}

.wcab-payment-final {
  background: var(--wcab-primary-light);
  border-color: rgba(79, 70, 229, 0.22);
}

.wcab-payment-final strong {
  color: var(--wcab-primary-dark);
  font-size: 16px;
}

.wcab-coupon-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
  align-items: center;
}

.wcab-coupon-message {
  margin: 10px 0 14px;
}

.wcab-payment-methods {
  display: grid;
  gap: 10px;
  margin-top: 8px;
}

.wcab-payment-method {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 13px 14px;
  border: 1.5px solid var(--wcab-border);
  border-radius: var(--wcab-radius-sm);
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}

.wcab-payment-method:hover {
  border-color: var(--wcab-primary);
  background: var(--wcab-surface-soft);
  transform: translateY(-1px);
}

.wcab-payment-method input {
  width: auto;
  margin-top: 3px;
  accent-color: var(--wcab-primary);
}

.wcab-payment-method span {
  display: grid;
  gap: 2px;
}

.wcab-payment-method strong {
  color: var(--wcab-ink);
  font-size: 14px;
}

.wcab-payment-method small {
  color: var(--wcab-muted);
  font-size: 12px;
}

.wcab-payment-note,
.wcab-free-payment-box {
  margin-top: 14px;
  padding: 13px 14px;
  border-radius: var(--wcab-radius-sm);
  border: 1px solid #d9defd;
  background: var(--wcab-primary-light);
  color: var(--wcab-primary-dark);
  font-size: 14px;
  line-height: 1.55;
}

.wcab-free-payment-box {
  border-color: rgba(6, 118, 71, 0.18);
  background: var(--wcab-success-bg);
  color: var(--wcab-success-fg);
  font-weight: 800;
}

.wcab-login-form .wcab-submit {
  display: block;
  margin: 26px auto 0;
  min-width: 220px;
  text-align: center;
}

@media (max-width: 980px) {
  .wcab-booking-layout,
  .wcab-calendar-slot-grid {
    grid-template-columns: 1fr;
  }
  .wcab-selection-summary {
    position: static;
  }
}

@media (max-width: 560px) {
  .wcab-coupon-row {
    grid-template-columns: 1fr;
  }
  .wcab-wizard-step-dot label {
    font-size: 10px;
  }
}

/* ---------- Booking v1.6.2: compact location, Calendly-style summary, admin previews ---------- */
.wcab-location-compact {
  gap: 12px;
  margin-top: 8px;
}

.wcab-location-compact .wcab-location-option,
.wcab-location-compact .wcab-location-option-custom-row {
  display: flex;
  align-items: center;
  gap: 12px;
}

.wcab-location-compact .wcab-location-option {
  border: 0 !important;
  background: transparent !important;
  padding: 0;
  box-shadow: none;
  border-radius: 0;
}

.wcab-location-compact .wcab-location-option:hover,
.wcab-location-compact .wcab-location-option.wcab-location-selected,
.wcab-location-compact .wcab-location-option:has(.wcab-location-radio:checked) {
  background: transparent !important;
  border-color: transparent !important;
}

.wcab-location-compact .wcab-location-content {
  display: block;
  min-width: 0;
}

.wcab-location-compact .wcab-location-label {
  color: var(--wcab-ink);
  font-size: 15px;
  font-weight: 500;
  line-height: 1.35;
}

.wcab-location-compact .wcab-location-icon {
  width: 28px;
  height: 28px;
  margin: 0;
}

.wcab-location-compact .wcab-location-icon-zoom {
  border-radius: 50%;
  background: #5b8df8;
}

.wcab-location-compact .wcab-location-icon-custom {
  border-radius: 6px;
  background: #0b3a77;
  color: #fff;
  font-size: 17px;
  font-weight: 800;
}

.wcab-location-compact .wcab-location-radio-dot {
  width: 22px;
  height: 22px;
  border: 1.5px solid #c8dcfb;
  border-radius: 999px;
  margin: 0;
  background: #fff;
  box-shadow: none;
  position: relative;
}

.wcab-location-compact .wcab-location-radio-dot::after {
  content: "";
  position: absolute;
  inset: 5px;
  border-radius: inherit;
  background: var(--wcab-primary);
  transform: scale(0);
  transition: transform 0.15s ease;
}

.wcab-location-compact .wcab-location-option.wcab-location-selected .wcab-location-radio-dot,
.wcab-location-compact .wcab-location-option:has(.wcab-location-radio:checked) .wcab-location-radio-dot {
  border-color: #b9d5ff;
  background: #fff;
  box-shadow: none;
}

.wcab-location-compact .wcab-location-option.wcab-location-selected .wcab-location-radio-dot::after,
.wcab-location-compact .wcab-location-option:has(.wcab-location-radio:checked) .wcab-location-radio-dot::after {
  transform: scale(1);
}

.wcab-location-compact .wcab-location-option-custom {
  gap: 10px;
}

.wcab-location-compact .wcab-location-custom-input {
  width: min(100%, 340px);
  margin-left: 74px;
  min-height: 50px;
  border: 1.5px solid #9db7df;
  border-radius: 9px;
  padding: 0 16px;
  font-size: 15px;
  color: var(--wcab-ink);
  background: #fff;
  box-shadow: none;
}

.wcab-rich-summary-card {
  background: #fff;
  border: 0;
  box-shadow: none;
  padding: 0 4px;
}

.wcab-summary-profile {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 16px;
  align-items: end;
  margin-bottom: 10px;
}

.wcab-summary-avatar {
  width: 72px;
  height: 72px;
  border-radius: 50%;
  overflow: hidden;
  background: linear-gradient(135deg, var(--wcab-primary), var(--wcab-accent));
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 900;
  font-size: 20px;
}

.wcab-summary-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.wcab-rich-summary-card .wcab-summary-kicker {
  margin: 0 0 4px;
  letter-spacing: normal;
  text-transform: none;
  color: #727272;
  font-size: 16px;
  font-weight: 800;
}

.wcab-rich-summary-card [data-summary="employee"] {
  display: block;
  color: #727272;
  font-size: 15px;
  font-weight: 800;
  text-transform: none;
  letter-spacing: 0;
}

.wcab-rich-summary-card h3 {
  margin: 12px 0 24px;
  color: #092343;
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.1;
  letter-spacing: -0.03em;
  font-weight: 900;
}

.wcab-rich-summary-list {
  display: grid;
  gap: 18px;
}

.wcab-rich-summary-item {
  display: grid;
  grid-template-columns: 26px 1fr;
  gap: 8px;
  align-items: start;
  color: #092343;
  font-size: 15px;
  line-height: 1.35;
}

.wcab-rich-summary-item strong {
  color: #092343;
  font-size: 15px;
  font-weight: 900;
}

.wcab-rich-icon {
  width: 28px;
  height: 28px;
  border: 1.5px solid rgba(9, 35, 67, 0.16);
  color: #092343;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, #ffffff 0%, #f4f8ff 100%);
  box-shadow: 0 8px 20px rgba(9, 35, 67, 0.08);
  line-height: 1;
}

.wcab-rich-icon svg {
  width: 17px;
  height: 17px;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.wcab-rich-icon-calendar,
.wcab-rich-icon-payment {
  border-radius: 8px;
}

.wcab-step3-legal-notice {
  margin: 18px 0 0;
}

.wcab-settings-live-preview {
  --wcab-primary: #4f46e5;
  --wcab-primary-dark: #3730a3;
  --wcab-button-text: #ffffff;
  --wcab-heading-color: #10162f;
  --wcab-heading-weight: 800;
  --wcab-cal-available: #eef0f3;
  --wcab-cal-available-text: #334155;
  --wcab-cal-selected: #12b886;
  --wcab-cal-today: #4f46e5;
  --wcab-cal-today-text: #ffffff;
  --wcab-slot-available: #4ade80;
  --wcab-slot-selected: #f5a623;
  --wcab-slot-booked: #f15757;
  --wcab-slot-lunch: #9aa2b1;
  --wcab-btn-primary-border-color: transparent;
  --wcab-btn-primary-border-width: 0px;
  --wcab-btn-primary-radius: 10px;
  --wcab-btn-primary-pad-y: 12px;
  --wcab-btn-primary-pad-x: 26px;
  --wcab-btn-primary-shadow-color: rgba(79, 70, 229, 0.25);
  --wcab-btn-primary-shadow-x: 0px;
  --wcab-btn-primary-shadow-y: 8px;
  --wcab-btn-primary-shadow-blur: 18px;
  --wcab-btn-primary-hover-shadow-color: rgba(79, 70, 229, 0.35);
  --wcab-btn-primary-hover-shadow-y: 16px;
  --wcab-btn-primary-hover-shadow-blur: 30px;
  --wcab-btn-secondary-bg: #f7f8fd;
  --wcab-btn-secondary-hover-bg: #eef0ff;
  --wcab-btn-secondary-text: #10162f;
  --wcab-btn-secondary-border-color: #e6e9f4;
  --wcab-btn-secondary-border-width: 1.5px;
  --wcab-btn-secondary-radius: 10px;
  --wcab-btn-secondary-pad-y: 12px;
  --wcab-btn-secondary-pad-x: 18px;
  --wcab-btn-secondary-shadow-color: transparent;
  --wcab-btn-secondary-shadow-x: 0px;
  --wcab-btn-secondary-shadow-y: 0px;
  --wcab-btn-secondary-shadow-blur: 0px;
  --wcab-btn-whatsapp-bg-start: #25d366;
  --wcab-btn-whatsapp-bg-end: #12b76a;
  --wcab-btn-whatsapp-text: #ffffff;
  --wcab-btn-whatsapp-border-color: transparent;
  --wcab-btn-whatsapp-border-width: 0px;
  --wcab-btn-whatsapp-radius: 10px;
  --wcab-btn-whatsapp-pad-y: 11px;
  --wcab-btn-whatsapp-pad-x: 16px;
  --wcab-btn-whatsapp-shadow-color: rgba(18, 183, 106, 0.3);
  --wcab-btn-whatsapp-shadow-x: 0px;
  --wcab-btn-whatsapp-shadow-y: 10px;
  --wcab-btn-whatsapp-shadow-blur: 20px;
  --wcab-btn-print-bg: #f7f8fd;
  --wcab-btn-print-hover-bg: #eef0ff;
  --wcab-btn-print-text: #10162f;
  --wcab-btn-print-border-color: #e6e9f4;
  --wcab-btn-print-hover-border-color: #4f46e5;
  --wcab-btn-print-border-width: 1.5px;
  --wcab-btn-print-radius: 10px;
  --wcab-btn-print-pad-y: 11px;
  --wcab-btn-print-pad-x: 16px;
  --wcab-body-font-size: 14px;
  max-width: 720px;
}

.wcab-preview-shell {
  background: linear-gradient(180deg, #fff 0%, #f8f9ff 100%);
  border: 1px solid var(--wcab-border);
  border-radius: 18px;
  padding: 22px;
  box-shadow: var(--wcab-shadow-md);
}

.wcab-preview-shell h3 {
  color: var(--wcab-heading-color);
  font-weight: var(--wcab-heading-weight);
  margin: 6px 0 8px;
  font-size: 25px;
}

.wcab-preview-kicker {
  color: var(--wcab-primary);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 900;
}

.wcab-preview-muted {
  color: var(--wcab-muted);
  margin: 0 0 16px;
}

.wcab-preview-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 16px;
}

.wcab-preview-button {
  border: 0;
  border-radius: 10px;
  padding: 12px 22px;
  background: linear-gradient(135deg, var(--wcab-primary), var(--wcab-primary-dark));
  color: var(--wcab-button-text);
  font-weight: 900;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.wcab-preview-button:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 24px rgba(79, 70, 229, 0.26);
}

.wcab-preview-button-secondary {
  background: #fff;
  color: var(--wcab-primary);
  border: 1px solid var(--wcab-primary);
}

.wcab-preview-calendar {
  display: inline-grid;
  grid-template-columns: repeat(7, 38px);
  gap: 8px;
  align-items: center;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--wcab-border);
  border-radius: 16px;
}

.wcab-preview-calendar span {
  text-align: center;
  font-size: 11px;
  color: var(--wcab-muted);
  font-weight: 800;
}

.wcab-preview-day {
  width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--wcab-cal-available);
  color: var(--wcab-cal-available-text);
  font-weight: 900;
}

.wcab-preview-day-today {
  background: var(--wcab-cal-today);
  color: var(--wcab-cal-today-text);
}

.wcab-preview-day-selected {
  background: var(--wcab-cal-selected);
  color: #fff;
}

.wcab-preview-slots {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

.wcab-preview-slot {
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 900;
  background: #fff;
  border: 1.5px solid currentColor;
}

.wcab-preview-slot-available { color: var(--wcab-slot-available); }
.wcab-preview-slot-selected { background: var(--wcab-slot-selected); border-color: var(--wcab-slot-selected); color: #fff; }
.wcab-preview-slot-booked { color: var(--wcab-slot-booked); background: color-mix(in srgb, var(--wcab-slot-booked) 14%, #fff); }
.wcab-preview-slot-lunch { color: var(--wcab-slot-lunch); background: color-mix(in srgb, var(--wcab-slot-lunch) 16%, #fff); }

@media (max-width: 560px) {
  .wcab-location-compact .wcab-location-custom-input {
    margin-left: 0;
    width: 100%;
  }
  .wcab-summary-profile {
    grid-template-columns: 56px 1fr;
  }
  .wcab-summary-avatar {
    width: 56px;
    height: 56px;
  }
}

/* ---------- Booking v1.6.3 updates: progressive summary + modal WhatsApp + calendar counts ---------- */
.wcab-modal-actions > .wcab-whatsapp,
.wcab-modal-actions > .wcab-modal-whatsapp-btn {
  width: 100%;
  text-align: center;
  box-sizing: border-box;
  margin-top: 0;
}

.wcab-rich-summary-card[data-summary-card] {
  min-height: 0;
}

.wcab-mini-calendar .fc-daygrid-event {
  border: 0 !important;
  background: transparent !important;
}

/* Item 1: day appointments popup, grouped by staff member */
.wcab-day-appts-modal {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(16, 22, 47, 0.5);
  z-index: 100000;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.wcab-day-appts-modal-inner {
  background: #fff;
  border-radius: var(--wcab-radius-md);
  max-width: 560px;
  width: 100%;
  max-height: 80vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: var(--wcab-shadow-lg);
}

.wcab-day-appts-modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 22px;
  border-bottom: 1px solid var(--wcab-border);
}

.wcab-day-appts-modal-head h3 {
  margin: 0;
  font-size: 18px;
  color: var(--wcab-heading-color);
}

.wcab-day-appts-modal-close {
  background: none;
  border: none;
  font-size: 26px;
  line-height: 1;
  cursor: pointer;
  color: var(--wcab-muted);
}

.wcab-day-appts-modal-body {
  padding: 18px 22px 22px;
  overflow-y: auto;
}

.wcab-day-appts-staff-group + .wcab-day-appts-staff-group {
  margin-top: 18px;
}

.wcab-day-appts-staff-group h4 {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 900;
  color: var(--wcab-primary-dark);
  padding-bottom: 6px;
  border-bottom: 2px solid var(--wcab-primary-light);
}

.wcab-day-appts-staff-group ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.wcab-day-appts-staff-group li {
  padding: 8px 0;
  border-bottom: 1px dashed var(--wcab-border);
  font-size: 13.5px;
  color: var(--wcab-ink);
}

.wcab-day-appts-staff-group li:last-child {
  border-bottom: none;
}

/* ---------- Item 5/1: unread-messages notification bell ---------- */
.wcab-notify-bell {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: calc(var(--wcab-notify-icon-size, 22px) + 22px);
  height: calc(var(--wcab-notify-icon-size, 22px) + 22px);
  border-radius: 50%;
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-notify-bg, var(--wcab-surface));
  color: var(--wcab-notify-icon-color, #4f46e5);
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.wcab-notify-bell:hover {
  background: var(--wcab-notify-hover-bg, #fef2f2);
  border-color: var(--wcab-notify-hover-border, #fca5a5);
  color: var(--wcab-notify-hover-color, #ef4444);
}

.wcab-notify-bell svg {
  width: var(--wcab-notify-icon-size, 22px);
  height: var(--wcab-notify-icon-size, 22px);
  flex-shrink: 0;
}

.wcab-notify-bell.wcab-notify-active {
  background: var(--wcab-notify-hover-bg, #fef2f2);
  border-color: var(--wcab-notify-hover-border, #fca5a5);
  color: var(--wcab-notify-hover-color, #ef4444);
}

.wcab-notify-bell.wcab-notify-pulse svg {
  animation: wcabBellRing 0.6s ease;
}

@keyframes wcabBellRing {
  0%, 100% { transform: rotate(0); }
  20% { transform: rotate(-14deg); }
  40% { transform: rotate(12deg); }
  60% { transform: rotate(-8deg); }
  80% { transform: rotate(6deg); }
}

.wcab-notify-count {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 999px;
  background: var(--wcab-notify-badge-bg, #ef4444);
  color: var(--wcab-notify-badge-text, #ffffff);
  font-size: 11px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

/* ---------- Item 6: unread appointment row/dot styling ---------- */
.wcab-row-unread td:nth-child(2) {
  font-weight: 800;
}

.wcab-unread-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--wcab-notify-badge-bg, #ef4444);
  margin-right: 4px;
}

/* ---------- Item 8: bulk selection, star, labels ---------- */
.wcab-select-col {
  width: 34px;
  text-align: center;
}

.wcab-star-btn {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 15px;
  color: #d4d7e3;
  padding: 0 4px 0 0;
  vertical-align: middle;
}

.wcab-star-btn.wcab-starred {
  color: #f5a623;
}

.wcab-label-chips {
  margin-top: 4px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}

.wcab-label-chip {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10.5px;
  font-weight: 800;
  color: #fff;
  background: var(--chip-color, #4f46e5);
}

.wcab-label-add-btn {
  background: none;
  border: 1px dashed var(--wcab-border);
  border-radius: 999px;
  font-size: 10.5px;
  padding: 1px 8px;
  cursor: pointer;
  color: var(--wcab-muted);
}

.wcab-label-picker {
  position: absolute;
  z-index: 500;
  background: #fff;
  border: 1px solid var(--wcab-border);
  border-radius: 10px;
  box-shadow: var(--wcab-shadow-md);
  padding: 6px;
  display: none;
}

.wcab-label-picker.wcab-open {
  display: block;
}

.wcab-label-picker button {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 700;
}

.wcab-label-picker button:hover {
  background: var(--wcab-surface-soft);
  color: var(--wcab-ink) !important;
}

.wcab-label-picker button::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--chip-color, #4f46e5);
  margin-right: 8px;
}

.wcab-bulk-toolbar {
  display: flex;
  align-items: center;
  gap: 10px;
  background: var(--wcab-primary-light);
  border: 1px solid var(--wcab-primary);
  border-radius: var(--wcab-radius-sm);
  padding: 10px 14px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}

.wcab-bulk-count {
  font-weight: 800;
  color: var(--wcab-primary-dark);
  margin-right: 6px;
}

.wcab-bulk-btn {
  background: #fff;
  border: 1.5px solid var(--wcab-border);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
}

.wcab-bulk-btn:hover {
  border-color: var(--wcab-primary);
}

.wcab-bulk-btn-danger {
  color: #b42318;
  border-color: #fecaca;
}

.wcab-bulk-label-wrap {
  position: relative;
}

.wcab-bulk-label-menu {
  display: none;
  position: absolute;
  top: 110%;
  left: 0;
  background: #fff;
  border: 1px solid var(--wcab-border);
  border-radius: 10px;
  box-shadow: var(--wcab-shadow-md);
  padding: 6px;
  min-width: 160px;
  z-index: 500;
}

.wcab-bulk-label-menu.wcab-open {
  display: block;
}

.wcab-bulk-label-option {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 6px 10px;
  border-radius: 6px;
  cursor: pointer;
  font-size: 12.5px;
  font-weight: 700;
}

.wcab-bulk-label-option:hover {
  background: var(--wcab-surface-soft);
  color: var(--wcab-ink) !important;
}

.wcab-bulk-label-option::before {
  content: "";
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--chip-color, #4f46e5);
  margin-right: 8px;
}

/* ---------- Item 1/9: staff filter dropdown — same box styling as the
   other filter fields (e.g. Label), full width of its field, with photo +
   name + designation rows in the menu (matching the booking-page employee
   picker) and a scrollbar once there are many staff. ---------- */
.wcab-staff-filter-field {
  position: relative;
}

.wcab-staff-filter-dropdown {
  position: relative;
}

.wcab-staff-filter-toggle {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  box-sizing: border-box;
  min-height: 44px;
  background: var(--wcab-surface);
  border: 1.5px solid var(--wcab-border);
  border-radius: 12px;
  padding: 8px 14px;
  font-weight: 400;
  font-size: 14px;
  color: var(--wcab-ink);
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wcab-staff-filter-toggle:hover,
.wcab-staff-filter-dropdown.wcab-open .wcab-staff-filter-toggle {
  border-color: var(--wcab-staff-btn);
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.12);
}

.wcab-staff-filter-toggle-label {
  flex: 1;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wcab-staff-filter-toggle-arrow {
  color: var(--wcab-muted);
  flex-shrink: 0;
  transition: transform 0.15s ease;
}

.wcab-staff-filter-dropdown.wcab-open .wcab-staff-filter-toggle-arrow {
  transform: rotate(180deg);
}

.wcab-staff-filter-avatar {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--wcab-primary-light);
  color: var(--wcab-primary-dark);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 800;
  flex-shrink: 0;
  overflow: hidden;
}

.wcab-staff-filter-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.wcab-staff-filter-menu {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border: 1px solid var(--wcab-border);
  border-radius: 10px;
  box-shadow: var(--wcab-shadow-md);
  padding: 6px;
  width: 100%;
  min-width: 240px;
  max-height: 280px;
  overflow-y: auto;
  z-index: 500;
}

.wcab-staff-filter-menu.wcab-open {
  display: block;
}

.wcab-staff-filter-option {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 8px;
  border-radius: 8px;
  cursor: pointer;
  color: var(--wcab-ink);
}

.wcab-staff-filter-option .wcab-staff-filter-avatar {
  width: 38px;
  height: 38px;
  font-size: 13px;
}

.wcab-staff-filter-option-meta {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.wcab-staff-filter-option-name {
  font-weight: 700;
  font-size: 13.5px;
  color: var(--wcab-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wcab-staff-filter-option-designation {
  font-size: 12px;
  color: var(--wcab-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wcab-staff-filter-option:hover {
  background: var(--wcab-surface-soft);
}

.wcab-dashboard-powered-by {
  text-align: center;
  margin-top: 22px;
  padding-top: 14px;
  border-top: 1px solid var(--wcab-border);
  font-size: 12px;
}

.wcab-dashboard-powered-by a {
  color: var(--wcab-muted);
  text-decoration: none;
}

.wcab-dashboard-powered-by a:hover {
  color: var(--wcab-primary);
  text-decoration: underline;
}

.wcab-label-repeater-row {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}


/* ---------- Booking v1.6.4: first/last name, alternate phone, modern icons ---------- */
.wcab-name-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  align-items: start;
}

.wcab-name-grid .wcab-field label {
  margin-top: 14px;
}

.wcab-location-compact .wcab-location-option-custom {
  align-items: flex-start;
  width: 100%;
}

.wcab-location-compact .wcab-location-option-custom-row {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
}

.wcab-location-compact .wcab-location-icon-custom {
  width: 32px;
  height: 32px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.wcab-location-compact .wcab-location-icon-custom img {
  width: 32px;
  height: 32px;
  display: block;
}

@media (max-width: 650px) {
  .wcab-name-grid {
    grid-template-columns: 1fr;
    gap: 0;
  }
}

/* ---------- v1.6.5: staff dashboard compact actions + resizable columns ---------- */
.wcab-login-form {
  display: grid;
  gap: 14px;
}

.wcab-login-form .wcab-submit {
  margin-top: 10px;
}

.wcab-powered-by {
  margin: 8px 0 0;
  text-align: center;
  font-size: 12px;
  color: var(--wcab-muted);
}

.wcab-powered-by a {
  color: var(--wcab-primary);
  font-weight: 800;
  text-decoration: none;
}

.wcab-powered-by a:hover {
  text-decoration: underline;
}

.wcab-table.wcab-resizable-table {
  table-layout: fixed;
}

.wcab-table.wcab-resizable-table td {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

.wcab-table.wcab-resizable-table th,
.wcab-table.wcab-resizable-table th a,
.wcab-table.wcab-resizable-table .wcab-sort-link {
  white-space: normal;
  text-wrap: wrap;
  overflow-wrap: normal;
  word-break: keep-all;
  line-height: 1.3;
}

.wcab-table.wcab-resizable-table th {
  position: relative;
  min-width: 96px;
  vertical-align: middle;
}

.wcab-table.wcab-resizable-table .wcab-sort-link {
  display: inline-flex;
  align-items: flex-start;
  justify-content: center;
  text-align: center;
  max-width: 100%;
  min-width: 0;
  gap: 4px;
}

.wcab-table.wcab-resizable-table th .wcab-col-resizer {
  position: absolute;
  top: 0;
  right: -4px;
  width: 8px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  z-index: 3;
}

.wcab-table.wcab-resizable-table th .wcab-col-resizer::after {
  content: "";
  position: absolute;
  top: 25%;
  bottom: 25%;
  left: 3px;
  width: 2px;
  border-radius: 99px;
  background: transparent;
  transition: background 0.15s ease;
}

.wcab-table.wcab-resizable-table th:hover .wcab-col-resizer::after,
body.wcab-resizing-columns .wcab-col-resizer::after {
  background: rgba(79, 70, 229, 0.35);
}

body.wcab-resizing-columns {
  cursor: col-resize;
  user-select: none;
}

.wcab-table td.wcab-action-cell,
.wcab-table th:last-child {
  min-width: 118px;
  width: 118px;
  text-align: center;
}

.wcab-action-icons {
  display: inline-flex;
  gap: 10px;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
}

.wcab-action-icon-btn {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: 0;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  transition: transform 0.15s ease, box-shadow 0.15s ease, filter 0.15s ease;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

.wcab-action-open-btn {
  background: var(--wcab-action-open-bg, #00c27a);
  color: var(--wcab-action-open-icon, #ffffff);
}

.wcab-action-share-btn {
  background: #2ea8ef;
}

.wcab-action-icon-btn:hover,
.wcab-action-icon-btn:focus-visible {
  outline: none;
}

.wcab-action-open-btn:hover,
.wcab-action-open-btn:focus-visible {
  background: var(--wcab-action-open-hover-bg, var(--wcab-action-open-bg, #00c27a));
  color: var(--wcab-action-open-hover-icon, var(--wcab-action-open-icon, #ffffff));
}

.wcab-action-share-btn:hover,
.wcab-action-share-btn:focus-visible {
  box-shadow: 0 10px 20px rgba(46, 168, 239, 0.35);
  filter: brightness(1.05);
  transform: translateY(-2px);
}

/* Action button hover effects: which rule applies is chosen from
   Settings > Appearance > Action Column Button > Hover Effect. */
.wcab-action-open-btn[data-hover-effect="none"]:hover,
.wcab-action-open-btn[data-hover-effect="none"]:focus-visible {
  transform: none;
  box-shadow: none;
  filter: none;
}

.wcab-action-open-btn[data-hover-effect="lift"]:hover,
.wcab-action-open-btn[data-hover-effect="lift"]:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px var(--wcab-action-open-hover-glow, rgba(0, 194, 122, 0.35));
}

.wcab-action-open-btn[data-hover-effect="grow"]:hover,
.wcab-action-open-btn[data-hover-effect="grow"]:focus-visible {
  transform: scale(1.14);
  box-shadow: none;
}

.wcab-action-open-btn[data-hover-effect="glow"]:hover,
.wcab-action-open-btn[data-hover-effect="glow"]:focus-visible {
  transform: none;
  box-shadow: 0 0 0 6px var(--wcab-action-open-hover-glow, rgba(0, 194, 122, 0.35));
}

.wcab-action-open-btn[data-hover-effect="pulse"]:hover,
.wcab-action-open-btn[data-hover-effect="pulse"]:focus-visible {
  animation: wcabActionPulse 0.9s ease-in-out infinite;
  box-shadow: 0 10px 20px var(--wcab-action-open-hover-glow, rgba(0, 194, 122, 0.35));
}

@keyframes wcabActionPulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.12); }
}

.wcab-action-icon-btn:active {
  transform: translateY(0) scale(0.96);
}

.wcab-action-icon-btn:not(:hover):not(:focus-visible) {
  box-shadow: none;
  filter: none;
}

.wcab-action-icon-btn svg {
  width: var(--wcab-action-icon-size, 28px);
  height: var(--wcab-action-icon-size, 28px);
  pointer-events: none;
}

.wcab-action-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.wcab-action-modal.wcab-open {
  display: flex;
}

.wcab-action-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(3px);
}

.wcab-action-modal-card {
  position: relative;
  z-index: 1;
  width: min(520px, 100%);
  max-height: 90vh;
  overflow-y: auto;
  background: var(--wcab-surface);
  border-radius: 22px;
  border: 1px solid rgba(230, 233, 244, 0.9);
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.28);
  padding: 24px;
  text-align: left;
}

.wcab-action-modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: var(--wcab-surface-soft);
  color: var(--wcab-muted);
  cursor: pointer;
  font-size: 24px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wcab-action-modal-close:hover {
  background: #eef0ff;
  color: var(--wcab-primary);
}

.wcab-action-modal-head {
  display: grid;
  gap: 4px;
  padding-right: 42px;
  margin-bottom: 16px;
}

.wcab-action-modal-head span {
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--wcab-primary);
}

.wcab-action-modal-head strong {
  font-size: 22px;
  color: var(--wcab-ink);
}

.wcab-action-modal-head small {
  color: var(--wcab-muted);
  font-weight: 700;
}

.wcab-action-modal .wcab-inline-action-form {
  min-width: 0;
}

@media (max-width: 650px) {
  .wcab-action-modal { padding: 12px; }
  .wcab-action-modal-card { padding: 20px; border-radius: 18px; }
  .wcab-action-icon-btn { width: 40px; height: 40px; }
  .wcab-action-icon-btn svg { width: min(var(--wcab-action-icon-size, 28px), 24px); height: min(var(--wcab-action-icon-size, 28px), 24px); }
}

/* ---------- Item 13: Booking ID shown in the Appointment Action modal ---------- */
.wcab-action-modal-booking-id {
  color: var(--wcab-staff-btn) !important;
  font-weight: 800 !important;
}

/* ---------- Item 14: reason textarea only shows for Cancelled / Postponed / Rescheduled ---------- */
.wcab-inline-reason-wrap {
  overflow: hidden;
  max-height: 120px;
  transition: max-height 0.2s ease, opacity 0.2s ease, margin 0.2s ease;
  opacity: 1;
}

.wcab-inline-reason-wrap[data-shown="0"] {
  max-height: 0;
  opacity: 0;
  margin: 0;
  pointer-events: none;
}

.wcab-inline-reason-wrap textarea {
  width: 100%;
  box-sizing: border-box;
}

/* ---------- Item 10: Reason / Reschedule History column ---------- */
.wcab-reason-col {
  width: 130px;
  max-width: 130px;
}

.wcab-reason-preview-btn {
  display: inline-block;
  max-width: 100%;
  background: var(--wcab-surface-soft);
  border: 1px solid var(--wcab-border);
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 12.5px;
  color: var(--wcab-ink);
  cursor: pointer;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.wcab-reason-preview-btn:hover,
.wcab-reason-preview-btn:focus-visible {
  border-color: var(--wcab-staff-btn);
  background: var(--wcab-primary-light);
  color: var(--wcab-ink) !important;
  outline: none;
}

.wcab-reason-empty {
  color: var(--wcab-muted);
}

.wcab-reason-modal {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 999999;
  align-items: center;
  justify-content: center;
  padding: 22px;
}

.wcab-reason-modal.wcab-open {
  display: flex;
}

.wcab-reason-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.58);
  backdrop-filter: blur(3px);
}

.wcab-reason-modal-card {
  position: relative;
  z-index: 1;
  width: min(440px, 100%);
  max-height: 80vh;
  overflow-y: auto;
  background: var(--wcab-surface);
  border-radius: 18px;
  border: 1px solid rgba(230, 233, 244, 0.9);
  box-shadow: 0 30px 90px rgba(15, 23, 42, 0.28);
  padding: 24px;
  text-align: left;
}

.wcab-reason-modal-card h4 {
  margin: 0 0 12px;
  padding-right: 34px;
  font-size: 15px;
  color: var(--wcab-ink);
}

.wcab-reason-modal-text {
  margin: 0;
  white-space: pre-wrap;
  color: var(--wcab-ink);
  font-size: 14px;
  line-height: 1.6;
}

.wcab-reason-modal-close {
  position: absolute;
  top: 12px;
  right: 14px;
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: var(--wcab-surface-soft);
  color: var(--wcab-muted);
  cursor: pointer;
  font-size: 20px;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wcab-reason-modal-close:hover {
  background: #eef0ff;
  color: var(--wcab-primary);
}

/* ---------- Item 17: Export to PDF / Excel buttons ---------- */
.wcab-export-actions {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
}

.wcab-export-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-surface);
  color: var(--wcab-ink);
  padding: 9px 16px;
  border-radius: var(--wcab-radius-sm);
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
  transition: border-color 0.15s ease, transform 0.15s ease, background 0.15s ease;
}

.wcab-export-btn svg {
  width: 16px;
  height: 16px;
}

.wcab-export-pdf-btn:hover {
  border-color: #b42318;
  background: #fef2f2;
  color: #b42318;
  transform: translateY(-1px);
}

.wcab-export-excel-btn:hover {
  border-color: #067647;
  background: #ecfdf5;
  color: #067647;
  transform: translateY(-1px);
}

/* ---------- Item 16: pagination controls ---------- */
.wcab-pagination {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 14px;
}

.wcab-pagination-info {
  color: var(--wcab-muted);
  font-size: 13px;
}

.wcab-pagination-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.wcab-pagination-btn {
  display: inline-flex;
  align-items: center;
  border: 1.5px solid var(--wcab-border);
  background: var(--wcab-surface);
  color: var(--wcab-ink);
  padding: 8px 14px;
  border-radius: var(--wcab-radius-sm);
  font-weight: 800;
  font-size: 13px;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.wcab-pagination-btn:hover {
  border-color: var(--wcab-staff-btn);
  background: var(--wcab-primary-light);
}

.wcab-pagination-btn-disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

.wcab-pagination-page {
  font-weight: 800;
  font-size: 13px;
  color: var(--wcab-ink);
}

@media (max-width: 650px) {
  .wcab-export-actions { flex-wrap: wrap; }
  .wcab-pagination { flex-direction: column; align-items: flex-start; }
}

/* =========================================================
   Frontend HR Management (Staff Admin only) — v1.9.0
   Professional dashboard UI based on the supplied reference.
========================================================= */
.wcab-hr-management-btn {
  background: linear-gradient(135deg, #4f46e5, #5b4ff2) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 8px 20px rgba(79, 70, 229, 0.25) !important;
}

.wcab-hr-panel {
  width: min(100%, 1600px);
  max-width: 1600px;
  box-sizing: border-box;
  margin: 24px auto;
  padding: 30px;
  border: 1px solid #edf0f6;
  border-radius: 22px;
  background: #f8fafc;
  box-shadow: 0 16px 45px rgba(15, 23, 42, 0.08);
  color: #172033;
}

.wcab-hr-panel * {
  box-sizing: border-box;
}

.wcab-hr-head {
  align-items: center;
  margin-bottom: 22px;
  padding: 0;
  border-bottom: 0;
}

.wcab-hr-heading-copy {
  min-width: 0;
}

.wcab-hr-head .wcab-dashboard-main-heading {
  margin: 3px 0 6px;
  color: #1d2638;
  font-size: clamp(30px, 3vw, 42px);
  line-height: 1.08;
  font-weight: 900;
  letter-spacing: -0.035em;
}

.wcab-hr-head p {
  color: #738096;
  font-size: 14px;
  line-height: 1.6;
}

.wcab-hr-eyebrow {
  display: inline-block;
  margin-bottom: 4px;
  color: #4f46e5;
  font-size: 11px;
  line-height: 1;
  font-weight: 900;
  letter-spacing: 0.08em;
}

.wcab-hr-top-actions {
  justify-content: flex-end;
  gap: 12px;
}

.wcab-hr-top-btn,
.wcab-hr-top-btn:visited {
  min-height: 48px;
  padding: 11px 20px;
  border-radius: 10px;
  gap: 10px;
  font-size: 13px;
  font-weight: 800;
  white-space: nowrap;
  text-decoration: none;
}

.wcab-hr-top-btn .wcab-btn-icon {
  width: 18px;
  height: 18px;
}

.wcab-hr-primary-nav,
.wcab-hr-primary-nav:visited,
.wcab-hr-primary-nav:not(:hover):not(:focus-visible) {
  border: 1px solid #4f46e5 !important;
  background: linear-gradient(135deg, #4f46e5, #5548ed) !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(79, 70, 229, 0.24) !important;
}

.wcab-hr-primary-nav:hover,
.wcab-hr-primary-nav:focus-visible {
  border-color: #4038c9 !important;
  background: linear-gradient(135deg, #4338ca, #4f46e5) !important;
  color: #fff !important;
  transform: translateY(-1px);
}

.wcab-hr-secondary-nav,
.wcab-hr-secondary-nav:visited,
.wcab-hr-secondary-nav:not(:hover):not(:focus-visible) {
  border: 1px solid #dfe4ec !important;
  background: #fff !important;
  color: #202b40 !important;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.06) !important;
}

.wcab-hr-secondary-nav:hover,
.wcab-hr-secondary-nav:focus-visible {
  border-color: #cbd3e0 !important;
  background: #f8fafc !important;
  color: #4f46e5 !important;
  transform: translateY(-1px);
}

.wcab-hr-summary-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(150px, 1fr));
  gap: 18px;
  margin: 18px 0 24px;
}

.wcab-hr-summary-card {
  position: relative;
  min-width: 0;
  min-height: 112px;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: 14px;
  align-items: center;
  overflow: hidden;
  padding: 18px 16px 13px;
  border: 1px solid #e7ebf2;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 5px 15px rgba(15, 23, 42, 0.07);
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
}

.wcab-hr-summary-card:hover {
  transform: translateY(-2px);
  border-color: #d9dff0;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.1);
}

.wcab-hr-summary-icon {
  grid-row: 1 / span 2;
  width: 50px;
  height: 50px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: start;
  border-radius: 50%;
  background: #eef0ff;
  color: #4f46e5;
}

.wcab-hr-summary-icon svg {
  width: 27px;
  height: 27px;
}

.wcab-hr-summary-copy {
  min-width: 0;
  display: block;
  align-self: start;
}

.wcab-hr-summary-copy small {
  display: block;
  overflow: hidden;
  color: #556176;
  font-size: 12px;
  line-height: 1.2;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.wcab-hr-summary-copy strong {
  display: block;
  margin-top: 5px;
  color: currentColor;
  font-size: clamp(24px, 2vw, 30px);
  line-height: 1;
  font-weight: 900;
}

.wcab-hr-sparkline {
  grid-column: 2;
  width: 88px;
  max-width: 100%;
  height: 24px;
  align-self: end;
  opacity: 0.95;
}

.wcab-hr-summary-purple { color: #4f46e5; }
.wcab-hr-summary-purple .wcab-hr-summary-icon { background: #eeecff; color: #4f46e5; }
.wcab-hr-summary-green { color: #23ad61; }
.wcab-hr-summary-green .wcab-hr-summary-icon { background: #e9f9ef; color: #27ae60; }
.wcab-hr-summary-indigo { color: #4338ca; }
.wcab-hr-summary-indigo .wcab-hr-summary-icon { background: #efedff; color: #4f46e5; }
.wcab-hr-summary-cyan { color: #06a9d4; }
.wcab-hr-summary-cyan .wcab-hr-summary-icon { background: #e5f8fc; color: #06a9d4; }
.wcab-hr-summary-blue { color: #3578e5; }
.wcab-hr-summary-blue .wcab-hr-summary-icon { background: #eaf2ff; color: #3578e5; }
.wcab-hr-summary-teal { color: #04a8c0; }
.wcab-hr-summary-teal .wcab-hr-summary-icon { background: #e4f8fa; color: #04a8c0; }

.wcab-hr-layout {
  display: grid;
  grid-template-columns: minmax(430px, 0.78fr) minmax(0, 1.55fr);
  gap: 22px;
  align-items: start;
}

.wcab-hr-card {
  min-width: 0;
  border: 1px solid #e3e8f0;
  border-radius: 13px;
  background: #fff;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.07);
}

.wcab-hr-form-card,
.wcab-hr-performance-card {
  padding: 18px;
}

.wcab-hr-form-card {
  position: sticky;
  top: 18px;
}

.wcab-hr-section-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
}

.wcab-hr-section-head-clean {
  padding: 0 0 13px;
  border-bottom: 0;
}

.wcab-hr-card-title {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-width: 0;
  color: #4f46e5;
}

.wcab-hr-title-icon {
  width: 21px;
  height: 21px;
  display: inline-flex;
  flex: 0 0 21px;
  align-items: center;
  justify-content: center;
}

.wcab-hr-title-icon svg {
  width: 100%;
  height: 100%;
}

.wcab-hr-section-head h4 {
  margin: 0;
  color: #4f46e5;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: -0.01em;
}

.wcab-hr-text-link,
.wcab-hr-text-link:visited {
  color: #4f46e5;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}

.wcab-hr-text-link:hover {
  text-decoration: underline;
}

.wcab-hr-section-note {
  color: #7b8798;
  font-size: 11px;
  font-weight: 700;
  text-align: right;
}

.wcab-hr-form {
  display: block;
}

.wcab-hr-form-main {
  display: grid;
  grid-template-columns: 102px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.wcab-hr-avatar-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 2px;
  text-align: center;
}

.wcab-hr-avatar-preview-wrap {
  position: relative;
  width: 88px;
  height: 88px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible;
  border: 1px solid #d9deea;
  border-radius: 50%;
  background: linear-gradient(145deg, #f7f8fb, #e8ebf1);
  color: #8590a2;
  cursor: pointer;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
}

.wcab-hr-avatar-preview {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 50%;
}

.wcab-hr-avatar-placeholder {
  width: 68px;
  height: 68px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.wcab-hr-avatar-placeholder svg {
  width: 62px;
  height: 62px;
}

.wcab-hr-camera-badge {
  position: absolute;
  right: -1px;
  bottom: 2px;
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #4f46e5;
  color: #fff;
  box-shadow: 0 3px 9px rgba(79, 70, 229, 0.3);
}

.wcab-hr-camera-badge svg {
  width: 13px;
  height: 13px;
}

.wcab-hr-upload-label {
  margin: 12px 0 3px !important;
  color: #364052 !important;
  font-size: 11px !important;
  line-height: 1.2;
  font-weight: 900 !important;
  cursor: pointer;
}

.wcab-hr-upload-help {
  color: #778397;
  font-size: 9px;
  line-height: 1.6;
}

.wcab-hr-file-input {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}

.wcab-hr-remove-photo {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 5px;
  margin: 8px 0 0 !important;
  color: #b42318 !important;
  font-size: 9px !important;
  font-weight: 700 !important;
  text-transform: none !important;
}

.wcab-hr-remove-photo input {
  width: auto !important;
  min-height: 0 !important;
}

.wcab-hr-form-grid {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 11px 12px;
}

.wcab-hr-field {
  min-width: 0;
}

.wcab-hr-field-wide {
  grid-column: 1 / -1;
}

.wcab-hr-field > label {
  display: block;
  margin: 0 0 5px;
  color: #253148;
  font-size: 10px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: none;
}

.wcab-required {
  color: #ef4444;
}

.wcab-hr-field input,
.wcab-hr-field select,
.wcab-hr-field textarea {
  width: 100%;
  max-width: 100%;
  min-height: 36px;
  box-sizing: border-box;
  border: 1px solid #dce2ec;
  border-radius: 6px;
  background: #fff;
  color: #263248;
  padding: 8px 10px;
  font: inherit;
  font-size: 10px;
  line-height: 1.35;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.02);
}

.wcab-hr-field input::placeholder,
.wcab-hr-field textarea::placeholder {
  color: #9aa4b4;
}

.wcab-hr-field textarea {
  min-height: 36px;
  max-height: 74px;
  resize: vertical;
}

.wcab-hr-field input:focus,
.wcab-hr-field select:focus,
.wcab-hr-field textarea:focus {
  outline: none;
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.wcab-hr-field small {
  display: block;
  margin-top: 4px;
  color: #7c8798;
  font-size: 9px;
  line-height: 1.4;
}

.wcab-hr-field .wcab-password-field {
  width: 100%;
}

.wcab-hr-field .wcab-password-toggle {
  min-width: 34px;
  padding: 0 8px;
  border-left: 1px solid #dce2ec;
  color: #69758a;
}

.wcab-hr-field .wcab-password-toggle svg {
  width: 15px;
  height: 15px;
}

.wcab-hr-days {
  display: flex;
  flex-wrap: wrap;
  gap: 9px;
}

.wcab-hr-days label {
  min-width: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #5c687c;
  font-size: 9px;
  font-weight: 700;
  cursor: pointer;
}

.wcab-hr-days input {
  width: 12px !important;
  height: 12px !important;
  min-height: 0 !important;
  margin: 0 !important;
  accent-color: #4f46e5;
}

.wcab-hr-account-note {
  margin: 14px 0 0;
  padding: 10px 12px;
  border: 1px solid #fedf89;
  border-radius: 8px;
  background: #fffaeb;
  color: #93370d;
  font-size: 11px;
  font-weight: 700;
}

.wcab-hr-save-btn {
  width: 100%;
  min-height: 44px;
  margin-top: 16px;
  border-radius: 7px !important;
  background: linear-gradient(135deg, #4338ca, #5546ee) !important;
  box-shadow: 0 7px 16px rgba(79, 70, 229, 0.22) !important;
  font-size: 14px;
}

.wcab-hr-save-btn svg {
  width: 18px;
  height: 18px;
}

.wcab-hr-table-wrap {
  width: 100%;
  overflow: auto;
  border: 1px solid #e2e7ef;
  border-radius: 10px;
  background: #fff;
}

.wcab-hr-table {
  width: 100%;
  min-width: 1080px;
  margin: 0;
  border-collapse: collapse;
  table-layout: auto;
}

.wcab-hr-table th,
.wcab-hr-table td {
  padding: 11px 9px;
  border-right: 1px solid #edf0f5;
  border-bottom: 1px solid #e7ebf1;
  white-space: nowrap;
  vertical-align: middle;
  text-align: center;
}

.wcab-hr-table th:last-child,
.wcab-hr-table td:last-child {
  border-right: 0;
}

.wcab-hr-table tbody tr:last-child td {
  border-bottom: 0;
}

.wcab-hr-table th {
  background: #fafbfc;
  color: #202a3d;
  font-size: 9px;
  line-height: 1.2;
  font-weight: 900;
  text-transform: none;
}

.wcab-hr-table td {
  color: #202a3d;
  font-size: 10px;
  line-height: 1.25;
}

.wcab-hr-table th:first-child,
.wcab-hr-table td:first-child {
  min-width: 165px;
  text-align: left;
}

.wcab-hr-table tbody tr {
  transition: background 0.15s ease;
}

.wcab-hr-table tbody tr:hover {
  background: #fbfcff;
}

.wcab-hr-person {
  display: flex;
  align-items: center;
  gap: 9px;
  min-width: 150px;
}

.wcab-hr-person > img,
.wcab-hr-person > span {
  width: 31px;
  height: 31px;
  flex: 0 0 31px;
  border-radius: 50%;
}

.wcab-hr-person > img {
  object-fit: cover;
}

.wcab-hr-person > span {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #4f46e5, #6255f2);
  color: #fff;
  font-size: 9px;
  font-weight: 900;
}

.wcab-hr-person strong,
.wcab-hr-person small {
  display: block;
  text-align: left;
}

.wcab-hr-person strong {
  overflow: hidden;
  max-width: 112px;
  color: #182236;
  font-size: 10px;
  line-height: 1.25;
  font-weight: 800;
  text-overflow: ellipsis;
}

.wcab-hr-person small {
  margin-top: 2px;
  overflow: hidden;
  max-width: 112px;
  color: #788397;
  font-size: 8px;
  line-height: 1.2;
  text-overflow: ellipsis;
}

.wcab-hr-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 5px 9px;
  border-radius: 999px;
  font-size: 8px;
  line-height: 1;
  font-weight: 800;
  text-transform: none;
}

.wcab-hr-status-active {
  border: 1px solid #d0eccf;
  background: #effbea;
  color: #3eaa55;
}

.wcab-hr-status-inactive {
  border: 1px solid #e2e6ed;
  background: #f1f3f6;
  color: #778294;
}

.wcab-hr-status-on_leave {
  border: 1px solid #ffe2a1;
  background: #fff4cf;
  color: #d49000;
}

.wcab-hr-status-not_available {
  border: 1px solid #fecdca;
  background: #fef2f2;
  color: #b42318;
}

.wcab-hr-number-approved,
.wcab-hr-number-paid {
  color: #16a34a !important;
  font-weight: 800;
}

.wcab-hr-number-pending {
  color: #f59e0b !important;
  font-weight: 800;
}

.wcab-hr-number-cancelled {
  color: #ef4444 !important;
  font-weight: 800;
}

.wcab-hr-number-rescheduled {
  color: #2563eb !important;
  font-weight: 800;
}

.wcab-hr-progress {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-width: 88px;
}

.wcab-hr-progress-track {
  width: 56px;
  height: 7px;
  overflow: hidden;
  border-radius: 999px;
  background: #e8ebf2;
}

.wcab-hr-progress-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #4f46e5, #5c4ff3);
}

.wcab-hr-progress strong {
  min-width: 27px;
  color: #263248;
  font-size: 9px;
  font-weight: 800;
}

.wcab-hr-last-booking {
  display: block;
  color: #354158;
  text-align: left;
}

.wcab-hr-last-booking strong,
.wcab-hr-last-booking small {
  display: block;
}

.wcab-hr-last-booking strong {
  font-size: 9px;
  font-weight: 700;
}

.wcab-hr-last-booking small {
  margin-top: 3px;
  color: #6f7b90;
  font-size: 8px;
}

.wcab-hr-row-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}

.wcab-hr-row-actions form {
  margin: 0;
}

.wcab-hr-edit-btn,
.wcab-hr-delete-btn,
.wcab-hr-current-label {
  width: 27px;
  height: 27px;
  min-height: 27px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  border: 0;
  border-radius: 6px;
  padding: 0;
  font-size: 8px;
  line-height: 1;
  font-weight: 900;
  text-decoration: none;
}

.wcab-hr-edit-btn,
.wcab-hr-edit-btn:visited {
  background: linear-gradient(135deg, #4f46e5, #5b4ff0);
  color: #fff;
  box-shadow: 0 3px 7px rgba(79, 70, 229, 0.2);
}

.wcab-hr-edit-btn:hover {
  background: #4338ca;
  color: #fff;
  transform: translateY(-1px);
}

.wcab-hr-delete-btn {
  background: #ef3340;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 3px 7px rgba(239, 51, 64, 0.18);
}

.wcab-hr-delete-btn:hover {
  background: #dc2634;
  transform: translateY(-1px);
}

.wcab-hr-edit-btn svg,
.wcab-hr-delete-btn svg {
  width: 13px;
  height: 13px;
}

.wcab-hr-current-label {
  width: auto;
  padding: 0 7px;
  background: #ecfdf3;
  color: #067647;
}

.wcab-hr-definition {
  display: flex;
  align-items: center;
  gap: 7px;
  margin: 12px 0 0;
  color: #7a8597;
  font-size: 10px;
  line-height: 1.5;
}

.wcab-hr-definition svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
}

@media (max-width: 1450px) {
  .wcab-hr-summary-grid {
    gap: 12px;
  }

  .wcab-hr-summary-card {
    grid-template-columns: 44px minmax(0, 1fr);
    column-gap: 10px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .wcab-hr-summary-icon {
    width: 42px;
    height: 42px;
  }

  .wcab-hr-summary-icon svg {
    width: 23px;
    height: 23px;
  }

  .wcab-hr-layout {
    grid-template-columns: minmax(400px, 0.78fr) minmax(0, 1.42fr);
  }
}

@media (max-width: 1260px) {
  .wcab-hr-summary-grid {
    grid-template-columns: repeat(3, minmax(170px, 1fr));
  }

  .wcab-hr-layout {
    grid-template-columns: 1fr;
  }

  .wcab-hr-form-card {
    position: static;
  }

  .wcab-hr-form-main {
    grid-template-columns: 120px minmax(0, 1fr);
  }
}

@media (max-width: 820px) {
  .wcab-hr-panel {
    padding: 20px;
    border-radius: 16px;
  }

  .wcab-hr-head {
    flex-direction: column;
    align-items: flex-start;
  }

  .wcab-hr-top-actions {
    width: 100%;
    justify-content: flex-start;
  }

  .wcab-hr-top-btn {
    flex: 1 1 auto;
  }

  .wcab-hr-summary-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .wcab-hr-form-main {
    grid-template-columns: 1fr;
  }

  .wcab-hr-avatar-column {
    padding-bottom: 6px;
  }

  .wcab-hr-form-card,
  .wcab-hr-performance-card {
    padding: 16px;
  }
}

@media (max-width: 560px) {
  .wcab-hr-panel {
    padding: 14px;
    margin: 12px auto;
  }

  .wcab-hr-head .wcab-dashboard-main-heading {
    font-size: 30px;
  }

  .wcab-hr-top-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .wcab-hr-primary-nav {
    grid-column: 1 / -1;
  }

  .wcab-hr-summary-grid {
    grid-template-columns: 1fr;
  }

  .wcab-hr-form-grid {
    grid-template-columns: 1fr;
  }

  .wcab-hr-field-wide {
    grid-column: auto;
  }

  .wcab-hr-section-head {
    align-items: flex-start;
  }

  .wcab-hr-section-note {
    max-width: 120px;
  }
}

/* =========================================================
   WebCarry v1.9.0 — HR modal, career portal and UI refinements
========================================================= */

/* Workforce Dashboard action button: supplied rounded-square pencil style. */
.wcab-action-icon-btn {
  width: 46px;
  height: 46px;
  border-radius: 11px;
}
.wcab-action-open-btn {
  background: var(--wcab-action-open-bg, #4f46e5);
  color: var(--wcab-action-open-icon, #fff);
}
.wcab-action-open-btn:hover,
.wcab-action-open-btn:focus-visible {
  background: var(--wcab-action-open-hover-bg, #4338ca);
}

/* HR Management follows the same outlined theme as Calendar / Refresh. */
.wcab-hr-management-btn,
.wcab-hr-management-btn:visited,
.wcab-hr-management-btn:not(:hover):not(:focus-visible) {
  background: var(--wcab-surface-soft) !important;
  color: var(--wcab-staff-btn) !important;
  border: 1.5px solid var(--wcab-staff-btn) !important;
  box-shadow: none !important;
}
.wcab-hr-management-btn:hover,
.wcab-hr-management-btn:focus-visible {
  background: var(--wcab-staff-btn) !important;
  color: #fff !important;
  border-color: var(--wcab-staff-btn) !important;
  box-shadow: 0 8px 18px rgba(79,70,229,.22) !important;
}

/* Summary cards no longer include decorative graph lines. */
.wcab-hr-summary-card {
  min-height: 112px;
  grid-template-columns: 54px minmax(0,1fr);
  grid-template-rows: 1fr;
  padding: 20px 18px;
}
.wcab-hr-summary-icon {
  grid-row: auto;
  align-self: center;
}
.wcab-hr-summary-copy {
  align-self: center;
}
.wcab-hr-sparkline { display: none !important; }

.wcab-hr-performance-card,
.wcab-hr-applications-card {
  width: 100%;
  margin-top: 22px;
  padding: 22px;
}
.wcab-hr-performance-card { margin-top: 0; }
.wcab-hr-table { min-width: 1460px; }
.wcab-hr-table th { font-size: 11px; padding: 13px 10px; }
.wcab-hr-table td { font-size: 12px; padding: 13px 10px; }
.wcab-hr-person strong { max-width: 150px; font-size: 12px; }
.wcab-hr-person small { max-width: 150px; font-size: 10px; }
.wcab-hr-status { font-size: 10px; padding: 6px 10px; }
.wcab-hr-progress strong,
.wcab-hr-last-booking strong { font-size: 11px; }
.wcab-hr-last-booking small { font-size: 10px; }

.wcab-hr-report-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  flex-wrap: wrap;
}
.wcab-hr-report-btn,
.wcab-hr-report-btn:visited {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 8px 12px;
  border: 1px solid #d9deea;
  border-radius: 9px;
  background: #fff;
  color: #4f46e5;
  font: inherit;
  font-size: 11px;
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
}
.wcab-hr-report-btn:hover {
  border-color: #4f46e5;
  background: #eef0ff;
  color: #4338ca;
}
.wcab-hr-report-btn svg { width: 15px; height: 15px; }

/* Add/edit staff popup. */
body.wcab-modal-open { overflow: hidden; }
.wcab-hr-staff-modal {
  position: fixed;
  inset: 0;
  z-index: 999999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 22px;
}
.wcab-hr-staff-modal.is-open { display: flex; }
.wcab-hr-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15,23,42,.62);
  backdrop-filter: blur(4px);
}
.wcab-hr-modal-card {
  position: relative;
  z-index: 1;
  width: min(920px, 100%);
  max-height: calc(100vh - 44px);
  overflow: auto;
  padding: 24px;
  border: 1px solid #e3e8f0;
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 30px 80px rgba(15,23,42,.28);
}
.wcab-hr-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid #edf0f5;
}
.wcab-hr-modal-head h4 {
  margin: 4px 0 0;
  color: #172033;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 900;
}
.wcab-hr-modal-close,
.wcab-hr-modal-close:visited {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  border-radius: 10px;
  background: #f4f6fa;
  color: #526074;
  font-size: 28px;
  line-height: 1;
  text-decoration: none;
}
.wcab-hr-modal-close:hover { background: #feecee; color: #dc2634; }
.wcab-hr-avatar-field {
  display: grid;
  grid-template-columns: 104px minmax(0,1fr);
  gap: 18px;
  align-items: center;
  margin-bottom: 20px;
  padding: 16px;
  border: 1px solid #e5e9f0;
  border-radius: 14px;
  background: #f8fafc;
}
.wcab-hr-avatar-field .wcab-hr-avatar-preview-wrap { width: 96px; height: 96px; }
.wcab-hr-avatar-field strong { display: block; margin-bottom: 4px; color: #253148; font-size: 13px; }
.wcab-hr-avatar-field small { display: block; margin-bottom: 9px; color: #778397; font-size: 11px; line-height: 1.5; }
.wcab-hr-avatar-field input[type="file"] { width: 100%; font-size: 11px; }
.wcab-hr-camera-btn {
  position: absolute;
  right: -2px;
  bottom: 2px;
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #fff;
  border-radius: 50%;
  background: #4f46e5;
  color: #fff;
  cursor: pointer;
  box-shadow: 0 4px 10px rgba(79,70,229,.32);
}
.wcab-hr-camera-btn svg { width: 14px; height: 14px; }
.wcab-hr-check { display: inline-flex !important; align-items: center; gap: 6px; margin-top: 8px !important; font-size: 11px !important; }
.wcab-hr-check input { width: auto !important; min-height: 0 !important; }
.wcab-hr-modal-card .wcab-hr-form-grid { gap: 14px; }
.wcab-hr-modal-card .wcab-hr-field > label { font-size: 12px; margin-bottom: 6px; }
.wcab-hr-modal-card .wcab-hr-field input,
.wcab-hr-modal-card .wcab-hr-field select,
.wcab-hr-modal-card .wcab-hr-field textarea {
  min-height: 42px;
  border-radius: 8px;
  padding: 10px 12px;
  font-size: 12px;
}
.wcab-hr-modal-card .wcab-hr-field textarea { min-height: 70px; }
.wcab-hr-modal-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #edf0f5;
}
.wcab-hr-modal-actions .wcab-hr-save-btn { width: auto; min-width: 150px; margin: 0; padding: 11px 20px; }
.wcab-hr-cancel-btn,
.wcab-hr-cancel-btn:visited {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 10px 18px;
  border: 1px solid #d9deea;
  border-radius: 9px;
  background: #fff;
  color: #526074;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none;
}
.wcab-hr-cancel-btn:hover { border-color: #c7cfdb; background: #f8fafc; color: #172033; }

/* Career applications inside HR. */
.wcab-hr-applications-table { min-width: 1320px; }
.wcab-hr-applications-table th { font-size: 11px; }
.wcab-hr-applications-table td { font-size: 11px; vertical-align: top; white-space: normal; }
.wcab-hr-applications-table td > strong,
.wcab-hr-applications-table td > small,
.wcab-hr-applications-table td > span { display: block; }
.wcab-hr-applications-table td > small { margin-top: 4px; color: #7a8597; }
.wcab-hr-resume-btn,
.wcab-hr-resume-btn:visited {
  display: inline-flex;
  padding: 7px 10px;
  border-radius: 8px;
  background: #eef0ff;
  color: #4f46e5;
  font-weight: 800;
  text-decoration: none;
}
.wcab-hr-resume-btn:hover { background: #4f46e5; color: #fff; }
.wcab-hr-application-details summary { color: #4f46e5; font-weight: 800; cursor: pointer; }
.wcab-hr-application-details div { width: 260px; margin-top: 8px; padding: 10px; border: 1px solid #e5e9f0; border-radius: 8px; background: #f8fafc; }
.wcab-hr-application-details p { margin: 4px 0 10px; color: #526074; line-height: 1.5; }
.wcab-hr-app-status-form { min-width: 180px; }
.wcab-hr-app-status-form select,
.wcab-hr-app-status-form textarea { width: 100%; margin-bottom: 6px; border: 1px solid #d9deea; border-radius: 7px; padding: 7px; font-size: 11px; }
.wcab-hr-app-status-form button { padding: 7px 12px; border: 0; border-radius: 7px; background: #4f46e5; color: #fff; font-weight: 800; cursor: pointer; }

/* Public career shortcode. */
.wcab-career-wrap {
  width: min(100%, 920px);
  margin: 32px auto;
  padding: 30px;
  box-sizing: border-box;
  border: 1px solid var(--wcab-border);
  border-radius: 22px;
  background: #fff;
  box-shadow: var(--wcab-shadow-lg);
  color: var(--wcab-ink);
  font-family: var(--wcab-font-family, inherit);
}
.wcab-career-head { margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--wcab-border); }
.wcab-career-kicker { color: var(--wcab-primary); font-size: 12px; font-weight: 900; letter-spacing: .14em; }
.wcab-career-head h2 { margin: 8px 0; color: var(--wcab-heading-color); font-size: 32px; line-height: 1.15; font-weight: var(--wcab-heading-weight); }
.wcab-career-head p { margin: 0; color: var(--wcab-muted); font-size: 15px; }
.wcab-career-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.wcab-career-wide { grid-column: 1/-1; }
.wcab-career-field label { display: block; margin-bottom: 7px; color: #364058; font-size: 13px; font-weight: 800; }
.wcab-career-field label span { color: #ef4444; }
.wcab-career-field input,
.wcab-career-field select,
.wcab-career-field textarea {
  width: 100%;
  box-sizing: border-box;
  border: 1.5px solid var(--wcab-border);
  border-radius: 10px;
  background: #fff;
  padding: 12px 14px;
  color: var(--wcab-ink);
  font: inherit;
  font-size: 14px;
}
.wcab-career-field input:focus,
.wcab-career-field select:focus,
.wcab-career-field textarea:focus { outline: none; border-color: var(--wcab-primary); box-shadow: 0 0 0 4px rgba(79,70,229,.12); }
.wcab-career-field small { display: block; margin-top: 6px; color: var(--wcab-muted); font-size: 12px; }
.wcab-career-submit {
  min-height: 48px;
  margin-top: 22px;
  padding: 12px 24px;
  border: 0;
  border-radius: 10px;
  background: linear-gradient(135deg,var(--wcab-primary),var(--wcab-primary-dark));
  color: #fff;
  font: inherit;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 10px 22px rgba(79,70,229,.25);
}
.wcab-career-submit:hover { transform: translateY(-1px); filter: brightness(1.05); }
.wcab-career-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 900px) {
  .wcab-hr-report-actions { justify-content: flex-start; }
  .wcab-hr-section-head { align-items: flex-start; flex-direction: column; }
  .wcab-career-grid { grid-template-columns: 1fr; }
  .wcab-career-wide { grid-column: auto; }
}
@media (max-width: 640px) {
  .wcab-hr-staff-modal { padding: 8px; }
  .wcab-hr-modal-card { max-height: calc(100vh - 16px); padding: 16px; border-radius: 14px; }
  .wcab-hr-avatar-field { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .wcab-hr-modal-card .wcab-hr-form-grid { grid-template-columns: 1fr; }
  .wcab-hr-field-wide { grid-column: auto; }
  .wcab-hr-modal-actions { align-items: stretch; flex-direction: column-reverse; }
  .wcab-hr-modal-actions .wcab-hr-save-btn,
  .wcab-hr-cancel-btn { width: 100%; }
  .wcab-career-wrap { margin: 16px auto; padding: 20px; border-radius: 16px; }
  .wcab-career-head h2 { font-size: 27px; }
}

@media print {
  body.wcab-hr-printing * { visibility: hidden !important; }
  body.wcab-hr-printing .wcab-hr-performance-card,
  body.wcab-hr-printing .wcab-hr-performance-card * { visibility: visible !important; }
  body.wcab-hr-printing .wcab-hr-performance-card {
    position: absolute;
    inset: 0;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    box-shadow: none;
  }
  body.wcab-hr-printing .wcab-hr-report-actions,
  body.wcab-hr-printing .wcab-hr-row-actions { display: none !important; }
  body.wcab-hr-printing .wcab-hr-table-wrap { overflow: visible; border: 0; }
  body.wcab-hr-printing .wcab-hr-table { min-width: 0; width: 100%; font-size: 8px; }
  body.wcab-hr-printing .wcab-hr-table th,
  body.wcab-hr-printing .wcab-hr-table td { padding: 5px 3px; font-size: 8px; white-space: normal; }
}

/* =========================================================
   WebCarry v2.0.0 — Advanced Workforce UI System
   Segoe UI, softer typography, modern dashboard cards,
   responsive data surfaces, login persistence and careers.
========================================================= */

:root {
  --wcab-v2-ink: #1d2a44;
  --wcab-v2-copy: #52617a;
  --wcab-v2-muted: #7d8aa2;
  --wcab-v2-line: #e4e9f2;
  --wcab-v2-page: #f6f8fc;
  --wcab-v2-panel: #ffffff;
  --wcab-v2-primary: #5b45f5;
  --wcab-v2-primary-dark: #4532d8;
  --wcab-v2-primary-soft: #f0edff;
  --wcab-v2-green: #22a866;
  --wcab-v2-green-soft: #eaf8f0;
  --wcab-v2-orange: #f39a17;
  --wcab-v2-orange-soft: #fff4e4;
  --wcab-v2-red: #ef4b57;
  --wcab-v2-red-soft: #ffedef;
  --wcab-v2-cyan: #24a9c8;
  --wcab-v2-cyan-soft: #e8f8fc;
  --wcab-v2-blue: #4779ed;
  --wcab-v2-blue-soft: #edf3ff;
  --wcab-v2-shadow: 0 10px 30px rgba(39, 53, 83, .07);
  --wcab-v2-shadow-hover: 0 18px 42px rgba(39, 53, 83, .12);
}

/* Segoe UI is now the single visual language throughout plugin interfaces. */
.wcab-wrapper,
.wcab-dashboard-panel,
.wcab-staff-login,
.wcab-booking-lookup,
.wcab-customer-panel,
.wcab-career-wrap,
.wcab-open-positions-wrap,
.wcab-reason-modal-card,
.wcab-action-modal-card,
.wcab-hr-modal-card,
.wcab-mini-calendar-wrap,
.wcab-day-appts-panel,
.wcab-confirmation-modal-card,
.wcab-success-modal-card {
  --wcab-font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
  color: var(--wcab-v2-copy);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.wcab-wrapper *,
.wcab-dashboard-panel *,
.wcab-staff-login *,
.wcab-booking-lookup *,
.wcab-customer-panel *,
.wcab-career-wrap *,
.wcab-open-positions-wrap *,
.wcab-reason-modal-card *,
.wcab-action-modal-card *,
.wcab-hr-modal-card * {
  font-family: inherit;
}

body.toplevel_page_wcab-bookings,
body[class*="_page_wcab-"] {
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
}

/* Softer, more deliberate typography — no harsh full-black or ultra-heavy copy. */
.wcab-dashboard-panel h1,
.wcab-dashboard-panel h2,
.wcab-dashboard-panel h3,
.wcab-dashboard-panel h4,
.wcab-career-wrap h2,
.wcab-career-wrap h3,
.wcab-open-positions-wrap h2,
.wcab-open-positions-wrap h3,
.wcab-staff-login h3 {
  color: var(--wcab-v2-ink) !important;
  font-weight: 600 !important;
  letter-spacing: -.018em;
}

.wcab-dashboard-panel strong,
.wcab-career-wrap strong,
.wcab-open-positions-wrap strong,
.wcab-hr-modal-card strong {
  font-weight: 600;
}

.wcab-dashboard-panel p,
.wcab-dashboard-panel small,
.wcab-career-wrap p,
.wcab-career-wrap small,
.wcab-open-positions-wrap p,
.wcab-open-positions-wrap small {
  color: var(--wcab-v2-copy);
  font-weight: 400;
}

/* ---------- Shared dashboard shell ---------- */
.wcab-dashboard-panel {
  width: min(100%, 1600px);
  max-width: 1600px;
  box-sizing: border-box;
  margin: 24px auto;
  padding: 30px;
  border: 1px solid var(--wcab-v2-line);
  border-radius: 24px;
  background:
    radial-gradient(circle at 92% 0%, rgba(91,69,245,.055), transparent 25%),
    linear-gradient(180deg, #fff 0%, #fdfdff 100%);
  box-shadow: 0 16px 50px rgba(38, 52, 82, .08);
  overflow: visible;
}

.wcab-dashboard-brand {
  min-height: 58px;
  gap: 13px;
  margin: 0 0 22px;
}

.wcab-dashboard-brand-logo {
  max-width: 220px;
  filter: drop-shadow(0 4px 10px rgba(31, 43, 68, .05));
}

.wcab-dashboard-brand-name {
  color: var(--wcab-v2-ink);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: .015em;
  text-transform: none;
}

.wcab-dashboard-head {
  align-items: center;
  gap: 24px;
  margin-bottom: 24px;
  padding-bottom: 22px;
  border-bottom-color: var(--wcab-v2-line);
}

.wcab-dashboard-head-identity {
  gap: 16px;
  min-width: 280px;
}

.wcab-current-staff-avatar {
  width: 64px;
  height: 64px;
  border: 3px solid #fff;
  background: linear-gradient(135deg, #7762ff, #4b36df);
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  box-shadow: 0 8px 22px rgba(73, 55, 218, .20), 0 0 0 1px var(--wcab-v2-line);
}

.wcab-dashboard-head h3,
.wcab-dashboard-head .wcab-dashboard-main-heading {
  margin: 0 0 5px;
  color: var(--wcab-v2-ink) !important;
  font-size: clamp(27px, 2vw, 34px);
  line-height: 1.15;
  font-weight: 600 !important;
}

.wcab-dashboard-welcome {
  margin: 0 0 3px !important;
  color: var(--wcab-v2-copy) !important;
  font-size: 14px !important;
}

.wcab-dashboard-welcome > span {
  color: var(--wcab-v2-primary);
  font-weight: 600;
}

.wcab-dashboard-role {
  color: var(--wcab-v2-muted) !important;
  font-size: 13px !important;
}

.wcab-dashboard-role > span {
  color: var(--wcab-v2-copy);
  font-weight: 500;
}

/* ---------- Header controls ---------- */
.wcab-dashboard-actions {
  justify-content: flex-end;
  gap: 10px;
}

.wcab-refresh-btn,
.wcab-clear-btn,
.wcab-filter-btn,
.wcab-hr-report-btn,
.wcab-hr-cancel-btn,
.wcab-career-submit,
.wcab-open-position-apply {
  font-weight: 600 !important;
  letter-spacing: 0;
}

.wcab-refresh-btn,
.wcab-refresh-btn:visited,
.wcab-refresh-btn:not(:hover):not(:focus-visible) {
  min-height: 46px;
  padding: 10px 18px;
  border: 1px solid #dfe4ef;
  border-radius: 12px;
  background: #fff !important;
  color: #5643e8 !important;
  box-shadow: 0 4px 12px rgba(42, 55, 84, .035);
}

.wcab-refresh-btn:hover,
.wcab-refresh-btn:focus-visible {
  border-color: #cfc8ff;
  background: var(--wcab-v2-primary-soft) !important;
  color: var(--wcab-v2-primary-dark) !important;
  box-shadow: 0 8px 20px rgba(91,69,245,.10) !important;
  transform: translateY(-1px);
}

.wcab-hr-management-btn,
.wcab-hr-management-btn:visited,
.wcab-hr-management-btn:not(:hover):not(:focus-visible) {
  border-color: #cdebdc !important;
  background: #fbfffd !important;
  color: #178a52 !important;
}

.wcab-hr-management-btn:hover,
.wcab-hr-management-btn:focus-visible {
  border-color: #a9dec4 !important;
  background: var(--wcab-v2-green-soft) !important;
  color: #117844 !important;
  box-shadow: 0 8px 20px rgba(34,168,102,.10) !important;
}

.wcab-clear-btn,
.wcab-dashboard-actions .wcab-clear-btn:not(:hover):not(:focus-visible) {
  min-height: 46px;
  padding: 10px 18px;
  border: 1px solid #ffd5da;
  border-radius: 12px;
  background: #fffafa;
  color: #e33a49 !important;
  box-shadow: none;
}

.wcab-clear-btn:hover,
.wcab-clear-btn:focus-visible {
  background: var(--wcab-v2-red-soft);
  border-color: #ffc4cb;
  color: #d62e3f !important;
}

.wcab-notify-bell {
  width: 48px;
  height: 48px;
  border: 1px solid var(--wcab-v2-line);
  background: #fff;
  color: #52617a;
  box-shadow: 0 4px 12px rgba(42, 55, 84, .035);
}

.wcab-notify-bell:hover {
  border-color: #d7d0ff;
  background: var(--wcab-v2-primary-soft);
  color: var(--wcab-v2-primary);
}

/* ---------- Modern workforce statistic cards ---------- */
.wcab-stats-grid {
  grid-template-columns: repeat(7, minmax(145px, 1fr));
  gap: 16px;
  margin: 22px 0 24px;
}

.wcab-stat-card {
  --wcab-stat-accent: var(--wcab-v2-primary);
  --wcab-stat-soft: var(--wcab-v2-primary-soft);
  min-height: 188px;
  padding: 20px;
  border: 1px solid var(--wcab-v2-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: var(--wcab-v2-shadow);
  isolation: isolate;
}

.wcab-stat-card::after {
  content: "";
  position: absolute;
  right: -28px;
  top: -30px;
  z-index: -1;
  width: 105px;
  height: 105px;
  border-radius: 50%;
  background: var(--wcab-stat-soft);
  opacity: .48;
}

.wcab-stat-card:hover {
  transform: translateY(-3px);
  border-color: color-mix(in srgb, var(--wcab-stat-accent) 25%, var(--wcab-v2-line));
  box-shadow: var(--wcab-v2-shadow-hover);
}

.wcab-stat-card.wcab-stat-active {
  border: 1.5px solid var(--wcab-stat-accent);
  background: #fff;
  box-shadow: 0 13px 34px color-mix(in srgb, var(--wcab-stat-accent) 14%, transparent);
}

.wcab-stat-icon {
  width: 46px;
  height: 46px;
  margin: 0 0 17px;
  border-radius: 13px;
  background: var(--wcab-stat-soft) !important;
  color: var(--wcab-stat-accent) !important;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.7);
}

.wcab-stat-icon svg {
  width: 23px;
  height: 23px;
  stroke-width: 2;
}

.wcab-stat-label {
  min-height: 30px;
  margin: 0 0 8px;
  color: var(--wcab-v2-copy);
  font-size: 11.5px;
  line-height: 1.3;
  font-weight: 600;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.wcab-stat-card strong {
  margin: auto 0 7px;
  color: var(--wcab-v2-ink) !important;
  font-size: 34px;
  line-height: 1;
  font-weight: 600;
}

.wcab-stat-caption {
  color: var(--wcab-v2-muted);
  font-size: 12px;
  line-height: 1.4;
  font-weight: 400;
}

.wcab-stat-total { --wcab-stat-accent: #7a62f5; --wcab-stat-soft: #eeeaff; }
.wcab-stat-pending { --wcab-stat-accent: #eb8b12; --wcab-stat-soft: #fff2df; }
.wcab-stat-approved { --wcab-stat-accent: #23ae61; --wcab-stat-soft: #e8f8ee; }
.wcab-stat-cancelled { --wcab-stat-accent: #ef4b57; --wcab-stat-soft: #ffebed; }
.wcab-stat-postponed { --wcab-stat-accent: #f2871c; --wcab-stat-soft: #fff0e5; }
.wcab-stat-pending_payment { --wcab-stat-accent: #7549ec; --wcab-stat-soft: #f0e8ff; }
.wcab-stat-rescheduled { --wcab-stat-accent: #31a9c7; --wcab-stat-soft: #e7f7fb; }

/* ---------- Filter workspace ---------- */
.wcab-filter-form {
  gap: 15px;
  margin: 0 0 20px;
  padding: 20px;
  border: 1px solid var(--wcab-v2-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(39,53,83,.045);
}

.wcab-filter-form label {
  margin-bottom: 7px;
  color: #687791;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .045em;
}

.wcab-filter-form input,
.wcab-filter-form select,
.wcab-staff-filter-toggle {
  min-height: 46px;
  border: 1px solid #dde4ee !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: #35435c;
  font-size: 13px;
  font-weight: 400;
  box-shadow: none !important;
}

.wcab-filter-form input::placeholder {
  color: #98a4b7;
}

.wcab-filter-form input:focus,
.wcab-filter-form select:focus,
.wcab-staff-filter-toggle:focus {
  border-color: #a99cff !important;
  box-shadow: 0 0 0 4px rgba(91,69,245,.09) !important;
}

.wcab-filter-btn {
  min-height: 46px;
  border-radius: 11px;
  background: linear-gradient(135deg, #654ff8, #4d37df);
  box-shadow: 0 9px 20px rgba(82,61,225,.20);
}

/* ---------- Professional dashboard tables ---------- */
.wcab-dashboard-panel > .wcab-table-wrap,
.wcab-dashboard-panel .wcab-table-container,
.wcab-hr-card .wcab-table-wrap {
  border: 1px solid var(--wcab-v2-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(39,53,83,.04);
}

.wcab-dashboard-panel .wcab-table,
.wcab-hr-panel .wcab-table {
  border-collapse: separate;
  border-spacing: 0;
  color: #42516b;
  background: #fff;
}

.wcab-dashboard-panel .wcab-table th,
.wcab-hr-panel .wcab-table th {
  padding-top: 14px;
  padding-bottom: 14px;
  border-color: var(--wcab-v2-line);
  background: #fbfcfe;
  color: #5d6c85;
  font-size: 10.5px;
  line-height: 1.35;
  font-weight: 600 !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.wcab-dashboard-panel .wcab-table th:first-child,
.wcab-hr-panel .wcab-table th:first-child {
  border-top-left-radius: 16px;
}

.wcab-dashboard-panel .wcab-table th:last-child,
.wcab-hr-panel .wcab-table th:last-child {
  border-top-right-radius: 16px;
}

.wcab-dashboard-panel .wcab-table td,
.wcab-hr-panel .wcab-table td {
  padding-top: 14px;
  padding-bottom: 14px;
  border-color: #e9edf4;
  color: #46546c;
  font-size: 12px;
  line-height: 1.45;
  font-weight: 400;
  vertical-align: middle;
}

.wcab-dashboard-panel .wcab-table tbody tr,
.wcab-hr-panel .wcab-table tbody tr {
  background: #fff;
  transition: background .15s ease, box-shadow .15s ease;
}

.wcab-dashboard-panel .wcab-table tbody tr:nth-child(even),
.wcab-hr-panel .wcab-table tbody tr:nth-child(even) {
  background: #fcfdff;
}

.wcab-dashboard-panel .wcab-table tbody tr:hover,
.wcab-hr-panel .wcab-table tbody tr:hover {
  background: #f8f7ff;
}

.wcab-sort-link {
  color: #5d6c85;
  font-weight: 600;
}

.wcab-sort-link:hover {
  color: var(--wcab-v2-primary);
}

.wcab-status-badge {
  padding: 5px 9px;
  border: 0;
  font-size: 9.5px;
  font-weight: 600;
  letter-spacing: .025em;
  box-shadow: none;
}

.wcab-action-icon-btn {
  width: 42px;
  height: 42px;
  border-radius: 11px;
  box-shadow: 0 7px 18px rgba(77,55,223,.18);
}

.wcab-action-open-btn {
  background: linear-gradient(135deg, #6550f8, #4b36de);
}

.wcab-action-open-btn:hover,
.wcab-action-open-btn:focus-visible {
  background: linear-gradient(135deg, #5741e8, #3e2bc8);
  box-shadow: 0 11px 25px rgba(77,55,223,.28);
}

.wcab-pagination-info,
.wcab-dashboard-note,
.wcab-dashboard-powered-by {
  color: var(--wcab-v2-muted) !important;
  font-size: 12px;
  font-weight: 400;
}

.wcab-pagination-btn,
.wcab-pagination-page {
  border-color: var(--wcab-v2-line);
  border-radius: 10px;
  color: #596984;
  font-weight: 500;
}

/* ---------- HR dashboard ---------- */
.wcab-hr-panel {
  background:
    radial-gradient(circle at 92% 0%, rgba(91,69,245,.055), transparent 25%),
    linear-gradient(180deg, #fff 0%, #fcfdff 100%);
}

.wcab-hr-brand {
  margin-bottom: 20px;
}

.wcab-hr-head {
  align-items: center;
}

.wcab-hr-identity {
  align-items: center;
}

.wcab-hr-eyebrow,
.wcab-career-kicker,
.wcab-open-positions-kicker {
  color: var(--wcab-v2-primary);
  font-size: 11px;
  font-weight: 600 !important;
  letter-spacing: .12em;
}

.wcab-hr-heading-copy .wcab-dashboard-role {
  margin-top: 2px !important;
}

.wcab-hr-top-actions {
  max-width: none;
  justify-content: flex-end;
}

.wcab-hr-top-btn {
  min-height: 46px;
}

.wcab-hr-add-trigger,
.wcab-hr-add-trigger:not(:hover):not(:focus-visible) {
  border-color: transparent !important;
  background: linear-gradient(135deg, #6550f8, #4b36df) !important;
  color: #fff !important;
  box-shadow: 0 9px 20px rgba(82,61,225,.20) !important;
}

.wcab-hr-add-trigger:hover,
.wcab-hr-add-trigger:focus-visible {
  border-color: transparent !important;
  background: linear-gradient(135deg, #5842e7, #3f2cca) !important;
  color: #fff !important;
}

.wcab-hr-summary-grid {
  grid-template-columns: repeat(6, minmax(150px, 1fr));
  gap: 16px;
  margin: 22px 0 24px;
}

.wcab-hr-summary-card {
  --wcab-hr-accent: var(--wcab-v2-primary);
  --wcab-hr-soft: var(--wcab-v2-primary-soft);
  position: relative;
  min-height: 174px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  padding: 20px;
  border: 1px solid var(--wcab-v2-line);
  border-radius: 17px;
  background: #fff;
  box-shadow: var(--wcab-v2-shadow);
  overflow: hidden;
}

.wcab-hr-summary-card::after {
  content: "";
  position: absolute;
  right: -30px;
  top: -32px;
  width: 105px;
  height: 105px;
  border-radius: 50%;
  background: var(--wcab-hr-soft);
  opacity: .50;
}

.wcab-hr-summary-icon {
  position: relative;
  z-index: 1;
  width: 46px;
  height: 46px;
  margin: 0 0 16px;
  border-radius: 13px;
  background: var(--wcab-hr-soft) !important;
  color: var(--wcab-hr-accent) !important;
}

.wcab-hr-summary-icon svg {
  width: 23px;
  height: 23px;
}

.wcab-hr-summary-copy {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.wcab-hr-summary-copy small {
  min-height: 28px;
  color: var(--wcab-v2-copy);
  font-size: 11.5px;
  line-height: 1.3;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .035em;
}

.wcab-hr-summary-copy strong {
  margin: 5px 0 7px;
  color: var(--wcab-v2-ink) !important;
  font-size: 34px;
  line-height: 1;
  font-weight: 600;
}

.wcab-hr-summary-copy > span {
  color: var(--wcab-v2-muted);
  font-size: 12px;
  line-height: 1.35;
  font-weight: 400;
}

.wcab-hr-summary-purple { --wcab-hr-accent: #745cf4; --wcab-hr-soft: #eeeaff; }
.wcab-hr-summary-green { --wcab-hr-accent: #22a866; --wcab-hr-soft: #e8f8ef; }
.wcab-hr-summary-indigo { --wcab-hr-accent: #5545dc; --wcab-hr-soft: #edeaff; }
.wcab-hr-summary-cyan { --wcab-hr-accent: #21a8c8; --wcab-hr-soft: #e6f7fb; }
.wcab-hr-summary-blue { --wcab-hr-accent: #4779ed; --wcab-hr-soft: #edf3ff; }
.wcab-hr-summary-teal { --wcab-hr-accent: #1c9fb0; --wcab-hr-soft: #e7f7f8; }

.wcab-hr-card {
  border: 1px solid var(--wcab-v2-line);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 10px 30px rgba(39,53,83,.055);
}

.wcab-hr-performance-card,
.wcab-hr-applications-card {
  padding: 22px;
}

.wcab-hr-section-head {
  margin-bottom: 18px;
}

.wcab-hr-card-title h4 {
  color: var(--wcab-v2-ink) !important;
  font-size: 20px;
  font-weight: 600 !important;
}

.wcab-hr-title-icon {
  color: var(--wcab-v2-primary);
}

.wcab-hr-section-note {
  color: var(--wcab-v2-muted);
  font-size: 11px;
  font-weight: 400;
}

.wcab-hr-report-btn,
.wcab-hr-report-btn:visited {
  min-height: 40px;
  padding: 8px 13px;
  border-color: var(--wcab-v2-line);
  border-radius: 10px;
  color: #5643e8;
  font-size: 12px;
  font-weight: 600;
}

.wcab-hr-report-btn:hover {
  border-color: #cfc8ff;
  background: var(--wcab-v2-primary-soft);
  color: var(--wcab-v2-primary-dark);
}

.wcab-hr-table th,
.wcab-hr-applications-table th {
  font-size: 10.5px;
  font-weight: 600 !important;
}

.wcab-hr-table td,
.wcab-hr-applications-table td {
  color: #4c5a72;
  font-size: 12px;
  font-weight: 400;
}

.wcab-hr-person strong {
  color: #26344d !important;
  font-size: 12.5px;
  font-weight: 600 !important;
}

.wcab-hr-person small {
  color: var(--wcab-v2-muted);
  font-size: 10.5px;
  font-weight: 400;
}

.wcab-hr-status {
  padding: 5px 10px;
  border-width: 1px;
  font-size: 10px;
  font-weight: 500;
}

.wcab-hr-number-approved,
.wcab-hr-number-pending,
.wcab-hr-number-cancelled,
.wcab-hr-number-rescheduled,
.wcab-hr-number-paid,
.wcab-hr-progress strong,
.wcab-hr-last-booking strong {
  font-weight: 600 !important;
}

.wcab-hr-last-booking strong {
  color: #34425a !important;
}

.wcab-hr-last-booking small {
  color: var(--wcab-v2-muted);
  font-weight: 400;
}

.wcab-hr-progress-track {
  height: 8px;
  border-radius: 999px;
  background: #e9edf5;
}

.wcab-hr-progress-track span {
  border-radius: 999px;
  background: linear-gradient(90deg, #7058f6, #5640e7);
}

.wcab-hr-edit-btn,
.wcab-hr-delete-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  box-shadow: none;
}

.wcab-hr-edit-btn {
  background: linear-gradient(135deg, #6550f8, #4b36df);
  box-shadow: 0 7px 16px rgba(77,55,223,.18);
}

.wcab-hr-delete-btn {
  background: #f04452;
  box-shadow: 0 7px 16px rgba(240,68,82,.16);
}

.wcab-hr-current-label {
  border-radius: 9px;
  font-weight: 500;
}

.wcab-hr-definition {
  color: var(--wcab-v2-muted);
  font-size: 11px;
  font-weight: 400;
}

/* ---------- Staff modal ---------- */
.wcab-hr-modal-backdrop {
  background: rgba(26,35,55,.54);
  backdrop-filter: blur(7px);
}

.wcab-hr-modal-card {
  border-color: var(--wcab-v2-line);
  border-radius: 20px;
  box-shadow: 0 34px 90px rgba(24,34,55,.26);
}

.wcab-hr-modal-head h4 {
  color: var(--wcab-v2-ink);
  font-size: 24px;
  font-weight: 600;
}

.wcab-hr-avatar-field {
  border-color: var(--wcab-v2-line);
  background: #fafbfe;
}

.wcab-hr-avatar-field strong {
  color: #324059;
  font-weight: 600;
}

.wcab-hr-modal-card .wcab-hr-field > label,
.wcab-career-field label {
  color: #46556e;
  font-weight: 500;
}

.wcab-hr-modal-card .wcab-hr-field input,
.wcab-hr-modal-card .wcab-hr-field select,
.wcab-hr-modal-card .wcab-hr-field textarea,
.wcab-career-field input,
.wcab-career-field select,
.wcab-career-field textarea {
  border: 1px solid #dfe5ef;
  border-radius: 10px;
  color: #35435c;
  font-weight: 400;
  box-shadow: none;
}

.wcab-hr-modal-card .wcab-hr-field input:focus,
.wcab-hr-modal-card .wcab-hr-field select:focus,
.wcab-hr-modal-card .wcab-hr-field textarea:focus,
.wcab-career-field input:focus,
.wcab-career-field select:focus,
.wcab-career-field textarea:focus {
  border-color: #aa9cff;
  box-shadow: 0 0 0 4px rgba(91,69,245,.09);
}

.wcab-hr-cancel-btn,
.wcab-hr-cancel-btn:visited {
  color: #5e6d84;
  font-weight: 500;
}

/* ---------- Login interface + Remember me ---------- */
.wcab-staff-login.wcab-dashboard-panel {
  width: min(100% - 32px, 500px);
  margin: 54px auto;
  padding: 32px;
  border-radius: 22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(91,69,245,.10), transparent 32%),
    #fff;
  box-shadow: 0 24px 70px rgba(38,52,82,.13);
}

.wcab-staff-login .wcab-dashboard-head {
  margin-bottom: 23px;
  padding-bottom: 19px;
}

.wcab-staff-login h3 {
  font-size: 29px;
  font-weight: 600 !important;
}

.wcab-staff-login .wcab-dashboard-head p {
  line-height: 1.6;
}

.wcab-login-form {
  gap: 14px;
}

.wcab-login-form input[type="text"],
.wcab-login-form input[type="password"] {
  min-height: 50px;
  border: 1px solid #dde4ee;
  border-radius: 12px;
  color: #35435c;
  font-size: 14px;
  font-weight: 400;
}

.wcab-login-form input:focus {
  border-color: #aa9cff;
  box-shadow: 0 0 0 4px rgba(91,69,245,.09);
}

.wcab-login-remember {
  display: inline-flex !important;
  align-items: center;
  gap: 9px;
  margin: 1px 0 3px !important;
  color: #5d6b82 !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  cursor: pointer;
}

.wcab-login-remember input {
  width: 17px !important;
  height: 17px !important;
  min-height: 0 !important;
  margin: 0;
  accent-color: var(--wcab-v2-primary);
}

.wcab-login-form .wcab-submit {
  min-height: 50px;
  border-radius: 12px;
  background: linear-gradient(135deg, #6550f8, #4934d9);
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 12px 26px rgba(77,55,223,.22);
}

.wcab-powered-by {
  color: var(--wcab-v2-muted) !important;
  font-size: 11.5px;
  font-weight: 400;
}

/* ---------- Career application form ---------- */
.wcab-career-wrap {
  width: min(100% - 32px, 940px);
  padding: 32px;
  border-color: var(--wcab-v2-line);
  border-radius: 22px;
  background:
    radial-gradient(circle at 100% 0%, rgba(91,69,245,.075), transparent 27%),
    #fff;
  box-shadow: 0 18px 52px rgba(38,52,82,.09);
}

.wcab-career-head h2 {
  color: var(--wcab-v2-ink);
  font-weight: 600;
}

.wcab-career-field label {
  font-size: 12.5px;
}

.wcab-career-submit {
  min-height: 49px;
  border-radius: 11px;
  background: linear-gradient(135deg, #6550f8, #4a35db);
  font-weight: 600;
}

/* ---------- Public Open Positions shortcode ---------- */
.wcab-open-positions-wrap {
  width: min(100% - 32px, 1180px);
  margin: 34px auto;
  color: var(--wcab-v2-copy);
}

.wcab-open-positions-head {
  max-width: 760px;
  margin: 0 0 25px;
}

.wcab-open-positions-head h2 {
  margin: 7px 0 9px;
  font-size: clamp(29px, 4vw, 42px);
  line-height: 1.13;
}

.wcab-open-positions-head p {
  margin: 0;
  color: var(--wcab-v2-copy);
  font-size: 15px;
  line-height: 1.65;
}

.wcab-open-positions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.wcab-open-position-card {
  position: relative;
  display: grid;
  grid-template-columns: 58px minmax(0,1fr);
  gap: 17px;
  min-height: 250px;
  padding: 23px;
  border: 1px solid var(--wcab-v2-line);
  border-radius: 19px;
  background:
    radial-gradient(circle at 100% 0%, rgba(91,69,245,.07), transparent 28%),
    #fff;
  box-shadow: var(--wcab-v2-shadow);
  overflow: hidden;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.wcab-open-position-card:hover {
  transform: translateY(-3px);
  border-color: #d4ceff;
  box-shadow: var(--wcab-v2-shadow-hover);
}

.wcab-open-position-icon {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 15px;
  background: var(--wcab-v2-primary-soft);
  color: var(--wcab-v2-primary);
}

.wcab-open-position-icon svg {
  width: 25px;
  height: 25px;
}

.wcab-open-position-copy {
  min-width: 0;
  padding-right: 5px;
}

.wcab-open-position-badge {
  display: inline-flex;
  margin-bottom: 9px;
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--wcab-v2-green-soft);
  color: #168850;
  font-size: 10px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: .035em;
  text-transform: uppercase;
}

.wcab-open-position-card h3 {
  margin: 0 0 10px;
  color: var(--wcab-v2-ink);
  font-size: 21px;
  line-height: 1.25;
  font-weight: 600;
}

.wcab-open-position-description p {
  margin: 0 0 10px;
  color: var(--wcab-v2-copy);
  font-size: 13.5px;
  line-height: 1.65;
}

.wcab-open-position-apply,
.wcab-open-position-apply:visited {
  grid-column: 1 / -1;
  align-self: end;
  justify-self: start;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 10px 17px;
  border-radius: 11px;
  background: linear-gradient(135deg, #6550f8, #4b36df);
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  box-shadow: 0 9px 20px rgba(77,55,223,.18);
  transition: transform .15s ease, box-shadow .15s ease;
}

.wcab-open-position-apply svg {
  width: 17px;
  height: 17px;
  transition: transform .15s ease;
}

.wcab-open-position-apply:hover {
  transform: translateY(-1px);
  box-shadow: 0 13px 25px rgba(77,55,223,.24);
}

.wcab-open-position-apply:hover svg {
  transform: translateX(3px);
}

.wcab-open-positions-empty {
  padding: 46px 24px;
  border: 1px dashed #d8deea;
  border-radius: 19px;
  background: #fbfcfe;
  text-align: center;
}

.wcab-open-positions-empty-icon {
  width: 62px;
  height: 62px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  border-radius: 17px;
  background: var(--wcab-v2-primary-soft);
  color: var(--wcab-v2-primary);
}

.wcab-open-positions-empty-icon svg {
  width: 28px;
  height: 28px;
}

.wcab-open-positions-empty h3 {
  margin: 0 0 7px;
  font-size: 21px;
}

.wcab-open-positions-empty p {
  margin: 0;
}

/* ---------- Responsive system ---------- */
@media (max-width: 1450px) {
  .wcab-stats-grid { grid-template-columns: repeat(4, minmax(150px, 1fr)); }
  .wcab-hr-summary-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
}

@media (max-width: 1080px) {
  .wcab-dashboard-panel { padding: 23px; border-radius: 20px; }
  .wcab-dashboard-head { align-items: flex-start; flex-direction: column; }
  .wcab-dashboard-actions, .wcab-hr-top-actions { width: 100%; justify-content: flex-start; }
  .wcab-open-positions-grid { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .wcab-dashboard-panel { width: calc(100% - 20px); margin: 10px auto; padding: 17px; border-radius: 17px; }
  .wcab-dashboard-brand { min-height: 0; margin-bottom: 16px; }
  .wcab-dashboard-brand-logo { max-width: 170px; }
  .wcab-dashboard-head-identity { align-items: flex-start; min-width: 0; }
  .wcab-current-staff-avatar { width: 54px; height: 54px; }
  .wcab-dashboard-head h3, .wcab-dashboard-head .wcab-dashboard-main-heading { font-size: 26px; }
  .wcab-dashboard-actions .wcab-refresh-btn,
  .wcab-dashboard-actions .wcab-clear-btn,
  .wcab-dashboard-actions .wcab-notify-bell { flex: 1 1 auto; }
  .wcab-notify-bell { flex: 0 0 48px !important; }
  .wcab-stats-grid, .wcab-hr-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .wcab-stat-card, .wcab-hr-summary-card { min-height: 165px; padding: 16px; }
  .wcab-stat-card strong, .wcab-hr-summary-copy strong { font-size: 30px; }
  .wcab-filter-form { padding: 15px; }
  .wcab-filter-actions { width: 100%; margin-left: 0; }
  .wcab-filter-actions > * { flex: 1; }
  .wcab-hr-report-actions { width: 100%; justify-content: flex-start; }
  .wcab-open-position-card { grid-template-columns: 48px minmax(0,1fr); padding: 18px; }
  .wcab-open-position-icon { width: 46px; height: 46px; }
}

@media (max-width: 480px) {
  .wcab-stats-grid, .wcab-hr-summary-grid { grid-template-columns: 1fr; }
  .wcab-stat-card, .wcab-hr-summary-card { min-height: 150px; }
  .wcab-dashboard-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .wcab-dashboard-actions .wcab-notify-bell { grid-column: auto; justify-self: start; }
  .wcab-dashboard-actions .wcab-calendar-toggle-btn { min-width: 0; }
  .wcab-open-position-card { grid-template-columns: 1fr; }
  .wcab-open-position-apply { grid-column: 1; width: 100%; justify-content: center; box-sizing: border-box; }
  .wcab-career-wrap { width: calc(100% - 20px); padding: 18px; }
}

@media print {
  .wcab-dashboard-panel,
  .wcab-hr-card {
    box-shadow: none !important;
    background: #fff !important;
  }
}

/* Final alignment safeguards for legacy HR grid declarations. */
.wcab-hr-summary-icon { align-self: flex-start; }
.wcab-hr-summary-copy { align-self: stretch; }

/* Lighter typography pass across the booking and customer-facing widgets. */
.wcab-wrapper h2,
.wcab-wrapper h3,
.wcab-wrapper h4,
.wcab-customer-panel h2,
.wcab-customer-panel h3,
.wcab-booking-lookup h2,
.wcab-booking-lookup h3 {
  color: var(--wcab-v2-ink) !important;
  font-weight: 600 !important;
}

.wcab-wrapper label,
.wcab-customer-panel label,
.wcab-booking-lookup label,
.wcab-panel label {
  color: #46556e;
  font-weight: 500 !important;
}

.wcab-wrapper strong,
.wcab-customer-panel strong,
.wcab-booking-lookup strong {
  color: #2c3a53;
  font-weight: 600 !important;
}

.wcab-wrapper button,
.wcab-wrapper .wcab-submit,
.wcab-wrapper .wcab-next,
.wcab-wrapper .wcab-prev,
.wcab-customer-panel button,
.wcab-booking-lookup button {
  font-weight: 600 !important;
}

/* =========================================================
   WebCarry v2.0.1 — Professional UI refinement pass
   Softer Segoe UI typography, semantic controls, calendar,
   HR, applications, responsive action menus and booking flow.
========================================================= */

/* One type system throughout every public/plugin-owned surface. */
.wcab-wrapper,
.wcab-wrapper *,
.wcab-dashboard-panel,
.wcab-dashboard-panel *,
.wcab-staff-login,
.wcab-staff-login *,
.wcab-booking-lookup,
.wcab-booking-lookup *,
.wcab-customer-panel,
.wcab-customer-panel *,
.wcab-career-wrap,
.wcab-career-wrap *,
.wcab-open-positions-wrap,
.wcab-open-positions-wrap *,
.wcab-mini-calendar-wrap,
.wcab-mini-calendar-wrap *,
.wcab-day-appts-modal,
.wcab-day-appts-modal *,
.wcab-action-modal,
.wcab-action-modal *,
.wcab-reason-modal,
.wcab-reason-modal *,
.wcab-confirmation-modal,
.wcab-confirmation-modal *,
.wcab-success-modal,
.wcab-success-modal *,
.wcab-hr-staff-modal,
.wcab-hr-staff-modal * {
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
}

body.toplevel_page_wcab-bookings .wrap,
body.toplevel_page_wcab-bookings input,
body.toplevel_page_wcab-bookings select,
body.toplevel_page_wcab-bookings textarea,
body.toplevel_page_wcab-bookings button,
body.toplevel_page_wcab-bookings table,
body[class*="_page_wcab-"] .wrap,
body[class*="_page_wcab-"] input,
body[class*="_page_wcab-"] select,
body[class*="_page_wcab-"] textarea,
body[class*="_page_wcab-"] button,
body[class*="_page_wcab-"] table {
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
}

/* Accent values now visually belong to their cards instead of looking black/heavy. */
.wcab-stat-card strong {
  color: var(--wcab-stat-accent) !important;
  font-weight: 600 !important;
}

.wcab-hr-summary-copy strong {
  color: var(--wcab-hr-accent) !important;
  font-weight: 600 !important;
}

.wcab-stat-label,
.wcab-hr-summary-copy small {
  font-weight: 500 !important;
}

/* Softer table/copy hierarchy across Workforce and HR. */
.wcab-dashboard-panel .wcab-table td strong,
.wcab-hr-panel .wcab-table td strong,
.wcab-hr-applications-table td > strong,
.wcab-hr-person strong,
.wcab-hr-last-booking strong,
.wcab-hr-progress strong,
.wcab-hr-number-approved,
.wcab-hr-number-pending,
.wcab-hr-number-cancelled,
.wcab-hr-number-rescheduled,
.wcab-hr-number-paid {
  font-weight: 500 !important;
}

.wcab-dashboard-panel .wcab-table td,
.wcab-hr-panel .wcab-table td,
.wcab-dashboard-panel .wcab-table th,
.wcab-hr-panel .wcab-table th {
  color: #52617a;
}

.wcab-dashboard-panel .wcab-table th,
.wcab-hr-panel .wcab-table th {
  font-weight: 500 !important;
}

.wcab-label-chip,
.wcab-status-badge,
.wcab-gcal-link,
.wcab-sort-link {
  font-weight: 500 !important;
}

/* Modern export controls: text and icon share the semantic color. */
.wcab-export-actions {
  gap: 12px;
}

.wcab-export-btn {
  min-height: 42px;
  padding: 9px 15px;
  border-width: 1px;
  border-radius: 11px;
  background: #fff;
  font-size: 12.5px;
  font-weight: 500 !important;
  box-shadow: 0 5px 14px rgba(39,53,83,.045);
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}

.wcab-export-pdf-btn {
  border-color: #ffd2d7;
  background: #fffafb;
  color: #dc3b49;
}

.wcab-export-excel-btn {
  border-color: #ccebdc;
  background: #fbfffd;
  color: #178a52;
}

.wcab-export-pdf-btn:hover,
.wcab-export-pdf-btn:focus-visible {
  border-color: #ffb9c1;
  background: #ffedef;
  color: #c92f3e;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(220,59,73,.12);
}

.wcab-export-excel-btn:hover,
.wcab-export-excel-btn:focus-visible {
  border-color: #a9dec4;
  background: #eaf8f0;
  color: #117844;
  transform: translateY(-2px);
  box-shadow: 0 10px 22px rgba(23,138,82,.12);
}

/* Bulk selection toolbar and controls. */
.wcab-bulk-toolbar {
  gap: 9px;
  padding: 12px 14px;
  border: 1px solid #d9d3ff;
  border-radius: 14px;
  background: linear-gradient(135deg, #f7f5ff, #f2f5ff);
  box-shadow: 0 7px 20px rgba(73,55,218,.06);
}

.wcab-bulk-count {
  color: #4f3fd2;
  font-weight: 600 !important;
}

.wcab-bulk-btn {
  min-height: 38px;
  padding: 8px 14px;
  border-width: 1px;
  border-color: #e0e5ee;
  border-radius: 999px;
  background: #fff;
  color: #596780;
  font-size: 12px;
  font-weight: 500 !important;
  box-shadow: 0 4px 12px rgba(39,53,83,.04);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}

.wcab-bulk-btn:hover,
.wcab-bulk-btn:focus-visible {
  transform: translateY(-1px);
  border-color: #cbc4ff;
  background: #f0edff;
  color: #4b38dd;
  box-shadow: 0 8px 18px rgba(75,56,221,.10);
}

.wcab-bulk-btn[data-bulk-action="mark_read"] {
  border-color: #cae9d9;
  color: #178a52;
}

.wcab-bulk-btn[data-bulk-action="mark_read"]:hover,
.wcab-bulk-btn[data-bulk-action="mark_read"]:focus-visible {
  border-color: #a9dec4;
  background: #eaf8f0;
  color: #117844;
}

.wcab-bulk-btn[data-bulk-action="mark_unread"],
.wcab-bulk-label-toggle {
  border-color: #d7d1ff;
  color: #5542df;
}

.wcab-bulk-btn[data-bulk-action="mark_unread"]:hover,
.wcab-bulk-btn[data-bulk-action="mark_unread"]:focus-visible,
.wcab-bulk-label-toggle:hover,
.wcab-bulk-label-toggle:focus-visible {
  border-color: #bdb3ff;
  background: #f0edff;
  color: #4432cc;
}

.wcab-bulk-btn[data-bulk-action="download"] {
  border-color: #cddcff;
  color: #3568d8;
}

.wcab-bulk-btn[data-bulk-action="download"]:hover,
.wcab-bulk-btn[data-bulk-action="download"]:focus-visible {
  border-color: #adc5ff;
  background: #edf3ff;
  color: #2857bc;
}

.wcab-bulk-btn-danger {
  border-color: #ffd1d6 !important;
  background: #fffafb !important;
  color: #dc3b49 !important;
}

.wcab-bulk-btn-danger:hover,
.wcab-bulk-btn-danger:focus-visible {
  border-color: #ffb7bf !important;
  background: #ffedef !important;
  color: #c92f3e !important;
}

/* Workforce action control: neutral modern vertical dots, same popup behaviour. */
.wcab-action-icon-btn,
.wcab-action-open-btn,
.wcab-action-open-btn:not(:hover):not(:focus-visible) {
  width: 42px;
  height: 42px;
  border: 1px solid #dfe5ee;
  border-radius: 12px;
  background: #fff !important;
  color: #596984 !important;
  box-shadow: 0 5px 14px rgba(39,53,83,.055) !important;
}

.wcab-action-open-btn:hover,
.wcab-action-open-btn:focus-visible,
.wcab-action-open-btn[data-hover-effect]:hover,
.wcab-action-open-btn[data-hover-effect]:focus-visible {
  border-color: #c8c0ff;
  background: #f0edff !important;
  color: #4b38dd !important;
  transform: translateY(-2px) !important;
  filter: none !important;
  animation: none !important;
  box-shadow: 0 11px 24px rgba(75,56,221,.14) !important;
}

.wcab-action-open-btn:active {
  transform: translateY(0) scale(.97) !important;
}

.wcab-action-kebab {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  width: 14px;
  height: 22px;
  pointer-events: none;
}

.wcab-action-kebab > span {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
}

/* HR header actions use semantic accent colors and consistent dimensions. */
.wcab-hr-top-btn,
.wcab-hr-top-btn:visited,
.wcab-hr-top-btn:not(:hover):not(:focus-visible) {
  min-height: 46px;
  padding: 10px 16px;
  border-width: 1px !important;
  border-radius: 12px;
  background: #fff !important;
  font-size: 12.5px;
  font-weight: 500 !important;
  box-shadow: 0 5px 14px rgba(39,53,83,.045) !important;
}

.wcab-hr-bookings-btn,
.wcab-hr-bookings-btn:visited,
.wcab-hr-bookings-btn:not(:hover):not(:focus-visible) {
  border-color: #cddcff !important;
  color: #3568d8 !important;
}
.wcab-hr-bookings-btn:hover,
.wcab-hr-bookings-btn:focus-visible {
  border-color: #adc5ff !important;
  background: #edf3ff !important;
  color: #2857bc !important;
}

.wcab-hr-refresh-btn,
.wcab-hr-refresh-btn:visited,
.wcab-hr-refresh-btn:not(:hover):not(:focus-visible) {
  border-color: #d7d1ff !important;
  color: #5542df !important;
}
.wcab-hr-refresh-btn:hover,
.wcab-hr-refresh-btn:focus-visible {
  border-color: #bdb3ff !important;
  background: #f0edff !important;
  color: #4432cc !important;
}

.wcab-hr-add-trigger,
.wcab-hr-add-trigger:visited,
.wcab-hr-add-trigger:not(:hover):not(:focus-visible) {
  border-color: #cae9d9 !important;
  background: #fbfffd !important;
  color: #178a52 !important;
  box-shadow: 0 5px 14px rgba(23,138,82,.055) !important;
}
.wcab-hr-add-trigger:hover,
.wcab-hr-add-trigger:focus-visible {
  border-color: #a9dec4 !important;
  background: #eaf8f0 !important;
  color: #117844 !important;
  box-shadow: 0 10px 22px rgba(23,138,82,.12) !important;
}

.wcab-hr-applications-btn,
.wcab-hr-applications-btn:visited,
.wcab-hr-applications-btn:not(:hover):not(:focus-visible) {
  border-color: #c8e8ef !important;
  color: #1789a2 !important;
}
.wcab-hr-applications-btn:hover,
.wcab-hr-applications-btn:focus-visible {
  border-color: #9fd7e2 !important;
  background: #e8f8fc !important;
  color: #0f748c !important;
}

.wcab-hr-top-btn:hover,
.wcab-hr-top-btn:focus-visible {
  transform: translateY(-2px);
}

/* HR report controls. */
.wcab-hr-report-btn,
.wcab-hr-report-btn:visited {
  font-weight: 500 !important;
  background: #fff;
  box-shadow: 0 4px 12px rgba(39,53,83,.04);
}

.wcab-hr-report-pdf,
.wcab-hr-report-pdf:visited {
  border-color: #ffd2d7;
  color: #dc3b49;
}
.wcab-hr-report-pdf:hover,
.wcab-hr-report-pdf:focus-visible {
  border-color: #ffb9c1;
  background: #ffedef;
  color: #c92f3e;
  transform: translateY(-1px);
}

.wcab-hr-report-print,
.wcab-hr-report-print:visited {
  border-color: #cddcff;
  color: #3568d8;
}
.wcab-hr-report-print:hover,
.wcab-hr-report-print:focus-visible {
  border-color: #adc5ff;
  background: #edf3ff;
  color: #2857bc;
  transform: translateY(-1px);
}

/* HR row actions: tinted at rest, solid only on hover. */
.wcab-hr-edit-btn,
.wcab-hr-edit-btn:visited {
  border: 1px solid #d8d1ff;
  background: #f0edff;
  color: #5542df;
  box-shadow: none;
}

.wcab-hr-edit-btn:hover,
.wcab-hr-edit-btn:focus-visible {
  border-color: #5542df;
  background: #5542df;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 9px 18px rgba(85,66,223,.18);
}

.wcab-hr-delete-btn {
  border: 1px solid #ffd2d7;
  background: #ffedef;
  color: #dc3b49;
  box-shadow: none;
}

.wcab-hr-delete-btn:hover,
.wcab-hr-delete-btn:focus-visible {
  border-color: #dc3b49;
  background: #dc3b49;
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 9px 18px rgba(220,59,73,.17);
}

/* Job Applications: lighter copy and modern semantic controls. */
.wcab-hr-applications-table td > strong {
  color: #34425a !important;
  font-weight: 500 !important;
}

.wcab-hr-resume-btn,
.wcab-hr-resume-btn:visited {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  padding: 7px 11px;
  border: 1px solid #d7d1ff;
  border-radius: 9px;
  background: #f7f5ff;
  color: #5542df;
  font-size: 11.5px;
  font-weight: 500 !important;
  box-shadow: 0 4px 11px rgba(75,56,221,.055);
}

.wcab-hr-resume-btn:hover,
.wcab-hr-resume-btn:focus-visible {
  border-color: #bdb3ff;
  background: #f0edff;
  color: #4432cc;
  transform: translateY(-1px);
}

.wcab-hr-application-details summary {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid #cddcff;
  border-radius: 9px;
  background: #f8faff;
  color: #3568d8;
  font-size: 11.5px;
  font-weight: 500 !important;
  list-style: none;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}

.wcab-hr-application-details summary::-webkit-details-marker { display: none; }
.wcab-hr-application-details summary::before {
  content: "›";
  margin-right: 6px;
  font-size: 16px;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform .15s ease;
}
.wcab-hr-application-details[open] summary::before { transform: rotate(90deg); }
.wcab-hr-application-details summary:hover,
.wcab-hr-application-details summary:focus-visible {
  border-color: #adc5ff;
  background: #edf3ff;
  color: #2857bc;
  transform: translateY(-1px);
}

.wcab-hr-application-details div strong {
  color: #46556e !important;
  font-weight: 500 !important;
}

.wcab-hr-app-status-form select,
.wcab-hr-app-status-form textarea {
  border-color: #dfe5ee;
  border-radius: 9px;
  color: #4c5a72;
  font-weight: 400;
}

.wcab-hr-app-save-btn {
  min-height: 38px;
  padding: 8px 15px !important;
  border: 1px solid #d7d1ff !important;
  border-radius: 9px !important;
  background: #f0edff !important;
  color: #5542df !important;
  font-size: 12px;
  font-weight: 500 !important;
  box-shadow: none;
  transition: transform .15s ease, background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}

.wcab-hr-app-save-btn:hover,
.wcab-hr-app-save-btn:focus-visible {
  border-color: #5542df !important;
  background: #5542df !important;
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 9px 18px rgba(85,66,223,.17);
}

/* Calendar View, calendar dates, events and appointment popup. */
.wcab-mini-calendar-wrap,
.wcab-calendar-area {
  color: #52617a;
}

.wcab-mini-calendar-wrap .fc,
.wcab-mini-calendar-wrap .fc *,
.wcab-calendar .fc,
.wcab-calendar .fc * {
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
}

.wcab-mini-calendar-wrap .fc .fc-toolbar-title,
.wcab-calendar .fc .fc-toolbar-title {
  color: #26344d;
  font-size: 20px;
  font-weight: 600 !important;
  letter-spacing: -.01em;
}

.wcab-mini-calendar-wrap .fc .fc-button,
.wcab-calendar .fc .fc-button {
  border-color: #dfe5ee;
  border-radius: 9px;
  background: #fff;
  color: #52617a;
  font-size: 12px;
  font-weight: 500 !important;
  box-shadow: none;
  text-transform: none;
}

.wcab-mini-calendar-wrap .fc .fc-button:hover,
.wcab-mini-calendar-wrap .fc .fc-button:focus,
.wcab-calendar .fc .fc-button:hover,
.wcab-calendar .fc .fc-button:focus {
  border-color: #c8c0ff;
  background: #f0edff;
  color: #4b38dd;
  box-shadow: none;
}

.wcab-mini-calendar-wrap .fc .fc-col-header-cell-cushion,
.wcab-calendar .fc .fc-col-header-cell-cushion {
  color: #64738c;
  font-size: 11.5px;
  font-weight: 500 !important;
  text-decoration: none;
}

.wcab-mini-calendar-wrap .fc .fc-daygrid-day-number,
.wcab-calendar .fc .fc-daygrid-day-number {
  color: #52617a;
  font-size: 12px;
  font-weight: 400 !important;
  text-decoration: none;
}

.wcab-mini-calendar-wrap .fc .fc-event,
.wcab-mini-calendar-wrap .fc .fc-event-title,
.wcab-calendar .fc .fc-event,
.wcab-calendar .fc .fc-event-title {
  font-size: 10.5px;
  font-weight: 500 !important;
}

.wcab-cal-day-badge {
  font-weight: 500 !important;
  box-shadow: 0 5px 12px rgba(75,56,221,.18);
}

.wcab-day-appts-modal {
  backdrop-filter: blur(6px);
}

.wcab-day-appts-modal-inner {
  border: 1px solid #e2e7ef;
  border-radius: 18px;
  box-shadow: 0 30px 80px rgba(26,35,55,.24);
}

.wcab-day-appts-modal-head h3 {
  color: #26344d;
  font-size: 20px;
  font-weight: 600 !important;
}

.wcab-day-appts-modal-close {
  color: #738096;
  font-weight: 400 !important;
}

.wcab-day-appts-staff-group h4 {
  color: #3568d8;
  font-size: 14px;
  font-weight: 500 !important;
  border-bottom-color: #e6edff;
}

.wcab-day-appts-staff-group li,
.wcab-day-appts-staff-group li strong {
  color: #46546c;
  font-weight: 400 !important;
}

/* Booking wizard Back button, Your Selection and modern summary icons. */
.wcab-btn-secondary,
.wcab-btn-secondary:visited,
.wcab-step-back,
.wcab-step-back:visited {
  border-color: #dfe5ee !important;
  background: #f8f9fc !important;
  color: #5c6b83 !important;
  font-weight: 500 !important;
  box-shadow: none !important;
}

.wcab-btn-secondary:hover:not(:disabled),
.wcab-btn-secondary:focus-visible:not(:disabled),
.wcab-step-back:hover:not(:disabled),
.wcab-step-back:focus-visible:not(:disabled) {
  border-color: #c8c0ff !important;
  background: #f0edff !important;
  color: #4b38dd !important;
  box-shadow: 0 8px 18px rgba(75,56,221,.10) !important;
}

.wcab-btn-secondary:disabled,
.wcab-step-back:disabled {
  border-color: #e4e8ef !important;
  background: #f2f4f8 !important;
  color: #9aa5b6 !important;
  opacity: 1;
}

.wcab-rich-summary-card .wcab-summary-kicker {
  color: #52617a !important;
  font-size: 18px !important;
  line-height: 1.25;
  font-weight: 500 !important;
}

.wcab-rich-summary-card [data-summary="employee"] {
  color: #6b7890 !important;
  font-size: 15px;
  font-weight: 400 !important;
}

.wcab-rich-summary-card h3 {
  color: #26344d !important;
  font-weight: 600 !important;
}

.wcab-rich-summary-item {
  grid-template-columns: 36px minmax(0,1fr);
  gap: 10px;
  align-items: center;
}

.wcab-rich-summary-item strong {
  color: #3f4d66 !important;
  font-weight: 500 !important;
}

.wcab-rich-icon {
  width: 34px;
  height: 34px;
  border: 1px solid #ddd8ff;
  border-radius: 11px;
  background: #f0edff;
  color: #5542df;
  box-shadow: 0 7px 16px rgba(75,56,221,.09);
}

.wcab-rich-icon svg {
  width: 17px;
  height: 17px;
  stroke-width: 1.8;
}

.wcab-rich-icon-calendar {
  border-color: #cddcff;
  background: #edf3ff;
  color: #3568d8;
}

.wcab-rich-icon-target {
  border-color: #c8e8ef;
  background: #e8f8fc;
  color: #1789a2;
}

.wcab-rich-icon-location {
  border-color: #cae9d9;
  background: #eaf8f0;
  color: #178a52;
}

.wcab-rich-icon-payment {
  border-color: #ffe0b8;
  background: #fff4e4;
  color: #d87b0e;
}

/* Mobile controls: HR Management always matches its siblings. */
@media (max-width: 760px) {
  .wcab-dashboard-actions .wcab-refresh-btn,
  .wcab-dashboard-actions .wcab-clear-btn,
  .wcab-dashboard-actions .wcab-hr-management-btn,
  .wcab-hr-top-actions .wcab-hr-top-btn {
    min-width: 0 !important;
    min-height: 44px !important;
    height: 44px;
    padding: 9px 11px !important;
    border-radius: 11px !important;
    font-size: 12px !important;
    line-height: 1.1;
    white-space: nowrap;
  }

  .wcab-dashboard-actions .wcab-btn-label,
  .wcab-hr-top-actions .wcab-btn-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 480px) {
  .wcab-dashboard-actions .wcab-refresh-btn,
  .wcab-dashboard-actions .wcab-clear-btn,
  .wcab-dashboard-actions .wcab-hr-management-btn,
  .wcab-hr-top-actions .wcab-hr-top-btn {
    width: 100%;
    flex: none !important;
    font-size: 11.5px !important;
  }

  .wcab-hr-primary-nav,
  .wcab-hr-management-btn {
    grid-column: auto !important;
  }

  .wcab-bulk-toolbar {
    align-items: stretch;
  }

  .wcab-bulk-btn {
    flex: 1 1 calc(50% - 8px);
    text-align: center;
  }
}

/* =========================================================
   WebCarry v2.0.2 — interaction, calendar and reassignment pass
========================================================= */

/* Keep mouse/touch clicks from getting stuck in keyboard-focus styling. */
.wcab-wrapper button:focus:not(:focus-visible),
.wcab-wrapper a:focus:not(:focus-visible),
.wcab-dashboard-panel button:focus:not(:focus-visible),
.wcab-dashboard-panel a:focus:not(:focus-visible),
.wcab-staff-login button:focus:not(:focus-visible),
.wcab-career-wrap button:focus:not(:focus-visible),
.wcab-career-wrap a:focus:not(:focus-visible),
.wcab-open-positions-wrap button:focus:not(:focus-visible),
.wcab-open-positions-wrap a:focus:not(:focus-visible),
.wcab-dashboard-panel input[type="checkbox"]:focus:not(:focus-visible),
.wcab-staff-login input[type="checkbox"]:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none;
}

/* Accessible custom dashboard checkboxes without the persistent outer rectangle. */
.wcab-dashboard-panel input[type="checkbox"].wcab-row-select,
.wcab-dashboard-panel input[type="checkbox"].wcab-select-all {
  width: 17px !important;
  height: 17px !important;
  margin: 0 !important;
  border: 1.5px solid #b9c4d5 !important;
  border-radius: 5px !important;
  background: #fff;
  accent-color: #5b45ed;
  box-shadow: none !important;
  vertical-align: middle;
  cursor: pointer;
}
.wcab-dashboard-panel input[type="checkbox"].wcab-row-select:checked,
.wcab-dashboard-panel input[type="checkbox"].wcab-select-all:checked {
  border-color: #5b45ed !important;
}
.wcab-dashboard-panel input[type="checkbox"].wcab-row-select:focus-visible,
.wcab-dashboard-panel input[type="checkbox"].wcab-select-all:focus-visible {
  outline: 2px solid rgba(91,69,237,.24) !important;
  outline-offset: 3px;
  box-shadow: none !important;
}

/* Buttons retain their semantic resting colors after a click. */
.wcab-export-pdf-btn:focus:not(:focus-visible),
.wcab-export-pdf-btn:active {
  border-color: #ffd2d7 !important;
  background: #fffafb !important;
  color: #dc3b49 !important;
  transform: none;
}
.wcab-export-excel-btn:focus:not(:focus-visible),
.wcab-export-excel-btn:active {
  border-color: #ccebdc !important;
  background: #fbfffd !important;
  color: #178a52 !important;
  transform: none;
}
.wcab-bulk-btn:focus:not(:focus-visible),
.wcab-bulk-btn:active {
  border-color: #e0e5ee !important;
  background: #fff !important;
  color: #596780 !important;
  transform: none;
  box-shadow: 0 4px 12px rgba(39,53,83,.04) !important;
}
.wcab-bulk-btn[data-bulk-action="mark_read"]:focus:not(:focus-visible),
.wcab-bulk-btn[data-bulk-action="mark_read"]:active {
  border-color: #ccebdc !important;
  background: #fbfffd !important;
  color: #178a52 !important;
}
.wcab-bulk-btn[data-bulk-action="mark_unread"]:focus:not(:focus-visible),
.wcab-bulk-btn[data-bulk-action="mark_unread"]:active,
.wcab-bulk-btn[data-bulk-action="download"]:focus:not(:focus-visible),
.wcab-bulk-btn[data-bulk-action="download"]:active,
.wcab-bulk-label-toggle:focus:not(:focus-visible),
.wcab-bulk-label-toggle:active {
  border-color: #d7d1ff !important;
  background: #f7f5ff !important;
  color: #5542df !important;
}
.wcab-bulk-btn-danger:focus:not(:focus-visible),
.wcab-bulk-btn-danger:active {
  border-color: #ffd2d7 !important;
  background: #fffafb !important;
  color: #dc3b49 !important;
}
.wcab-filter-btn:focus:not(:focus-visible),
.wcab-filter-btn:active {
  color: #fff !important;
  background: linear-gradient(135deg, #6550f8, #4b36df) !important;
  transform: none;
}

/* Appointment action dialog: larger readable type and softer ink. */
.wcab-action-modal-card {
  color: #46546c !important;
  font-size: 15px;
  line-height: 1.55;
}
.wcab-action-modal-head span {
  color: #4e3be0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: .06em;
}
.wcab-action-modal-head strong {
  color: #27344d !important;
  font-size: 27px !important;
  line-height: 1.18;
  font-weight: 600 !important;
}
.wcab-action-modal-head small,
.wcab-action-modal-booking-id,
.wcab-inline-help {
  color: #66758e !important;
  font-size: 13px !important;
  line-height: 1.5;
  font-weight: 400 !important;
}
.wcab-action-modal .wcab-inline-label {
  color: #3f4d65 !important;
  font-size: 14.5px !important;
  line-height: 1.35;
  font-weight: 600 !important;
}
.wcab-action-modal select,
.wcab-action-modal input,
.wcab-action-modal textarea {
  color: #35445c !important;
  font-size: 15px !important;
  font-weight: 400 !important;
}

/* Admin-only reassignment workflow. */
.wcab-reassign-section {
  margin: 18px 0 16px;
  padding: 15px;
  border: 1px solid #dcd7ff;
  border-radius: 14px;
  background: linear-gradient(135deg, #faf9ff, #f5f7ff);
}
.wcab-reassign-heading {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 13px;
}
.wcab-reassign-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #d3ccff;
  border-radius: 12px;
  background: #eeeaff;
  color: #5944e9;
}
.wcab-reassign-icon svg { width: 20px; height: 20px; }
.wcab-reassign-heading strong {
  display: block;
  color: #34425a !important;
  font-size: 14px;
  font-weight: 600 !important;
}
.wcab-reassign-heading small {
  display: block;
  margin-top: 2px;
  color: #718098 !important;
  font-size: 12.5px !important;
  font-weight: 400 !important;
}
.wcab-reassign-staff-select { margin-bottom: 10px; }
.wcab-reassign-staff-select option:disabled { color: #9aa5b5; }
.wcab-reassignment-note { min-height: 68px; resize: vertical; }

/* Zoom helper: official scheduling shortcut plus a modern video icon. */
.wcab-zoom-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 17px;
}
.wcab-zoom-label-row .wcab-inline-label { margin: 0 !important; }
.wcab-zoom-create-btn,
.wcab-zoom-create-btn:visited {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  border: 1px solid #bfd7ff;
  border-radius: 10px;
  background: #f2f7ff;
  color: #2d66d7 !important;
  font-size: 12px;
  font-weight: 500 !important;
  text-decoration: none !important;
  white-space: nowrap;
  box-shadow: 0 5px 13px rgba(45,102,215,.07);
  transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.wcab-zoom-create-btn:hover,
.wcab-zoom-create-btn:focus-visible {
  border-color: #8eb8ff;
  background: #e7f0ff;
  color: #2458be !important;
  transform: translateY(-1px);
  box-shadow: 0 9px 18px rgba(45,102,215,.13);
}
.wcab-zoom-logo { width: 20px; height: 20px; display: inline-flex; color: #2d66d7; }
.wcab-zoom-logo svg { width: 20px; height: 20px; }
.wcab-zoom-field-group {
  margin-top: 8px;
  border-color: #dbe4f2 !important;
  background: #fbfcff !important;
}
.wcab-zoom-input-icon {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #2d66d7;
}
.wcab-zoom-input-icon svg { width: 19px; height: 19px; }

/* Professional bell matching the purple dashboard system. */
.wcab-notify-bell {
  width: 50px !important;
  height: 50px !important;
  flex: 0 0 50px !important;
  border: 1px solid #d9d3ff !important;
  border-radius: 15px !important;
  background: linear-gradient(145deg, #fbfaff, #f0edff) !important;
  color: #5542df !important;
  box-shadow: 0 8px 20px rgba(75,56,221,.09) !important;
  transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease !important;
}
.wcab-notify-bell:hover,
.wcab-notify-bell:focus-visible {
  border-color: #bdb3ff !important;
  background: linear-gradient(145deg, #f5f2ff, #e9e4ff) !important;
  color: #4633cf !important;
  transform: translateY(-2px);
  box-shadow: 0 13px 26px rgba(75,56,221,.15) !important;
}
.wcab-notify-bell:focus:not(:focus-visible),
.wcab-notify-bell:active {
  border-color: #d9d3ff !important;
  background: linear-gradient(145deg, #fbfaff, #f0edff) !important;
  color: #5542df !important;
  transform: none;
}
.wcab-bell-icon {
  width: 27px;
  height: 27px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.wcab-bell-icon svg { width: 25px !important; height: 25px !important; }
.wcab-notify-count {
  top: -5px !important;
  right: -5px !important;
  min-width: 20px !important;
  height: 20px !important;
  border: 2px solid #fff;
  background: #f04458 !important;
  font-size: 10px !important;
  font-weight: 600 !important;
}

/* FullCalendar navigation: modern round arrow controls. */
.wcab-mini-calendar-wrap .fc .fc-prev-button,
.wcab-mini-calendar-wrap .fc .fc-next-button,
.wcab-calendar .fc .fc-prev-button,
.wcab-calendar .fc .fc-next-button {
  width: 38px;
  min-width: 38px;
  height: 36px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border-color: #d8d3ff !important;
  border-radius: 10px !important;
  background: #f7f5ff !important;
  color: #5542df !important;
}
.wcab-mini-calendar-wrap .fc .fc-prev-button .fc-icon,
.wcab-mini-calendar-wrap .fc .fc-next-button .fc-icon,
.wcab-calendar .fc .fc-prev-button .fc-icon,
.wcab-calendar .fc .fc-next-button .fc-icon {
  display: none !important;
}
.wcab-mini-calendar-wrap .fc .fc-prev-button::before,
.wcab-mini-calendar-wrap .fc .fc-next-button::before,
.wcab-calendar .fc .fc-prev-button::before,
.wcab-calendar .fc .fc-next-button::before {
  content: "";
  width: 17px;
  height: 17px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
}
.wcab-mini-calendar-wrap .fc .fc-prev-button::before,
.wcab-calendar .fc .fc-prev-button::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235542df' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E");
}
.wcab-mini-calendar-wrap .fc .fc-next-button::before,
.wcab-calendar .fc .fc-next-button::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235542df' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E");
}
.wcab-mini-calendar-wrap .fc .fc-prev-button:hover,
.wcab-mini-calendar-wrap .fc .fc-next-button:hover,
.wcab-calendar .fc .fc-prev-button:hover,
.wcab-calendar .fc .fc-next-button:hover {
  border-color: #bcb2ff !important;
  background: #ece8ff !important;
  transform: translateY(-1px);
}

/* Labels use the same calm semantic palette rather than red text. */
.wcab-label-picker,
.wcab-bulk-label-menu {
  padding: 7px !important;
  border: 1px solid #e0e4ed !important;
  border-radius: 13px !important;
  background: #fff !important;
  box-shadow: 0 18px 40px rgba(31,43,68,.16) !important;
}
.wcab-label-picker button,
.wcab-bulk-label-option {
  min-height: 36px;
  border: 0 !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: #52617a !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  text-align: left;
}
.wcab-label-picker button::before,
.wcab-bulk-label-option::before {
  box-shadow: 0 0 0 3px rgba(85,66,223,.10);
}
.wcab-label-picker button:hover,
.wcab-label-picker button:focus-visible,
.wcab-bulk-label-option:hover,
.wcab-bulk-label-option:focus-visible {
  background: #f5f3ff !important;
  color: #4633cf !important;
}

/* Staff filter names use softer charcoal instead of full black. */
.wcab-staff-filter-option-name,
.wcab-staff-filter-toggle-label {
  color: #34425a !important;
  font-weight: 500 !important;
}
.wcab-staff-filter-option-designation {
  color: #78869b !important;
  font-weight: 400 !important;
}
.wcab-staff-filter-option:hover .wcab-staff-filter-option-name,
.wcab-staff-filter-option:focus-visible .wcab-staff-filter-option-name {
  color: #4b38dd !important;
}

/* Selected rows stay clear without a harsh focus rectangle. */
.wcab-dashboard-panel .wcab-table tr:has(.wcab-row-select:checked) td {
  background: rgba(91,69,237,.045);
}

@media (max-width: 640px) {
  .wcab-zoom-label-row { align-items: flex-start; flex-direction: column; }
  .wcab-zoom-create-btn { width: 100%; justify-content: center; box-sizing: border-box; }
  .wcab-action-modal-head strong { font-size: 23px !important; }
  .wcab-action-modal-card { font-size: 14.5px; }
}

.wcab-notify-bell.wcab-notify-active {
  border-color: #5542df !important;
  background: linear-gradient(145deg, #6651f3, #4b37dc) !important;
  color: #fff !important;
  box-shadow: 0 12px 25px rgba(75,56,221,.20) !important;
}
.wcab-notify-bell.wcab-notify-active:hover,
.wcab-notify-bell.wcab-notify-active:focus-visible {
  border-color: #4935d2 !important;
  background: linear-gradient(145deg, #5d48ec, #4430cf) !important;
  color: #fff !important;
}

/* WordPress-admin Calendar View uses the same navigation language. */
.wcab-admin-calendar-wrap .fc,
.wcab-admin-calendar-wrap .fc * {
  font-family: "Segoe UI", SegoeUI, -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif !important;
}
.wcab-admin-calendar-wrap .fc .fc-prev-button,
.wcab-admin-calendar-wrap .fc .fc-next-button {
  width: 38px;
  min-width: 38px;
  height: 36px;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 1px solid #d8d3ff !important;
  border-radius: 10px !important;
  background: #f7f5ff !important;
  color: #5542df !important;
  box-shadow: none !important;
}
.wcab-admin-calendar-wrap .fc .fc-prev-button .fc-icon,
.wcab-admin-calendar-wrap .fc .fc-next-button .fc-icon { display: none !important; }
.wcab-admin-calendar-wrap .fc .fc-prev-button::before,
.wcab-admin-calendar-wrap .fc .fc-next-button::before {
  content: "";
  width: 17px;
  height: 17px;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 17px 17px;
}
.wcab-admin-calendar-wrap .fc .fc-prev-button::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235542df' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E");
}
.wcab-admin-calendar-wrap .fc .fc-next-button::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235542df' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18l6-6-6-6'/%3E%3C/svg%3E");
}

/* =========================================================
   WebCarry v2.0.3 — HR, careers, recruitment and performance
========================================================= */

/* Staff photo editor: true circular preview with adjustable focal point. */
.wcab-hr-avatar-field .wcab-hr-avatar-preview-wrap {
  width: 112px !important;
  height: 112px !important;
  flex: 0 0 112px;
  border-radius: 50% !important;
  overflow: visible !important;
  background: #f1f4f9;
  border: 1px solid #d9e0eb;
}
.wcab-hr-avatar-field .wcab-hr-avatar-preview,
.wcab-hr-avatar-field .wcab-hr-avatar-placeholder {
  width: 100% !important;
  height: 100% !important;
  border-radius: 50% !important;
  overflow: hidden;
}
.wcab-hr-avatar-field .wcab-hr-avatar-preview {
  object-fit: cover !important;
  object-position: 50% 50%;
}
.wcab-hr-camera-btn {
  right: -2px !important;
  bottom: 7px !important;
  width: 34px !important;
  height: 34px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: 3px solid #fff !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #6550f8, #4b36df) !important;
  color: #fff !important;
  line-height: 1 !important;
  box-shadow: 0 7px 18px rgba(79,70,229,.28) !important;
}
.wcab-hr-camera-btn svg {
  width: 16px !important;
  height: 16px !important;
  display: block;
  stroke: #fff !important;
  margin: 0 !important;
}
.wcab-hr-avatar-adjust {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}
.wcab-hr-avatar-adjust label {
  margin: 0 !important;
  color: #5d6b81 !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}
.wcab-hr-avatar-adjust input[type="range"] {
  width: 100% !important;
  min-height: 22px !important;
  padding: 0 !important;
  margin-top: 5px;
  accent-color: #5b45f5;
  box-shadow: none !important;
}

/* Performance period filters. */
.wcab-hr-performance-filter {
  display: grid;
  grid-template-columns: minmax(190px, 1.2fr) repeat(2, minmax(150px, .8fr)) auto auto;
  gap: 12px;
  align-items: end;
  margin: 0 0 16px;
  padding: 14px;
  border: 1px solid #e2e7f0;
  border-radius: 14px;
  background: #fafbfe;
}
.wcab-hr-performance-filter label {
  margin: 0 !important;
}
.wcab-hr-performance-filter label > span {
  display: block;
  margin-bottom: 6px;
  color: #64728a;
  font-size: 11px;
  font-weight: 500;
}
.wcab-hr-performance-filter select,
.wcab-hr-performance-filter input {
  min-height: 42px;
  width: 100%;
  padding: 9px 11px;
  border: 1px solid #dce3ee;
  border-radius: 10px;
  background: #fff;
  color: #34425a;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 12px;
  font-weight: 400;
  box-shadow: none;
}
.wcab-hr-filter-apply,
.wcab-hr-filter-reset {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 15px;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 500;
  text-decoration: none !important;
  cursor: pointer;
}
.wcab-hr-filter-apply {
  border: 1px solid #5b45f5;
  background: #5b45f5;
  color: #fff;
}
.wcab-hr-filter-apply:hover,
.wcab-hr-filter-apply:focus-visible {
  background: #4934d8;
  border-color: #4934d8;
  color: #fff;
  box-shadow: 0 8px 18px rgba(75,52,216,.16);
}
.wcab-hr-filter-reset,
.wcab-hr-filter-reset:visited {
  border: 1px solid #d9dfeb;
  background: #fff;
  color: #5d6b81;
}
.wcab-hr-filter-reset:hover,
.wcab-hr-filter-reset:focus-visible {
  border-color: #c9d0dd;
  background: #f3f5f9;
  color: #39475e;
}
.wcab-hr-definition {
  flex-wrap: wrap;
}
.wcab-hr-definition > strong {
  margin-left: auto;
  color: #4f5f78;
  font-weight: 500;
}

/* Current-user action badge must match the adjacent square edit control. */
.wcab-hr-current-label {
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  min-height: 38px !important;
  padding: 0 !important;
  border: 1px solid #ccefdc;
  border-radius: 10px !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  line-height: 1 !important;
}

/* Keep HR header controls perfectly stable: hover affects only the hovered control. */
.wcab-hr-top-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap;
  gap: 10px !important;
}
.wcab-hr-top-actions > * {
  flex: 0 0 auto !important;
  transform: none !important;
  margin: 0 !important;
}
.wcab-hr-top-actions .wcab-hr-top-btn:hover,
.wcab-hr-top-actions .wcab-hr-top-btn:focus-visible {
  transform: none !important;
}

/* Open position nature appears as structured responsibilities/requirements. */
.wcab-open-position-description .wcab-open-position-nature {
  margin: 8px 0 0;
  padding-left: 21px;
  color: #46556e;
  font-size: 13.5px;
  line-height: 1.65;
}
.wcab-open-position-description .wcab-open-position-nature li {
  margin: 5px 0;
  padding-left: 3px;
}
.wcab-open-position-description ul.wcab-open-position-nature li::marker {
  color: #5b45f5;
}
.wcab-open-position-description ol.wcab-open-position-nature li::marker {
  color: #5b45f5;
  font-weight: 600;
}
.wcab-career-job-fields select {
  width: 100%;
  margin: 7px 0;
}

/* Career form helper copy, terms and brief confirmation. */
.wcab-career-character-count {
  text-align: right;
  color: #7a879b !important;
  font-variant-numeric: tabular-nums;
}
.wcab-career-terms {
  padding: 14px 16px;
  border: 1px solid #dfe5ef;
  border-radius: 12px;
  background: #fafbfe;
}
.wcab-career-terms > label {
  display: flex !important;
  align-items: flex-start;
  gap: 10px;
  margin: 0 !important;
  cursor: pointer;
}
.wcab-career-terms input[type="checkbox"] {
  width: 18px !important;
  min-width: 18px;
  height: 18px;
  min-height: 18px !important;
  margin-top: 1px;
  accent-color: #5b45f5;
}
.wcab-career-terms-copy {
  color: #58677e !important;
  font-size: 12.5px;
  line-height: 1.55;
  font-weight: 400 !important;
}
.wcab-career-terms-copy a {
  color: #5542df;
  font-weight: 500;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.wcab-career-terms-copy em {
  color: #e23b4b;
  font-style: normal;
}
.wcab-career-flash {
  transition: opacity .3s ease, transform .3s ease, max-height .3s ease, margin .3s ease, padding .3s ease;
  overflow: hidden;
}
.wcab-career-flash.is-hiding {
  opacity: 0;
  transform: translateY(-6px);
  max-height: 0;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Job application details open in a dedicated modal, never inside the row. */
.wcab-hr-application-view-btn {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 11px;
  border: 1px solid #cddcff;
  border-radius: 9px;
  background: #f8faff;
  color: #3568d8;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 500;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.wcab-hr-application-view-btn > span {
  font-size: 17px;
  line-height: 1;
}
.wcab-hr-application-view-btn:hover,
.wcab-hr-application-view-btn:focus-visible {
  border-color: #adc5ff;
  background: #edf3ff;
  color: #2857bc;
  box-shadow: 0 7px 15px rgba(53,104,216,.09);
}
.wcab-hr-application-action-cell,
.wcab-hr-applications-table th:last-child {
  text-align: center !important;
}
.wcab-hr-application-action-cell form {
  display: flex;
  justify-content: center;
  margin: 0;
}
.wcab-application-detail-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px;
  box-sizing: border-box;
}
.wcab-application-detail-modal.is-open {
  display: flex;
}
.wcab-application-detail-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(24,34,55,.58);
  backdrop-filter: blur(7px);
}
.wcab-application-detail-dialog {
  position: relative;
  z-index: 1;
  width: min(720px, 100%);
  max-height: min(82vh, 760px);
  overflow: auto;
  border: 1px solid #dfe5ef;
  border-radius: 20px;
  background: #fff;
  box-shadow: 0 34px 90px rgba(24,34,55,.28);
  font-family: "Segoe UI", Arial, sans-serif;
}
.wcab-application-detail-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
  padding: 22px 24px 18px;
  border-bottom: 1px solid #e7ebf2;
}
.wcab-application-detail-head span {
  display: block;
  margin-bottom: 5px;
  color: #5b45f5;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .08em;
}
.wcab-application-detail-head h3 {
  margin: 0;
  color: #26344d;
  font-size: 22px;
  font-weight: 600;
}
.wcab-application-detail-head button {
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 10px;
  background: #f3f5f9;
  color: #637087;
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
}
.wcab-application-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
  padding: 22px 24px 26px;
}
.wcab-application-detail-grid > div {
  min-width: 0;
  padding: 13px 14px;
  border: 1px solid #e3e8f0;
  border-radius: 12px;
  background: #fafbfe;
}
.wcab-application-detail-grid small {
  display: block;
  margin-bottom: 5px;
  color: #7a879a;
  font-size: 10.5px;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: .045em;
}
.wcab-application-detail-grid strong,
.wcab-application-detail-grid span,
.wcab-application-detail-grid p {
  color: #3e4d65;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.6;
  overflow-wrap: anywhere;
}
.wcab-application-detail-grid strong {
  font-weight: 600;
}
.wcab-application-detail-grid p {
  margin: 0;
  white-space: pre-wrap;
}
.wcab-application-detail-wide {
  grid-column: 1 / -1;
}

@media (max-width: 980px) {
  .wcab-hr-performance-filter {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
@media (max-width: 680px) {
  .wcab-hr-avatar-field {
    grid-template-columns: 1fr !important;
    justify-items: center;
    text-align: center;
  }
  .wcab-hr-avatar-adjust,
  .wcab-hr-performance-filter,
  .wcab-application-detail-grid {
    grid-template-columns: 1fr;
  }
  .wcab-application-detail-wide {
    grid-column: auto;
  }
  .wcab-hr-filter-apply,
  .wcab-hr-filter-reset {
    width: 100%;
  }
}