/* Salón (Salonsoft) — kalendár dňa po pracovníkoch, objednanie, cenník, tím a rozpis. */
.sl-page { --sl-px: 1.4px; }
.sl-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.sl-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 10px; }
.sl-toolbar input[type=date] { width: auto; }
.sl-daylabel { margin: 0 8px; text-transform: none; }
.sl-toolbar [data-new] { margin-left: auto; }
.sl-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; font-size: 12px; color: #6a776f; margin: 0 0 8px; }
.sl-l { display: inline-block; width: 18px; height: 10px; border-radius: 3px; margin-right: -6px; vertical-align: middle; }
.sl-l.work { background: #7c4dff; }
.sl-l.wait { background: repeating-linear-gradient(135deg, #d9cffc 0 4px, #f3effe 4px 8px); }
.sl-l.clean { background: repeating-linear-gradient(135deg, #c9cfcc 0 3px, #eef1ef 3px 6px); }
.sl-l.off { background: #eceeed; }
.sl-empty { padding: 18px; border: 1px dashed var(--line, #dfe4e1); border-radius: 10px; color: #4b5a52; }

.sl-cal { display: grid; grid-template-columns: 52px repeat(var(--cols), minmax(170px, 1fr)); overflow-x: auto; border: 1px solid var(--line, #e4e8e5); border-radius: 10px; background: #fff; }
.sl-times { position: relative; margin-top: 46px; border-right: 1px solid var(--line, #e4e8e5); }
.sl-times span { position: absolute; right: 6px; transform: translateY(-50%); font-size: 11px; color: #7d8a83; }
.sl-col { border-right: 1px solid var(--line, #e4e8e5); min-width: 0; }
.sl-col:last-child { border-right: 0; }
.sl-colhead { height: 46px; padding: 5px 8px; border-bottom: 3px solid var(--c); display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.sl-colhead strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-colhead small { font-size: 11px; color: #6a776f; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-lane { position: relative; cursor: copy; }
.sl-line { position: absolute; left: 0; right: 0; border-top: 1px solid #f0f2f1; }
.sl-off { position: absolute; left: 0; right: 0; background: repeating-linear-gradient(135deg, #f1f3f2 0 6px, #f7f8f7 6px 12px); pointer-events: none; }
.sl-note { position: absolute; left: 4px; right: 4px; font-size: 11px; color: #8a5a00; background: #fff6e0; border-radius: 4px; padding: 1px 4px; pointer-events: none; z-index: 1; }
.sl-appt { position: absolute; left: 3px; right: 3px; display: flex; gap: 0; padding: 0; overflow: hidden; text-align: left; border: 1px solid color-mix(in srgb, var(--c) 55%, #fff); border-radius: 7px; background: #fff; color: #17201b; cursor: pointer; z-index: 2; box-shadow: 0 1px 3px #0001; }
.sl-appt:hover { box-shadow: 0 3px 10px #0002; z-index: 3; }
.sl-appt.faded { opacity: .45; }
.sl-appt[data-status=Requested] { border-style: dashed; }
.sl-phases { display: flex; flex-direction: column; width: 9px; flex: none; }
.sl-phase { display: block; flex: none; }
.sl-phase.work { background: var(--c); }
.sl-phase.wait { background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--c) 35%, #fff) 0 4px, #fff 4px 8px); }
.sl-phase.clean { background: repeating-linear-gradient(135deg, #c9cfcc 0 3px, #eef1ef 3px 6px); }
.sl-text { display: flex; flex-direction: column; gap: 1px; padding: 3px 6px; min-width: 0; font-size: 12px; line-height: 1.25; }
.sl-text b, .sl-text span, .sl-text small { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sl-text small { color: #5c6a62; font-size: 11px; }
.sl-warn { color: #b3261e !important; font-weight: 600; }
.sl-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--c); margin-right: 6px; }

.sl-dialog.sl-wide { width: min(980px, 96vw); }
.sl-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 10px 14px; align-items: end; }
.sl-form .full, .sl-form fieldset { grid-column: 1 / -1; }
.sl-form fieldset { border: 1px solid var(--line, #e4e8e5); border-radius: 10px; padding: 10px 12px; display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px 12px; }
.sl-form fieldset > p, .sl-form fieldset > table, .sl-form fieldset > div, .sl-form fieldset > .sl-actions { grid-column: 1 / -1; margin: 0; }
.sl-form legend { font-weight: 700; padding: 0 4px; }
.sl-form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.sl-form label.sl-check { flex-direction: row; align-items: center; gap: 8px; }
.sl-narrow { max-width: 720px; }
.sl-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.sl-choices { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.sl-choice { flex: 1 1 260px; flex-direction: row !important; gap: 10px !important; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--line, #e4e8e5); border-radius: 10px; cursor: pointer; }
.sl-choice span { display: flex; flex-direction: column; gap: 2px; }
.sl-choice small { color: #6a776f; }
.sl-setup { max-width: 900px; }
.sl-found { display: flex; flex-wrap: wrap; gap: 6px; }
.sl-pick, .sl-variant, .sl-slot { border: 1px solid var(--line, #dfe4e1); background: #fff; color: #17201b; border-radius: 8px; padding: 6px 10px; cursor: pointer; text-align: left; font-weight: 400; }
.sl-pick.active, .sl-variant.active, .sl-slot.active { border-color: #7c4dff; background: #f3effe; box-shadow: 0 0 0 2px #7c4dff33; }
.sl-pick.new { border-style: dashed; }
.sl-newclient { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px 12px; }
.sl-newclient[hidden] { display: none; }
.sl-variants { display: flex; flex-wrap: wrap; gap: 8px; }
.sl-variant { display: flex; flex-direction: column; gap: 2px; min-width: 150px; }
.sl-variant span { font-size: 12px; color: #4b5a52; }
.sl-servicenote { font-size: 13px; color: #4b5a52; background: #f6f7f5; border-radius: 8px; padding: 6px 10px; }
.sl-slots { display: grid; gap: 8px; max-height: 260px; overflow: auto; }
.sl-slotday { display: grid; gap: 4px; }
.sl-slotday > div { display: flex; flex-wrap: wrap; gap: 5px; }
.sl-slot { padding: 4px 8px; font-variant-numeric: tabular-nums; }
.sl-slot small { color: #6a776f; }
.sl-summary { background: #f3effe; border: 1px solid #ddd2fd; border-radius: 10px; padding: 10px 12px; font-size: 14px; }
.sl-summary:empty { display: none; }
.sl-detail p { margin: 6px 0; }
.sl-phaselist { margin: 4px 0 8px 18px; font-size: 13px; color: #4b5a52; }
.sl-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.sl-table th, .sl-table td { padding: 7px 8px; border-bottom: 1px solid var(--line, #e4e8e5); text-align: left; vertical-align: top; }
.sl-table th { font-size: 12px; text-transform: uppercase; letter-spacing: .04em; color: #6a776f; }
.sl-table tbody tr[data-id] { cursor: pointer; }
.sl-table tbody tr[data-id]:hover { background: #f8f9f8; }
.sl-table input { width: 100%; min-width: 0; }
.sl-phasetable input[type=number] { width: 80px; }
.sl-hours input { width: 70px; }
.sl-group { margin: 16px 0 6px; font-size: 15px; }
.sl-variantedit { border: 1px solid #ece8fb; border-radius: 10px; padding: 8px 10px; margin-bottom: 8px; background: #fcfbff; }
.sl-variantrow { display: grid; grid-template-columns: 2fr 1fr 1fr auto; gap: 8px; align-items: end; margin-bottom: 6px; }
.link-button { background: none; border: 0; color: #5b35d5; padding: 2px 0; cursor: pointer; font-weight: 600; }
@media (max-width: 760px) {
  .sl-cal { grid-template-columns: 44px repeat(var(--cols), minmax(150px, 1fr)); }
  .sl-variantrow { grid-template-columns: 1fr 1fr; }
  .sl-toolbar [data-new] { margin-left: 0; }
}
#nav-group-salon[hidden] { display: none !important; }


/* Pracovný kalendár: pokojná typografia, farba pracovníka a explicitné stavy. */
.sl-page { --sl-ink: #202b38; --sl-muted: #667384; --sl-border: #e2e7ee; --sl-surface: #fff; --sl-soft: #f6f8fb; color: var(--sl-ink); }
.sl-tabs { gap: 0; border-bottom: 1px solid var(--sl-border); margin-bottom: 24px; }
.sl-tabs button.secondary { border: 0; border-radius: 0; padding: 12px 18px; background: transparent; color: var(--sl-muted); box-shadow: none; border-bottom: 2px solid transparent; }
.sl-tabs button.active { color: var(--sl-ink); border-bottom-color: #596b87; font-weight: 700; }
.sl-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 22px; }
.sl-heading h2 { font-size: 26px; letter-spacing: -.6px; margin: 3px 0 6px; }
.sl-heading .muted { margin: 0; font-size: 13px; }
.sl-eyebrow { color: var(--sl-muted); font-size: 10px; font-weight: 700; letter-spacing: .13em; margin: 0; }
.sl-page button.sl-primary { border-radius: 7px; padding: 11px 18px; background: #25364c; color: #fff; border: 1px solid #25364c; white-space: nowrap; box-shadow: none; }
.sl-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 22px; }
.sl-metric { padding: 16px 18px; background: var(--sl-surface); border: 1px solid var(--sl-border); border-radius: 9px; display: flex; flex-direction: column; gap: 4px; }
.sl-metric > span { font-size: 12px; color: var(--sl-muted); font-weight: 600; }
.sl-metric strong { font-size: 28px; line-height: 1.2; font-variant-numeric: tabular-nums; font-weight: 650; }
.sl-metric small { color: var(--sl-muted); font-size: 11px; }
.sl-calendar-panel { background: var(--sl-surface); border: 1px solid var(--sl-border); border-radius: 10px; min-width: 0; overflow: hidden; }
.sl-toolbar { padding: 16px; border-bottom: 1px solid var(--sl-border); margin: 0; gap: 12px; }
.sl-date-controls, .sl-filters, .sl-view-switch { display: flex; align-items: center; gap: 6px; }
.sl-toolbar .secondary { background: var(--sl-surface); color: var(--sl-ink); border: 1px solid var(--sl-border); border-radius: 6px; box-shadow: none; min-height: 36px; padding: 6px 11px; }
.sl-toolbar input, .sl-toolbar select { background: var(--sl-surface); color: var(--sl-ink); border: 1px solid var(--sl-border); border-radius: 6px; min-height: 36px; font-size: 12px; padding: 6px 9px; }
.sl-toolbar input[type=date] { width: 145px; }
.sl-view-switch { margin-left: auto; }
.sl-view-switch button[aria-pressed=true] { background: var(--sl-soft); border-color: #9aa8bb; font-weight: 700; }
.sl-day-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 16px 18px 10px; font-size: 12px; }
.sl-day-heading .sl-daylabel { margin: 0; font-size: 15px; text-transform: capitalize; }
.sl-legend { padding: 0 18px 14px; margin: 0; gap: 7px 16px; color: var(--sl-muted); font-size: 11px; }
.sl-legend > span { display: inline-flex; align-items: center; gap: 5px; }
.sl-legend .sl-l { margin: 0; width: 12px; height: 9px; }
.sl-cal-scroll { overflow: auto; max-height: 68vh; min-height: 280px; border-top: 1px solid var(--sl-border); }
.sl-cal { overflow: visible; border: 0; border-radius: 0; grid-template-columns: 58px repeat(var(--cols), minmax(220px, 1fr)); }
.sl-times { position: sticky; left: 0; z-index: 4; background: var(--sl-surface); margin-top: 68px; border-color: var(--sl-border); }
.sl-times span { font-size: 10px; right: 9px; font-variant-numeric: tabular-nums; color: var(--sl-muted); }
.sl-col { border-color: var(--sl-border); }
.sl-colhead { position: sticky; top: 0; z-index: 5; height: 68px; box-sizing: border-box; background: var(--sl-surface); flex-direction: row; align-items: center; justify-content: flex-start; gap: 9px; padding: 12px; border-bottom: 2px solid var(--c); }
.sl-avatar { width: 32px; height: 32px; border-radius: 50%; flex: none; display: grid; place-items: center; font-size: 11px; font-weight: 700; color: var(--c); background: color-mix(in srgb, var(--c) 10%, white); }
.sl-person { display: flex; flex-direction: column; min-width: 0; gap: 3px; }
.sl-colhead strong { font-size: 13px; }
.sl-colhead small { font-size: 10px; color: var(--sl-muted); }
.sl-staff-count { margin-left: auto; padding: 3px 6px; background: var(--sl-soft); border-radius: 4px; font-size: 10px; color: var(--sl-muted); }
.sl-lane { background: repeating-linear-gradient(to bottom, transparent 0 41px, #f5f7fa 41px 42px); }
.sl-line { border-color: #e7ecf2; pointer-events: none; }
.sl-off { background: repeating-linear-gradient(135deg, #f0f3f7 0 2px, #f8f9fb 2px 9px); }
.sl-appt { box-sizing: border-box; left: calc(100% * var(--column, 0) / var(--count, 1) + 4px); right: auto; width: calc(100% / var(--count, 1) - 8px); border-radius: 6px; border: 1px solid color-mix(in srgb, var(--c) 32%, white); background: color-mix(in srgb, var(--c) 10%, white); box-shadow: none; color: #243144; }
.sl-appt:hover { box-shadow: 0 3px 9px #20334c24; border-color: var(--c); }
.sl-appt:focus-visible, .sl-agenda-item:focus-visible, .sl-page button:focus-visible, .sl-cal-scroll:focus-visible { outline: 2px solid #4168b3; outline-offset: 2px; }
.sl-appt[data-status=Requested] { border-style: dashed; }
.sl-appt[data-status=Completed] { background: #f1f5f3; }
.sl-appt[data-status=Cancelled] .sl-text b { text-decoration: line-through; }
.sl-phases { width: 4px; }
.sl-text { padding: 7px 8px; gap: 3px; font-size: 11px; }
.sl-text b { font-size: 12px; font-weight: 650; }
.sl-text small { color: #556274; font-size: 10px; }
.sl-note { z-index: 1; }
.sl-agenda { padding: 0 18px 18px; display: grid; gap: 8px; }
.sl-agenda-item { display: flex; align-items: center; gap: 14px; padding: 13px 14px; border: 1px solid var(--sl-border); border-left: 3px solid var(--c); border-radius: 6px; background: var(--sl-surface); color: var(--sl-ink); text-align: left; box-shadow: none; width: 100%; }
.sl-agenda-item:hover { background: var(--sl-soft); }
.sl-agenda-item time { font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; min-width: 42px; }
.sl-agenda-item > span:not(.perf-badge) { display: flex; flex-direction: column; gap: 3px; flex: 1; min-width: 0; }
.sl-agenda-item strong { font-size: 13px; }
.sl-agenda-item span span, .sl-agenda-item small { font-size: 11px; font-weight: 400; color: var(--sl-muted); }
.sl-agenda-item time small { display: block; margin-top: 4px; }
.sl-calendar-panel > .sl-empty { margin: 18px; }
@media (max-width: 1000px) {
  .sl-metrics { gap: 8px; }
  .sl-metric { padding: 12px; }
  .sl-filters { flex: 1; }
}
@media (max-width: 600px) {
  .sl-tabs { flex-wrap: nowrap; overflow-x: auto; margin-bottom: 16px; }
  .sl-tabs button.secondary { flex: none; padding: 10px 12px; font-size: 12px; }
  .sl-heading { align-items: flex-start; flex-direction: column; gap: 12px; }
  .sl-heading h2 { font-size: 23px; }
  .sl-heading .sl-primary { width: 100%; }
  .sl-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sl-metric strong { font-size: 25px; }
  .sl-metric small { font-size: 10px; }
  .sl-toolbar { padding: 12px; gap: 10px; }
  .sl-date-controls { width: 100%; }
  .sl-filters { width: 100%; }
  .sl-filters select { flex: 1; min-width: 0; max-width: 55%; }
  .sl-view-switch { margin-left: 0; }
  .sl-day-heading { align-items: flex-start; flex-direction: column; padding: 12px; }
  .sl-legend { padding: 0 12px 12px; }
  .sl-cal { grid-template-columns: 42px repeat(var(--cols), minmax(210px, 1fr)); }
  .sl-agenda { padding: 0 12px 12px; }
  .sl-agenda-item { flex-wrap: wrap; gap: 10px; }
  .sl-agenda-item > .perf-badge { margin-left: 52px; }
}
/* Izolovať karty termínov od všeobecného vzhľadu hlavných tlačidiel REBOS. */
html body .sl-page button.sl-appt { padding: 0; min-height: 0; background: color-mix(in srgb, var(--c) 10%, white); color: #243144; box-shadow: none; transform: none; }
html body .sl-page button.sl-appt:hover { background: color-mix(in srgb, var(--c) 16%, white); color: #243144; transform: none; }
html body .sl-page button.sl-appt[data-status=Completed] { background: #f1f5f3; }
html body .sl-page button.sl-agenda-item { background: var(--sl-surface); color: var(--sl-ink); box-shadow: none; transform: none; }
html body .sl-page button.sl-agenda-item:hover { background: var(--sl-soft); }
html body .sl-page .sl-tabs button.active { background: transparent; color: var(--sl-ink); border-bottom-color: #596b87; }
@media (max-width: 600px) {
  .sl-page .sl-filters { flex: 1 0 100%; }
  .sl-page .sl-filters select { width: auto; max-width: none; }
  .sl-page .sl-view-switch { flex: 1 0 100%; }
}
html body .sl-page .sl-tabs button.active { background: transparent !important; color: var(--sl-ink) !important; border-color: transparent transparent #596b87 !important; }

/* Salonsoft (www.salonsoft.sk/admin, product-mode.js): v menu len to, čo salón potrebuje — realitné moduly sú skryté. */
html[data-product="salon"] #navigation .nav-item[data-route]:not(:is([data-route="dashboard"], [data-route="customers"], [data-route="salon"], [data-route="invoicing"], [data-route="expenses"], [data-route="mail-inbox"], [data-route="phone-calls"], [data-route="notes"], [data-route="mail-marketing"], [data-route="users"], [data-route="office"], [data-route="license"], [data-route="appearance"])) { display: none !important; }
html[data-product="salon"] #navigation .nav-group:not(:has(.nav-item:is([data-route="dashboard"], [data-route="customers"], [data-route="salon"], [data-route="invoicing"], [data-route="expenses"], [data-route="mail-inbox"], [data-route="phone-calls"], [data-route="notes"], [data-route="mail-marketing"], [data-route="users"], [data-route="office"], [data-route="license"], [data-route="appearance"]))) { display: none !important; }