/* Zajednički vizualni stil za cijeli salon panel. */
.salon-test-banner {
    padding: 0.6rem 1rem;
    background: var(--salon-rose-dark, #82445f);
    color: #fffaf7;
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
}

:root {
    --salon-rose: var(--salon-theme-accent, #a95778);
    --salon-rose-dark: var(--salon-theme-strong, #82445f);
    --salon-blush: var(--salon-theme-surface, #fff5f6);
    --salon-lavender: var(--salon-theme-surface, #f3f1fb);
    --salon-peach: var(--salon-theme-surface, #fff4ed);
    --salon-ink: var(--salon-theme-ink, #352d33);
    --salon-muted: var(--salon-theme-muted, #7d7279);
    --salon-line: var(--salon-theme-surface-alt, #ede4e8);
    --salon-page-background: color-mix(in srgb, var(--salon-rose) 7%, #fff);
}

.fi-body {
    background: var(--salon-page-background);
    color: var(--salon-ink);
}

.fi-sidebar {
    border-inline-end-color: var(--salon-theme-surface-alt, #eee5e9);
    background: linear-gradient(180deg, #fff 0%, var(--salon-theme-surface, #fffafb) 42%, var(--salon-theme-surface, #f9f7fc) 100%);
}

.fi-sidebar-header {
    border-bottom: 1px solid var(--salon-theme-surface-alt, #f1e8eb);
}

.fi-sidebar-item-btn {
    min-height: 2.8rem;
    border-radius: 0.8rem;
    color: var(--salon-theme-ink-soft, #61555d);
    font-weight: 600;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
}

.fi-sidebar-item-btn:hover {
    background: var(--salon-theme-surface-alt, #f9edf2);
    color: var(--salon-rose-dark);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn {
    background: linear-gradient(90deg, var(--salon-theme-surface-alt, #f8e9ef), var(--salon-theme-surface-alt, #f5effa));
    color: var(--salon-rose-dark);
    box-shadow: inset 3px 0 var(--salon-theme-accent-soft, #c77a9b);
}

.fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon {
    color: var(--salon-rose);
}

.fi-main-ctn {
    background: var(--salon-page-background);
}

.fi-main {
    background: radial-gradient(ellipse at 95% 0%, rgb(var(--salon-theme-rgb, 169 87 120) / 5%), transparent 35rem), var(--salon-page-background);
}

.fi-page {
    gap: 1.5rem;
}

.fi-page-header-heading {
    color: var(--salon-theme-ink, #3d3038);
    font-weight: 680;
    letter-spacing: -0.035em;
}

.fi-page-header-description,
.fi-fo-field-wrp-hint,
.fi-fo-field-wrp-helper-text {
    color: var(--salon-muted);
}

.fi-section,
.fi-ta-ctn,
.fi-modal-window,
.fi-dropdown-panel {
    border-color: var(--salon-line);
    box-shadow: 0 8px 24px rgb(var(--salon-theme-rgb, 68 43 55) / 5%);
}

.fi-section {
    overflow: hidden;
    border-radius: 1rem;
    background: rgb(255 255 255 / 94%);
}

.fi-section-header {
    background: linear-gradient(90deg, var(--salon-theme-surface, #fffafb), var(--salon-theme-surface, #fbfaff));
}

.fi-section-header-heading {
    color: var(--salon-theme-ink-soft, #493b44);
    font-weight: 680;
}

.fi-ta-ctn {
    overflow: hidden;
    border-radius: 1rem;
    background: #fff;
}

.fi-ta-header {
    border-bottom-color: var(--salon-theme-surface-alt, #f0e8eb);
    background: linear-gradient(90deg, var(--salon-theme-surface, #fffafb), var(--salon-theme-surface, #faf9fe));
}

.fi-ta-table > thead > tr > th {
    border-bottom-color: var(--salon-theme-border, #eadfe4);
    background: var(--salon-theme-surface, #fbf6f8);
    color: var(--salon-theme-muted, #675862);
    font-size: 0.72rem;
    font-weight: 750;
    letter-spacing: 0.035em;
    text-transform: uppercase;
}

.fi-ta-table > tbody > tr {
    transition: background-color 150ms ease;
}

.fi-ta-table > tbody > tr:hover {
    background: var(--salon-theme-surface, #fff9fb);
}

.fi-ta-table > tbody > tr > td {
    border-top-color: var(--salon-theme-surface-alt, #f2ecef);
}

.fi-input-wrp {
    border-radius: 0.75rem;
    background: #fff;
}

.fi-input-wrp:not(.fi-invalid):not(.fi-disabled) {
    border-color: var(--salon-theme-accent-border, #bc7292);
    box-shadow: inset 0 0 0 1px var(--salon-theme-accent-border, #bc7292);
    transition: box-shadow 150ms ease;
}

.fi-input-wrp:not(.fi-invalid):not(.fi-disabled):focus-within {
    border-color: var(--salon-theme-focus, #914866);
    box-shadow: inset 0 0 0 2px var(--salon-theme-focus, #914866), 0 0 0 3px rgb(var(--salon-theme-rgb, 169 87 120) / 18%);
}

.fi-btn:not(.fi-btn-color-danger) {
    border-radius: 0.75rem;
    font-weight: 650;
}

.fi-btn.fi-color-primary:not(.fi-outlined):not([aria-pressed]) {
    background: var(--salon-rose);
    color: #fffaf7 !important;
    box-shadow: 0 5px 12px rgb(var(--salon-theme-rgb, 169 87 120) / 20%);
}

.fi-btn.fi-color-primary:not(.fi-outlined):not([aria-pressed]):hover {
    background: var(--salon-rose-dark);
    color: #fffaf7 !important;
}

.fi-btn.fi-color-primary:not(.fi-outlined):not([aria-pressed]) > .fi-icon {
    color: #fffaf7 !important;
}

.fi-btn.fi-color-gray,
.fi-btn.fi-color-neutral {
    border-color: var(--salon-theme-border, #e7dce1);
    background: #fff;
    color: var(--salon-theme-ink-soft, #5d4e57);
}

.fi-btn.fi-color-gray:hover,
.fi-btn.fi-color-neutral:hover {
    background: var(--salon-theme-surface, #fbf4f7);
}

.fi-pagination .fi-btn.fi-active,
.fi-tabs-item.fi-active {
    background: var(--salon-theme-surface-alt, #f7e9ef);
    color: var(--salon-rose-dark);
}

.fi-pagination .fi-btn.fi-active {
    color: var(--salon-rose-dark) !important;
}

.fi-modal-window {
    border-radius: 1.2rem;
}

.fi-modal-header {
    border-bottom-color: var(--salon-theme-surface-alt, #f1e8eb);
    background: linear-gradient(90deg, var(--salon-theme-surface, #fffafa), var(--salon-theme-surface, #faf9fe));
}

.fi-modal-heading {
    color: var(--salon-theme-ink-soft, #493b44);
}

.fi-notification {
    border-color: var(--salon-theme-border, #ecdde4);
    border-radius: 0.95rem;
    box-shadow: 0 12px 28px rgb(var(--salon-theme-rgb, 67 42 53) / 13%);
}

.fi-badge.fi-color-primary {
    background: var(--salon-theme-surface-alt, #f8e7ee);
    color: var(--salon-theme-strong, #8e4868);
}

@media (max-width: 1023px) {
    .fi-main {
        background: var(--salon-page-background);
    }
}

/* Tamni način zadržava paletu salona, ali koristi vlastite čitljive površine. */
:root.dark {
    color-scheme: dark;
    --salon-theme-ink: #f1f4f8;
    --salon-theme-ink-soft: #dce3ed;
    --salon-theme-muted: #b9c4d3;
    --salon-theme-border: #69798f;
    --salon-theme-surface: #202833;
    --salon-theme-surface-alt: #2b3645;
    --salon-theme-pastel: #344155;
    --salon-theme-pastel-alt: #3e3548;
    --salon-theme-background: #131a23;
    --salon-dark-accent: color-mix(in srgb, var(--salon-theme-accent, #a95778) 40%, #fff);
    --salon-page-background: #131a23;
    --salon-line: var(--salon-theme-border);
}

.dark .fi-simple-main,
.dark .fi-section,
.dark .fi-ta-ctn,
.dark .fi-modal-window,
.dark .fi-dropdown-panel,
.dark .fi-notification,
.dark .salon-home__activity,
.dark .salon-home__treatment {
    background: var(--salon-theme-surface) !important;
    color: var(--salon-theme-ink);
    border-color: var(--salon-theme-border);
}

.dark .fi-sidebar,
.dark .fi-topbar {
    background: #19212c !important;
    border-color: var(--salon-theme-border);
}

.dark .fi-input-wrp {
    background: #151d28 !important;
    color: var(--salon-theme-ink);
}

.dark .fi-input-wrp:not(.fi-invalid):not(.fi-disabled) {
    border-color: var(--salon-theme-border);
    box-shadow: inset 0 0 0 1px var(--salon-theme-border);
}

.dark .fi-input-wrp:not(.fi-invalid):not(.fi-disabled):focus-within {
    border-color: var(--salon-dark-accent);
    box-shadow: inset 0 0 0 2px var(--salon-dark-accent), 0 0 0 3px rgb(255 255 255 / 12%);
}

.dark .fi-input,
.dark .fi-textarea,
.dark .fi-select-input,
.dark .fi-input-wrp input,
.dark .fi-input-wrp textarea,
.dark .fi-input-wrp select {
    color: var(--salon-theme-ink);
    caret-color: var(--salon-dark-accent);
}

.dark .fi-input-wrp input::placeholder,
.dark .fi-input-wrp textarea::placeholder {
    color: var(--salon-theme-muted);
    opacity: 1;
}

.dark .fi-ta-table > tbody > tr > td,
.dark .fi-ta-table > thead > tr > th,
.dark .fi-ta-header,
.dark .fi-modal-header,
.dark .fi-section-header,
.dark .fi-fo-repeater-item {
    border-color: var(--salon-theme-border);
}

.dark .fi-in-table-repeatable:is(.salon-components--izrast, .salon-components--vrh, .salon-components--volumeni) > table > tbody > tr > td {
    background: var(--salon-theme-surface) !important;
    color: var(--salon-theme-ink) !important;
    border-color: var(--salon-theme-border);
}

.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn,
.dark .fi-sidebar-item.fi-active > .fi-sidebar-item-btn .fi-icon,
.dark .fi-sidebar-item-btn:hover,
.dark .salon-header__item svg,
.dark a.salon-header__item:hover,
.dark .salon-home__eyebrow,
.dark .salon-home__text-link,
.dark .salon-home__notice-links a,
.dark .salon-share-qr__link,
.dark .salon-share-qr__network {
    color: var(--salon-dark-accent);
}

.dark .fi-btn.fi-color-gray,
.dark .fi-btn.fi-color-neutral,
.dark .salon-home__button--light {
    background: var(--salon-theme-surface-alt);
    color: var(--salon-theme-ink-soft) !important;
    border-color: var(--salon-theme-border);
}

.dark .fi-btn.fi-color-gray:hover,
.dark .fi-btn.fi-color-neutral:hover,
.dark .salon-home__button--light:hover {
    background: #39475a;
}

.dark .fi-pagination .fi-btn.fi-active,
.dark .fi-tabs-item.fi-active,
.dark .fi-badge.fi-color-primary {
    background: var(--salon-theme-surface-alt);
    color: var(--salon-dark-accent) !important;
}

.dark .salon-home__hero,
.dark .salon-home__hero--admin {
    background: linear-gradient(115deg, #202833, color-mix(in srgb, var(--salon-theme-accent, #a95778) 15%, #202833));
}

.dark .salon-home__hero-art {
    border-color: var(--salon-theme-border);
    background: rgb(255 255 255 / 4%);
}

.dark .salon-home__social-icon {
    background: var(--salon-theme-surface-alt) !important;
    color: var(--salon-dark-accent) !important;
    border-color: var(--salon-theme-border);
}

/* Compact account list: wrap content instead of widening the table. */
.fi-resource-users .fi-ta-table {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
}

.fi-resource-users .fi-ta-table th,
.fi-resource-users .fi-ta-table td {
    padding-inline: clamp(0.4rem, 1vw, 1rem);
    overflow-wrap: anywhere;
}

.fi-resource-users .fi-ta-table .fi-ta-text,
.fi-resource-users .fi-ta-table .fi-ta-text-item,
.fi-resource-users .fi-ta-table .fi-ta-text-description,
.fi-resource-users .fi-ta-table th button,
.fi-resource-users .fi-ta-table th span {
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
}

.fi-resource-users .fi-ta-table th:last-child,
.fi-resource-users .fi-ta-table td:last-child {
    width: 3rem;
}

/* Application footer follows the selected palette; salon contact stays in the header. */
.salon-footer {
    flex-shrink: 0;
    margin-top: auto;
    padding: 0;
    color: var(--salon-theme-ink, #352d33);
}

.salon-footer__inner {
    width: 100%;
    padding: 1rem clamp(1rem, 3vw, 2rem);
    border-top: 1px solid var(--salon-theme-border, #eadfe4);
    border-radius: 0;
    background: color-mix(in srgb, var(--salon-theme-accent, #a95778) 5%, var(--salon-page-background, #fff));
    font-size: 0.8rem;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

.salon-footer__main,
.salon-footer__identity,
.salon-footer__support,
.salon-footer__documents {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1.25rem;
    min-width: 0;
}

.salon-footer__main {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
}

.salon-footer__support {
    flex-wrap: nowrap;
}

.salon-footer__support a {
    white-space: nowrap;
}

.salon-footer__name {
    font-size: 0.85rem;
    font-weight: 650;
}

.salon-footer__author,
.salon-footer__documents-label {
    color: var(--salon-theme-ink-soft, #66555f);
}

.salon-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem 1.25rem;
    margin-top: 0.8rem;
    padding-top: 0.8rem;
    border-top: 1px solid var(--salon-theme-border, #eadfe4);
}

.salon-footer__bottom > .salon-footer__support {
    margin-inline-start: auto;
}

.salon-footer__documents {
    font-size: 0.75rem;
}

.salon-footer a {
    color: var(--salon-theme-strong, #82445f);
    text-decoration: underline;
    text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);
    text-underline-offset: 0.2em;
}

.salon-footer a:hover {
    text-decoration-color: currentColor;
}

.salon-footer a:focus-visible {
    border-radius: 0.2rem;
    outline: 2px solid var(--salon-theme-accent, #a95778);
    outline-offset: 3px;
}

.dark .salon-footer a {
    color: var(--salon-dark-accent, #e7bdcf);
}

@media (max-width: 640px) {
    .salon-footer__main {
        align-items: flex-start;
        flex-direction: column;
        gap: 0.75rem;
    }
}

.dark .salon-footer a:focus-visible {
    outline-color: var(--salon-dark-accent, #e7bdcf);
}



.fi-body-has-topbar .fi-main-ctn:has(> .salon-footer) {
    display: flex;
    flex-direction: column;
    min-height: calc(100dvh - var(--topbar-height));
}

.fi-main-ctn:has(> .salon-footer) > .fi-main {
    flex: 1 0 auto;
    height: auto;
}

.salon-footer__brand {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.95rem;
    text-decoration: none !important;
}

.salon-footer__logo {
    width: 2rem;
    height: 2rem;
    object-fit: contain;
    flex-shrink: 0;
}

.support-contact__actions {
    margin-top: 1.5rem;
}

.support-conversation-message .fi-in-text-item {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}

.salon-footer__wordmark {
    display: block;
    width: 160px;
    max-width: min(45vw, 180px);
    height: auto;
    max-height: 44px;
    object-fit: contain;
    object-position: left center;
}

.salon-footer__wordmark--dark,
.dark .salon-footer__wordmark--light {
    display: none;
}

.dark .salon-footer__wordmark--dark {
    display: block;
}


/* Ninoris belongs to the fixed account area and the login card. */
.ninoris-brand { display: inline-flex; align-items: center; max-width: 100%; }
.ninoris-wordmark { display: block; width: 140px; max-width: 100%; height: auto; object-fit: contain; }
.ninoris-wordmark--dark, .dark .ninoris-wordmark--light { display: none; }
.dark .ninoris-wordmark--dark { display: block; }
.ninoris-brand:focus-visible { outline: 2px solid var(--salon-theme-accent, #a95778); outline-offset: 5px; border-radius: 3px; }
.salon-sidebar-brand { display: flex; flex: 0 0 auto; align-items: center; justify-content: center; padding: .65rem 1.25rem .9rem; border-top: 1px solid var(--salon-theme-border, #eadfe4); }
.salon-footer__bottom { margin-top: 0; padding-top: 0; border-top: 0; }
.fi-simple-main:has(.salon-login-brand) .fi-simple-header img.fi-logo {
    width: auto; height: auto !important; max-width: min(100%, 20rem);
    max-height: clamp(4.5rem, 16dvh, 9rem); object-fit: contain;
}
.salon-login-brand { display: flex; justify-content: flex-end; margin-top: 1.5rem; }
.salon-login-brand .ninoris-wordmark { width: 8rem; max-width: 100%; }
.dark .salon-sidebar-brand { border-color: var(--salon-dark-border, #584653); }


.salon-sidebar-brand { flex-direction: column; gap: .4rem; }
.salon-login-brand { flex-direction: column; align-items: flex-end; gap: .4rem; }
.ninoris-copyright { display: block; max-width: 100%; color: var(--salon-theme-muted, #786575); font-size: .65rem; line-height: 1.5; }
.salon-sidebar-brand .ninoris-copyright { text-align: center; }
.salon-login-brand .ninoris-copyright { text-align: right; }
.dark .ninoris-copyright { color: #cbbdcd; }
/* Grouped client and treatment reviews; palette variables also adapt to dark mode. */
.salon-detail-group > .fi-section {
    border: 1px solid var(--salon-theme-border, #ead7e2);
    border-radius: 1rem;
    overflow: hidden;
    box-shadow: none;
}
.salon-detail-group > .fi-section > .fi-section-header {
    padding: 0.8rem 1rem;
    border-bottom: 1px solid var(--salon-theme-border, #ead7e2);
    background: var(--salon-theme-pastel, #e7e6f5);
}
.salon-detail-group > .fi-section > .fi-section-content-ctn {
    padding: 0;
    background: var(--salon-theme-surface, #fff8fb);
}
.salon-detail-group--history > .fi-section > .fi-section-header,
.salon-detail-group--dates > .fi-section > .fi-section-header {
    background: var(--salon-theme-surface-alt, #edf1f6);
}
.salon-detail-group--history > .fi-section > .fi-section-content-ctn,
.salon-detail-group--dates > .fi-section > .fi-section-content-ctn {
    background: color-mix(in srgb, var(--salon-theme-surface-alt, #edf1f6) 35%, white);
}
.salon-detail-group--note > .fi-section > .fi-section-header {
    background: var(--salon-theme-pastel-alt, #fce3e1);
}
.salon-detail-group .fi-in-text,
.salon-detail-group .fi-in-text-item {
    overflow-wrap: anywhere;
}
.dark .salon-detail-group > .fi-section > .fi-section-header {
    color: var(--salon-theme-ink);
}
.dark .salon-detail-group > .fi-section > .fi-section-content-ctn {
    background: var(--salon-theme-surface);
}
.dark .salon-detail-group--history > .fi-section > .fi-section-content-ctn,
.dark .salon-detail-group--dates > .fi-section > .fi-section-content-ctn {
    background: var(--salon-theme-surface-alt);
}

.salon-detail-group > .fi-section > .fi-section-content-ctn > .fi-section-content {
    padding: 1rem;
}


/* Keep account status visible even in the compact fixed-layout account table. */
.fi-resource-users .salon-account-status {
    min-width: 1.5rem;
}
.fi-resource-users .salon-account-status .fi-icon {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    min-width: 1.5rem;
    flex-shrink: 0;
}
.fi-resource-users .salon-account-status .fi-icon.fi-color-success {
    color: #15803d;
}
.fi-resource-users .salon-account-status .fi-icon.fi-color-danger {
    color: #dc2626;
}
.dark .fi-resource-users .salon-account-status .fi-icon.fi-color-success {
    color: #4ade80;
}
.dark .fi-resource-users .salon-account-status .fi-icon.fi-color-danger {
    color: #fb7185;
}

.salon-login-attempt-status {
    display: block;
    padding: .8rem 1rem;
    border: 1px solid var(--salon-theme-border, #dfc6d4);
    border-radius: .75rem;
    background: var(--salon-theme-surface-alt, #f6edf2);
    color: var(--salon-theme-ink, #352d33);
    font-size: .875rem;
    line-height: 1.6;
}
.salon-login-attempt-status__line { display: block; }
.salon-login-attempt-status__line + .salon-login-attempt-status__line { margin-top: .5rem; }

/* Visible, centered feedback; header and forms remain reachable. */
.fi-no.fi-align-center.fi-vertical-align-start {
    --notification-top: max(calc(var(--salon-shell-height, 0px) + 1rem), min(24dvh, 12rem));
    top: var(--notification-top);
    bottom: auto;
    max-width: 34rem;
    max-height: calc(100dvh - var(--notification-top) - 1rem);
    overflow-y: auto;
    flex-direction: column;
    justify-content: flex-start;
    z-index: 60;
}
.fi-no .fi-no-notification:not(.fi-inline) {
    width: 100%;
    max-width: 34rem;
    padding: 1.1rem 1.25rem;
    border: 1px solid var(--salon-theme-border, #d7b9cb);
    border-inline-start: 5px solid var(--salon-theme-accent, #a95778);
    background: var(--salon-theme-surface, #fff8fb);
    box-shadow: 0 12px 36px rgb(35 20 35 / 22%);
}
.fi-no .fi-no-notification.fi-status-success { border-inline-start-color: #15803d; }
.fi-no .fi-no-notification.fi-status-danger { border-inline-start-color: #dc2626; }
.fi-no .fi-no-notification.fi-status-warning { border-inline-start-color: #b45309; }
.fi-no .fi-no-notification-title {
    font-size: 1rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--salon-theme-ink, #352d33);
}
.fi-no .fi-no-notification-body {
    font-size: .95rem;
    line-height: 1.55;
    color: var(--salon-theme-ink-soft, #554653);
}
.fi-no .fi-no-notification-close-btn { min-width: 2rem; min-height: 2rem; }
.dark .fi-no .fi-no-notification:not(.fi-inline) {
    background: var(--salon-theme-surface, #243041);
    border-color: var(--salon-theme-border, #596477);
}
.dark .fi-no .fi-no-notification.fi-status-success { border-inline-start-color: #4ade80; }
.dark .fi-no .fi-no-notification.fi-status-danger { border-inline-start-color: #fb7185; }
.dark .fi-no .fi-no-notification.fi-status-warning { border-inline-start-color: #fbbf24; }

/* Authorship belongs to the viewed record, beside the modal controls. */
.salon-record-attribution { order: 99; margin-inline-start: auto; align-self: center; max-width: 65%; text-align: end; font-size: .75rem; line-height: 1.5; color: var(--salon-theme-muted, #6b7280); overflow-wrap: anywhere; }
@media (max-width: 640px) { .salon-record-attribution { flex-basis: 100%; max-width: 100%; text-align: start; margin-inline-start: 0; } }

.salon-home__stats.salon-home__appointment-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.salon-schedule-choice { display:flex; align-items:center; gap:.75rem; font-size:.875rem; color:var(--salon-theme-muted, #6b7280); }
.salon-schedule-choice select { border:1px solid var(--salon-theme-accent, #a8557a); border-radius:.75rem; padding:.6rem 2rem .6rem .75rem; background:var(--salon-theme-surface, #fff); color:var(--salon-theme-ink, #302633); }
.salon-schedule-time { font-size:1.2rem; font-weight:700; min-width:5rem; color:var(--salon-theme-accent, #a8557a); }
.salon-schedule-time small { display:block; font-size:.75rem; font-weight:400; }
.salon-schedule-footer { display:flex; justify-content:flex-end; padding-top:1.25rem; }
@media(max-width:640px) { .salon-home__stats.salon-home__appointment-counts { grid-template-columns:1fr; } .salon-schedule-choice { flex-wrap:wrap; } }

.salon-home__schedule .salon-home__treatment { grid-template-columns: 5rem minmax(0, 1fr) auto; }

/* Time-grid calendar; shares the salon's active palette in light and dark mode. */
.ninoris-calendar { border:1px solid var(--salon-theme-border, #eadce5); border-radius:1rem; overflow:hidden; background:var(--salon-theme-surface, #fff); color:var(--salon-theme-ink, #352d33); }
.ninoris-calendar-toolbar { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; padding:1rem; }
.ninoris-calendar-toolbar h2 { font-size:1.1rem; font-weight:700; }
.ninoris-calendar-toolbar button { padding:.4rem .8rem; border:1px solid var(--salon-theme-accent, #a95778); border-radius:.6rem; }
.ninoris-calendar-toolbar span { margin-inline-start:auto; font-size:.75rem; color:var(--salon-theme-muted, #706570); }
.ninoris-calendar-key { display:inline-block; width:.8rem; height:.8rem; background:repeating-linear-gradient(135deg,transparent 0 3px,rgb(120 110 120 / 15%) 3px 6px); }
.ninoris-calendar-scroll { overflow:auto; max-height:75vh; }
.ninoris-calendar-grid { display:grid; grid-template-columns:64px repeat(var(--calendar-columns),minmax(170px,1fr)); min-width:calc(64px + var(--calendar-columns) * 170px); }
.ninoris-calendar-column-heading { position:sticky; top:0; z-index:4; height:64px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:.5rem; text-align:center; border-bottom:1px solid var(--salon-theme-border,#eadce5); background:var(--salon-theme-surface-alt,#f5edf5); font-size:.85rem; }
.ninoris-calendar-column-heading small { font-size:.7rem; }
.ninoris-calendar-times { position:sticky; left:0; z-index:5; background:var(--salon-theme-surface,#fff); }
.ninoris-calendar-tick { height:32px; font-size:.7rem; text-align:center; border-top:1px solid var(--salon-theme-border,#eadce5); color:var(--salon-theme-muted,#706570); }
.ninoris-calendar-track { position:relative; border-inline-start:1px solid var(--salon-theme-border,#eadce5); }
.ninoris-calendar-slot { display:block; width:100%; height:32px; border-bottom:1px solid var(--salon-theme-border,#eadce5); background:rgb(var(--salon-theme-rgb,169 87 120) / 3%); text-align:center; }
.ninoris-calendar-slot span { opacity:0; color:var(--salon-theme-accent,#a95778); }
.ninoris-calendar-slot:not(:disabled):hover { background:rgb(var(--salon-theme-rgb,169 87 120) / 18%); }
.ninoris-calendar-slot:not(:disabled):hover span,.ninoris-calendar-slot:focus-visible span { opacity:1; }
.ninoris-calendar-slot.is-unavailable { background:repeating-linear-gradient(135deg,transparent 0 4px,rgb(120 110 120 / 12%) 4px 7px); cursor:not-allowed; }
.ninoris-calendar-event { position:absolute; z-index:2; display:flex; flex-direction:column; align-items:flex-start; gap:2px; overflow:hidden; padding:5px 7px; text-align:start; border:1px solid var(--salon-theme-accent,#a95778); border-inline-start:4px solid var(--salon-theme-accent,#a95778); border-radius:.5rem; background:var(--salon-theme-surface-alt,#f4e3ee); color:var(--salon-theme-ink,#352d33); font-size:.75rem; }
.ninoris-calendar-event strong { font-size:.7rem; font-weight:700; }
.ninoris-calendar-event span { font-weight:600; }
.ninoris-calendar-event small { font-size:.7rem; }
.ninoris-calendar-event.is-conflict { border-color:#c55f43; }
.ninoris-calendar-notice { padding:1rem; background:rgb(var(--salon-theme-rgb,169 87 120) / 9%); }
@media(max-width:640px) { .ninoris-calendar-toolbar { gap:.5rem; } .ninoris-calendar-toolbar span { width:100%; margin:0; } }

/* Fit the salon overview to the available width. Daily columns stack on phones. */
.ninoris-calendar-grid { grid-template-columns:52px repeat(var(--calendar-columns),minmax(0,1fr)); min-width:0; width:100%; }
.ninoris-calendar-column { min-width:0; }
.ninoris-calendar-column-heading { overflow-wrap:anywhere; }
.ninoris-calendar-scroll { overflow-x:hidden; }
.ninoris-slot-time { display:none; }
.ninoris-calendar-slot { position:relative; }
.ninoris-calendar-event.is-unassigned,.ninoris-week-event.is-unassigned { border-style:dashed; border-color:#a56a22; }
.ninoris-calendar-week-help { padding:0 1rem 1rem; font-size:.8rem; color:var(--salon-theme-muted,#706570); }
.ninoris-calendar-week-scroll { max-height:75vh; overflow-y:auto; overflow-x:hidden; }
.ninoris-calendar-week { width:100%; table-layout:fixed; border-collapse:collapse; font-size:.75rem; }
.ninoris-calendar-week .ninoris-week-time-col { width:48px; }
.ninoris-calendar-week th,.ninoris-calendar-week td { border:1px solid var(--salon-theme-border,#eadce5); vertical-align:top; overflow-wrap:anywhere; }
.ninoris-calendar-week thead th { position:sticky; top:0; z-index:4; padding:.5rem .15rem; background:var(--salon-theme-surface-alt,#f5edf5); text-align:center; }
.ninoris-calendar-week thead th button { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:.25rem; width:100%; }
.ninoris-calendar-week thead small { display:block; font-size:.65rem; font-weight:400; }
.ninoris-calendar-week tbody th { padding:.4rem .15rem; font-size:.65rem; color:var(--salon-theme-muted,#706570); }
.ninoris-week-cell { padding:3px; height:68px; }
.ninoris-week-cell.is-unavailable { background:repeating-linear-gradient(135deg,transparent 0 4px,rgb(120 110 120 / 8%) 4px 7px); }
.ninoris-week-event { width:100%; display:flex; flex-direction:column; gap:2px; margin-bottom:4px; padding:4px; border:1px solid var(--salon-theme-accent,#a95778); border-inline-start-width:3px; border-radius:.35rem; background:var(--salon-theme-surface-alt,#f4e3ee); color:var(--salon-theme-ink,#352d33); text-align:start; }
.ninoris-week-event strong { font-size:.65rem; }
.ninoris-week-event small { font-size:.65rem; }
.ninoris-week-event.is-conflict { border-color:#c55f43; }
.ninoris-week-add { width:100%; border-radius:.3rem; padding:3px; color:var(--salon-theme-accent,#a95778); font-weight:700; }
.ninoris-week-add:hover { background:rgb(var(--salon-theme-rgb,169 87 120) / 12%); }
.ninoris-week-mobile-count { display:none; }
@media(max-width:700px) {
 .ninoris-calendar-day-grid { grid-template-columns:minmax(0,1fr); }
 .ninoris-calendar-day-grid .ninoris-calendar-times { display:none; }
 .ninoris-calendar-day-grid .ninoris-calendar-track { margin-inline-start:42px; }
 .ninoris-calendar-slot .ninoris-slot-time { display:block; position:absolute; left:-42px; width:38px; text-align:center; font-size:.65rem; opacity:1; color:var(--salon-theme-muted,#706570); }
 .ninoris-calendar-week .ninoris-week-time-col { width:36px; }
 .ninoris-calendar-week th,.ninoris-calendar-week td { padding:2px; font-size:.6rem; }
 .ninoris-calendar-week thead small { font-size:.5rem; }
 .ninoris-week-event { display:none; }
 .ninoris-week-mobile-count { display:block; width:100%; padding:5px 0; font-weight:700; color:var(--salon-theme-accent,#a95778); }
 .ninoris-week-cell { height:52px; }
 .ninoris-week-add { padding:0; }
}

.ninoris-calendar-column-heading strong { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-width:100%; }

.ninoris-calendar-day-grid .ninoris-calendar-column-heading { height:80px; }

.ninoris-week-ongoing { display:block; margin:.25rem; font-size:.65rem; color:var(--salon-theme-muted,#706570); border-inline-start:2px solid var(--salon-theme-accent,#a95778); padding-inline-start:.35rem; }
.ninoris-work-parts > table { width:100%; table-layout:fixed; border-collapse:collapse; }
.ninoris-work-parts > table > thead { background:var(--salon-theme-surface-alt,#f4e3ee); }
.ninoris-work-parts > table th,.ninoris-work-parts > table td { padding:.75rem .5rem; text-align:start; vertical-align:top; overflow-wrap:anywhere; border-bottom:1px solid var(--salon-theme-border,#eadce5); }
@media(max-width:700px) { .ninoris-week-ongoing { display:none; } }

/* Stable booking colors: both working parts share the parent booking tone. */
.ninoris-tone-0 { --event-tint:#e5edf7; --event-edge:#45658e; }
.ninoris-tone-1 { --event-tint:#ede5f2; --event-edge:#785b8a; }
.ninoris-tone-2 { --event-tint:#e1eee7; --event-edge:#416e59; }
.ninoris-tone-3 { --event-tint:#f5e8da; --event-edge:#8a623b; }
.ninoris-tone-4 { --event-tint:#e0eff0; --event-edge:#397078; }
.ninoris-tone-5 { --event-tint:#f2e4eb; --event-edge:#89566e; }
.ninoris-tone-6 { --event-tint:#ececde; --event-edge:#6b6d3e; }
.ninoris-tone-7 { --event-tint:#e5e9ee; --event-edge:#54657a; }
.ninoris-calendar-event, .ninoris-week-event {
    background:var(--event-tint); border-color:var(--event-edge); color:#252c35;
}
.ninoris-calendar-event.is-past, .ninoris-week-event.is-past {
    background:color-mix(in srgb,var(--event-tint) 35%,white);
    border-style:dashed; border-inline-start-style:solid; color:#46505b;
}
.ninoris-event-state { font-weight:600; }
.ninoris-calendar-event.is-current, .ninoris-week-event.is-current {
    box-shadow:inset 0 0 0 1px var(--event-edge);
}
.ninoris-calendar-event.is-conflict, .ninoris-week-event.is-conflict { outline:2px solid #b74c30; outline-offset:-2px; }
.ninoris-calendar-event:focus-visible, .ninoris-week-event:focus-visible {
    outline:3px solid var(--salon-theme-focus,#77516d); outline-offset:2px;
}
.dark .ninoris-calendar-event, .dark .ninoris-week-event {
    background:color-mix(in srgb,var(--event-edge) 28%,#19212c);
    border-color:color-mix(in srgb,var(--event-edge) 60%,white); color:#f0f3f7;
}
.dark .ninoris-calendar-event.is-past, .dark .ninoris-week-event.is-past {
    background:#242c37; color:#cbd3df;
}
:root:not(.dark) { --salon-page-background:var(--salon-theme-page-background,color-mix(in srgb,var(--salon-rose) 7%,#fff)); }

.dark .ninoris-week-add, .dark .ninoris-week-mobile-count,
.dark .ninoris-calendar-toolbar button { color:var(--salon-dark-accent,#d6b8ce); }

.fi-no.fi-align-center.fi-vertical-align-start:has(.fi-no-notification) { pointer-events:auto; }

/* One geometry and spacing system for every selected palette. */
:root .fi-section, :root .fi-ta-ctn, :root .fi-dropdown-panel, :root .fi-notification,
:root .salon-home__activity, :root .salon-home__stat, :root .ninoris-calendar,
:root .salon-detail-group > .fi-section, :root .salon-settings-page__intro {
    border-radius:6px; box-shadow:none;
}
:root .fi-modal-window, :root .fi-simple-main { border-radius:8px; }
:root .fi-btn, :root .fi-input-wrp, :root .fi-sidebar-item-btn,
:root .fi-fo-repeater-item, :root .salon-home__button,
:root .ninoris-calendar-event, :root .ninoris-week-event,
:root .ninoris-calendar-toolbar button, :root .salon-home__social-icon,
:root .salon-home__notice, :root .salon-home__note { border-radius:4px; }
:root .fi-btn { box-shadow:none; }
:root .fi-main { background-image:none; }
:root .salon-home__hero { border-radius:6px; }
.fi-page { gap:1rem; }
.fi-sidebar-item-btn { min-height:2.5rem; }
.salon-detail-group--history > .fi-section > .fi-section-header,
.salon-detail-group--dates > .fi-section > .fi-section-header {
    background:var(--salon-theme-secondary-pastel);
}
.dark .salon-detail-group--history > .fi-section > .fi-section-header,
.dark .salon-detail-group--dates > .fi-section > .fi-section-header {
    background:color-mix(in srgb,var(--salon-theme-secondary) 22%,#202833);
}

:root .salon-schedule-choice select, :root .salon-login-attempt-status { border-radius:4px; }
@media(max-width:640px) {
    :root .salon-home__stats.salon-home__appointment-counts { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

.ninoris-shift-calendar, .ninoris-shift-incomplete {
    border: 1px solid var(--salon-theme-border, #e4d4dc);
    border-radius: .6rem;
    padding: .75rem;
}
.ninoris-shift-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin-block: .4rem; }
.ninoris-shift-toolbar > button:not(.fi-btn), .ninoris-shift-toolbar select, .ninoris-shift-incomplete button {
    border: 1px solid var(--salon-theme-border, #e4d4dc);
    border-radius: .35rem;
    padding: .35rem .55rem;
}
.ninoris-shift-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .25rem; margin-block: .75rem; }
.ninoris-shift-weekday { text-align: center; font-size: .8rem; }
.ninoris-shift-day { display: grid; gap: .15rem; align-content: start; min-height: 3.5rem; border: 1px solid var(--salon-theme-border, #e4d4dc); border-radius: .3rem; padding: .3rem; text-align: left; }
.ninoris-shift-day span { font-size: .72rem; overflow-wrap: anywhere; }
.ninoris-shift-day.is-filled { background: color-mix(in srgb, #46856d 13%, transparent); }
.ninoris-shift-day.is-missing { background: color-mix(in srgb, #c58a43 15%, transparent); }
.ninoris-shift-day.is-closed, .ninoris-shift-day.is-off { background: color-mix(in srgb, GrayText 12%, transparent); }
.ninoris-shift-day[aria-pressed="true"] { outline: 2px solid var(--salon-theme-accent, #a95778); outline-offset: -2px; }
.ninoris-shift-incomplete summary { cursor: pointer; font-weight: 600; }
.ninoris-shift-incomplete button { margin: .35rem .3rem 0 0; }
@media (max-width: 480px) {
    .ninoris-shift-calendar { padding: .4rem; }
    .ninoris-shift-day { min-height: 3.6rem; padding: .18rem; }
    .ninoris-shift-day span { font-size: .64rem; }
}

.ninoris-month-table { width: 100%; table-layout: fixed; border-collapse: collapse; text-align: center; font-size: .85rem; }
.ninoris-month-table th { padding: .55rem .15rem; }
.ninoris-month-cell { border: 1px solid var(--salon-theme-border, #e4d4dc); padding: 0; }
.ninoris-month-day { display: grid; gap: .15rem; place-content: center; min-height: 3.4rem; width: 100%; padding: .3rem .1rem; }
.ninoris-month-day:hover, .ninoris-month-day.is-today { background: color-mix(in srgb, var(--salon-theme-accent, #a95778) 14%, transparent); }
.ninoris-month-day.is-today { font-weight: 700; }
.ninoris-month-day.is-outside { opacity: .65; }
@media (max-width: 480px) { .ninoris-month-count-label { display: none; } }

.salon-settings-page__form .fi-section:not(.fi-section-not-contained) {
    border: 1px solid var(--salon-theme-border, #e4d4dc);
}

.salon-settings-page__form .fi-section:not(.fi-section-not-contained) > .fi-section-header {
    margin: 0;
    border-bottom: 1px solid var(--salon-theme-border, #e4d4dc);
    background: color-mix(in srgb, var(--salon-theme-accent, #a95778) 9%, var(--salon-theme-surface, #fff));
}

.salon-settings-page__form .fi-section:not(.fi-section-not-contained) > .fi-section-content-ctn {
    border-top: 0;
}

.ninoris-booking-section.fi-section {
    border: 1px solid var(--salon-theme-border, #e4d4dc);
}
.ninoris-booking-section.fi-section > .fi-section-header {
    border-bottom: 1px solid var(--salon-theme-border, #e4d4dc);
    background: color-mix(in srgb, var(--salon-theme-accent, #a95778) 9%, var(--salon-theme-surface, #fff));
}
.ninoris-booking-availability {
    margin-block: .25rem;
    padding: .65rem .8rem;
    border-inline-start: 3px solid var(--salon-theme-accent, #a95778);
    background: color-mix(in srgb, var(--salon-theme-accent, #a95778) 7%, var(--salon-theme-surface, #fff));
    font-size: .875rem;
}
.ninoris-booking-availability summary { cursor: pointer; margin-top: .35rem; }