body { background:#f6f7fb; }
.navbar-brand { font-weight:700; }
.card { border:0; border-radius:16px; box-shadow:0 8px 24px rgba(20,20,40,.06); }
.table td, .table th { vertical-align:middle; }
.badge { font-size:.8rem; }

.booking-shell {
    display:grid;
    grid-template-columns:minmax(300px, 40vw) 1fr;
    min-height:100vh;
    background:#fff;
}

.booking-photo {
    min-height:100vh;
    overflow:hidden;
    background:#000;
    display:grid;
    place-items:center;
    padding:0;
}

.booking-photo img {
    width:100%;
    height:100%;
    min-height:100vh;
    object-fit:cover;
    object-position:center;
    display:block;
}

.quick-contact-dock {
    position:fixed;
    right:24px;
    top:50%;
    transform:translateY(-50%);
    z-index:30;
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:10px 8px;
    border:1px solid rgba(17, 17, 17, .08);
    border-radius:999px;
    background:rgba(255, 255, 255, .94);
    box-shadow:0 18px 44px rgba(15, 23, 42, .14);
    backdrop-filter:blur(10px);
}

.quick-contact-toggle,
.quick-contact-list a {
    position:relative;
    width:46px;
    height:46px;
    border:0;
    border-radius:50%;
    display:grid;
    place-items:center;
    background:transparent;
    color:#050505;
    font-size:23px;
    text-decoration:none;
    transition:background .18s, color .18s, transform .18s;
}

.quick-contact-toggle:hover,
.quick-contact-toggle:focus-visible,
.quick-contact-list a:hover,
.quick-contact-list a:focus-visible {
    background:#050505;
    color:#fff;
    outline:0;
}

.quick-contact-toggle {
    cursor:pointer;
}

.quick-contact-list {
    display:grid;
    gap:4px;
    max-height:0;
    opacity:0;
    overflow:hidden;
    transition:max-height .24s ease, opacity .18s ease, margin-top .24s ease;
}

.quick-contact-list a {
    transform:translateY(-8px);
    pointer-events:none;
}

.quick-contact-list a.is-empty {
    color:#9a9a9a;
}

.quick-contact-dock:focus-within .quick-contact-list,
.quick-contact-dock.open .quick-contact-list {
    max-height:360px;
    opacity:1;
    margin-top:6px;
    overflow:visible;
}

.quick-contact-dock:focus-within .quick-contact-list a,
.quick-contact-dock.open .quick-contact-list a {
    transform:translateY(0);
    pointer-events:auto;
}

.quick-contact-list a::after {
    content:attr(data-tooltip);
    position:absolute;
    right:calc(100% + 12px);
    top:50%;
    transform:translate(8px, -50%);
    width:max-content;
    max-width:210px;
    padding:8px 10px;
    border-radius:6px;
    background:rgba(5, 5, 5, .88);
    color:#fff;
    font-size:14px;
    line-height:1.2;
    opacity:0;
    pointer-events:none;
    white-space:nowrap;
    transition:opacity .18s, transform .18s;
}

.quick-contact-list a:hover::after,
.quick-contact-list a:focus-visible::after {
    opacity:1;
    transform:translate(0, -50%);
}

.booking-panel {
    position:relative;
    display:flex;
    flex-direction:column;
    justify-content:center;
    width:min(660px, 84%);
    margin:0 auto;
    padding:36px 0;
    isolation:isolate;
}

.booking-panel > *:not(.booking-line-art) {
    position:relative;
    z-index:1;
}

.booking-line-art {
    position:absolute;
    inset:0;
    pointer-events:none;
    z-index:0;
}

.line-art-img {
    position:absolute;
    display:block;
    width:min(500px, 52vw);
    opacity:.2;
    mix-blend-mode:multiply;
    filter:contrast(1.35);
}

.scissors-art {
    right:-92px;
    top:10%;
    transform:rotate(-8deg);
}

.comb-art {
    right:-74px;
    bottom:10%;
    transform:rotate(-4deg);
}

.scissors-art-small {
    width:min(360px, 38vw);
    left:6%;
    right:auto;
    top:70%;
    opacity:.13;
    transform:rotate(-15deg);
}

.comb-art-small {
    width:min(350px, 36vw);
    left:2%;
    right:auto;
    top:8%;
    bottom:auto;
    opacity:.12;
    transform:rotate(8deg);
}

.brand-lockup {
    text-align:center;
    margin-bottom:30px;
    color:#050505;
}

.brand-main {
    font-size:clamp(38px, 4.8vw, 68px);
    line-height:.9;
    font-weight:800;
    letter-spacing:0;
}

.brand-main span {
    font-weight:200;
    color:#3f3f3f;
}

.brand-sub {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    margin-top:12px;
    font-size:clamp(20px, 2.3vw, 32px);
    font-weight:200;
    color:#626262;
}

.brand-sub::before,
.brand-sub::after {
    content:"";
    width:120px;
    max-width:22vw;
    height:1px;
    background:#989898;
}

.booking-steps {
    display:flex;
    justify-content:center;
    align-items:center;
    margin-bottom:28px;
}

.step-dot {
    position:relative;
    width:68px;
    height:68px;
    border-radius:50%;
    border:2px solid #dedede;
    background:#fff;
    color:#696969;
    font-size:23px;
    display:grid;
    place-items:center;
    flex:0 0 auto;
    transition:border-color .2s, color .2s;
}

.step-dot + .step-dot {
    margin-left:12px;
}

.step-dot + .step-dot::before {
    content:"";
    position:absolute;
    width:14px;
    height:2px;
    background:#dedede;
    right:100%;
    top:50%;
}

.step-dot.active {
    border-color:#030303;
    color:#030303;
}

.booking-form h1 {
    font-size:26px;
    font-weight:500;
    margin:0 0 16px;
    color:#050505;
}

.section-line {
    width:100%;
    height:2px;
    background:linear-gradient(90deg, #050505 0 126px, #dddddd 126px 100%);
    margin-bottom:26px;
}

.booking-step {
    display:none;
}

.booking-step.active {
    display:block;
}

.phone-control {
    display:grid;
    grid-template-columns:74px 1fr 52px;
    align-items:center;
    border:1px solid #ddd;
    height:54px;
    background:#fff;
    margin-top:4px;
}

.phone-control span {
    height:100%;
    display:grid;
    place-items:center;
    border-right:1px solid #ddd;
    font-size:18px;
    color:#555;
}

.phone-control input {
    width:100%;
    height:100%;
    border:0;
    outline:0;
    padding:0 18px;
    font-size:19px;
}

.phone-control i {
    width:30px;
    height:30px;
    border-radius:0 16px 16px 0;
    background:#dedede;
    color:#fff;
    display:grid;
    place-items:center;
}

.field-hint {
    color:#555;
    margin:6px 0 0;
    font-size:16px;
}

.phone-status {
    min-height:22px;
    margin:8px 0 0;
    font-size:15px;
    font-weight:650;
}

.phone-status.error {
    color:#b42318;
}

.phone-status.success {
    color:#147a3d;
}

.form-actions {
    display:flex;
    justify-content:flex-end;
    margin-top:36px;
}

.form-actions.split {
    justify-content:space-between;
}

.btn-next,
.btn-back {
    border:0;
    min-height:54px;
    padding:0 22px;
    font-size:17px;
}

.btn-next {
    min-width:210px;
    border-radius:8px;
    background:#000;
    color:#fff;
}

.btn-back {
    min-width:130px;
    background:#f0f0f0;
    color:#111;
    border-radius:8px;
}

.booking-form .form-control,
.booking-form .form-select {
    border-radius:0;
    min-height:48px;
}

.booking-form textarea.form-control {
    min-height:110px;
}

.time-slot-grid {
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap:10px;
}

.time-slot-button {
    min-height:40px;
    border:1px solid #1f8f4d;
    border-radius:6px;
    background:#ecfdf3;
    color:#136c38;
    font-size:16px;
    font-weight:700;
    transition:transform .16s, box-shadow .16s, border-color .16s;
}

.time-slot-button:hover:not(:disabled),
.time-slot-button:focus-visible {
    transform:translateY(-1px);
    box-shadow:0 10px 22px rgba(15, 23, 42, .1);
    outline:0;
}

.time-slot-button.busy {
    border-color:#d92d20;
    background:#fdecec;
    color:#b42318;
    cursor:not-allowed;
    opacity:1;
}

.time-slot-button.selected {
    border-color:#050505;
    background:#050505;
    color:#fff;
}

.time-slot-legend {
    display:flex;
    align-items:center;
    gap:8px;
    margin:10px 0 0;
    color:#555;
    font-size:14px;
}

.legend-available,
.legend-busy {
    width:14px;
    height:14px;
    border-radius:3px;
    display:inline-block;
}

.legend-available {
    background:#27ae60;
}

.legend-busy {
    margin-left:10px;
    background:#d92d20;
}

.barber-card-list {
    display:grid;
    gap:14px;
    max-height:430px;
    overflow:auto;
    padding:2px 6px 2px 0;
}

.barber-card {
    position:relative;
    display:grid;
    grid-template-columns:42px 88px 1fr;
    gap:18px;
    align-items:center;
    min-height:178px;
    border:1px solid #d9d9d9;
    border-radius:10px;
    padding:20px;
    background:#fff;
    cursor:pointer;
    transition:border-color .18s, box-shadow .18s, transform .18s;
}

.barber-card:hover {
    border-color:#111;
    box-shadow:0 12px 28px rgba(15, 23, 42, .08);
    transform:translateY(-1px);
}

.barber-card.selected {
    border-color:#111;
    box-shadow:0 14px 32px rgba(15, 23, 42, .1);
}

.barber-card input {
    position:absolute;
    opacity:0;
    pointer-events:none;
}

.barber-radio {
    width:28px;
    height:28px;
    border:3px solid #111;
    border-radius:50%;
    display:block;
}

.barber-card input:checked + .barber-radio {
    border-width:8px;
}

.barber-avatar {
    width:78px;
    height:78px;
    border-radius:50%;
    background:#0a0a0a;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:30px;
    font-weight:700;
    border:3px solid #f1f1f1;
}

.barber-photo {
    object-fit:cover;
    display:block;
    background:#f3f3f3;
}

.barber-info {
    display:grid;
    gap:7px;
}

.barber-info strong {
    font-size:25px;
    line-height:1.05;
}

.barber-info em {
    color:#666;
    font-size:18px;
    font-style:normal;
}

.barber-info small {
    color:#777;
    font-size:15px;
}

.barber-busy-list {
    display:grid;
    gap:6px;
    margin-top:4px;
}

.busy-pill,
.available-pill,
.barber-hours {
    display:inline-flex;
    align-items:center;
    gap:8px;
    width:max-content;
    max-width:100%;
    border-radius:6px;
    padding:7px 10px;
    font-size:14px;
}

.busy-pill {
    background:#fff4c7;
    color:#765f00;
}

.available-pill {
    background:#ecfdf3;
    color:#147a3d;
}

.barber-hours {
    color:#777;
    padding-left:0;
}

@media (max-width: 992px) {
    .booking-shell {
        grid-template-columns:1fr;
        min-height:auto;
    }

    .booking-photo {
        display:none;
    }

    .booking-panel {
        width:min(680px, 92%);
        padding:40px 0 112px;
    }

    .quick-contact-dock {
        right:50%;
        top:auto;
        bottom:18px;
        transform:translateX(50%);
        flex-direction:row;
        padding:8px 10px;
        max-width:calc(100vw - 24px);
    }

    .quick-contact-toggle,
    .quick-contact-list a {
        width:42px;
        height:42px;
        font-size:21px;
    }

    .quick-contact-list {
        grid-auto-flow:column;
        max-width:0;
        max-height:none;
        transition:max-width .24s ease, opacity .18s ease, margin-left .24s ease;
    }

    .quick-contact-list a {
        transform:translateX(8px);
    }

    .quick-contact-dock:focus-within .quick-contact-list,
    .quick-contact-dock.open .quick-contact-list {
        max-width:360px;
        margin-top:0;
        margin-left:6px;
        overflow:visible;
    }

    .quick-contact-dock:focus-within .quick-contact-list a,
    .quick-contact-dock.open .quick-contact-list a {
        transform:translateX(0);
    }

    .quick-contact-list a::after {
        right:50%;
        top:auto;
        bottom:calc(100% + 8px);
        transform:translate(50%, 8px);
    }

    .quick-contact-list a:hover::after,
    .quick-contact-list a:focus-visible::after {
        transform:translate(50%, 0);
    }

    .booking-line-art {
        display:none;
    }

    .step-dot {
        width:58px;
        height:58px;
        font-size:20px;
    }

    .step-dot + .step-dot {
        margin-left:8px;
    }

    .step-dot + .step-dot::before {
        width:10px;
    }

    .form-actions,
    .form-actions.split {
        gap:12px;
        flex-direction:column-reverse;
        margin-top:36px;
    }

    .btn-next,
    .btn-back {
        width:100%;
        min-width:0;
    }

    .barber-card-list {
        max-height:none;
    }

    .barber-card {
        grid-template-columns:34px 64px 1fr;
        gap:12px;
        min-height:150px;
        padding:16px;
    }

    .barber-avatar {
        width:60px;
        height:60px;
        font-size:22px;
    }

    .barber-info strong {
        font-size:20px;
    }

    .barber-info em {
        font-size:16px;
    }

    .busy-pill,
    .available-pill,
    .barber-hours {
        width:100%;
        font-size:13px;
    }

    .time-slot-grid {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

.admin-topbar {
    position:sticky;
    top:0;
    z-index:20;
    background:#fff;
    border-bottom:1px solid #e9e9e9;
    box-shadow:0 2px 12px rgba(15, 23, 42, .04);
}

.admin-nav {
    display:flex;
    align-items:stretch;
    gap:4px;
    max-width:1280px;
    margin:0 auto;
    padding:14px 18px 0;
    overflow-x:auto;
}

.admin-nav-item,
.admin-account button {
    min-width:82px;
    min-height:68px;
    border:0;
    border-bottom:2px solid transparent;
    background:transparent;
    color:#333;
    text-decoration:none;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    font-size:13px;
    white-space:nowrap;
}

.admin-nav-item i,
.admin-account i {
    font-size:18px;
}

.admin-nav-item.active {
    border-bottom-color:#111;
    color:#000;
    font-weight:600;
}

.admin-account {
    margin-left:auto;
}

.admin-account button {
    min-width:130px;
}

.admin-page {
    max-width:1280px;
    margin:0 auto;
    padding:34px 18px 56px;
}

.admin-title {
    display:flex;
    align-items:center;
    gap:10px;
    color:#111;
}

.admin-title h1 {
    margin:0;
    font-size:24px;
    font-weight:650;
}

.admin-title i {
    font-size:22px;
}

.admin-toolbar,
.admin-card-head,
.calendar-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-bottom:20px;
}

.toolbar-actions {
    display:flex;
    gap:0;
    overflow:hidden;
    border-radius:6px;
}

.dark-action,
.green-action,
.cyan-action,
.outline-action {
    min-height:44px;
    padding:0 18px;
    border:1px solid #111;
    display:inline-flex;
    align-items:center;
    gap:8px;
    text-decoration:none;
    font-weight:600;
    font-size:14px;
}

.dark-action {
    background:#111;
    color:#fff;
    border-color:#111;
    border-radius:6px;
}

.green-action {
    background:#159447;
    color:#fff;
    border-color:#159447;
}

.cyan-action {
    background:#11a8c9;
    color:#fff;
    border-color:#11a8c9;
}

.outline-action {
    color:#111;
    background:#fff;
    border-radius:6px;
}

.metric-grid {
    display:grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap:14px;
    margin:22px 0;
}

.metric-card,
.admin-card,
.filter-card {
    background:#fff;
    border:1px solid #ececec;
    border-radius:8px;
    box-shadow:0 8px 22px rgba(15, 23, 42, .035);
}

.metric-card {
    display:flex;
    align-items:center;
    gap:14px;
    padding:20px;
}

.metric-card span {
    color:#667085;
    font-size:13px;
}

.metric-card strong {
    display:block;
    font-size:26px;
    line-height:1.1;
    color:#151515;
}

.metric-icon {
    width:46px;
    height:46px;
    border-radius:8px;
    display:grid;
    place-items:center;
    font-size:22px;
}

.metric-icon.blue { background:#eef2ff; color:#4054d6; }
.metric-icon.green { background:#ebf7ef; color:#23814a; }
.metric-icon.cyan { background:#eaf9fb; color:#178ba1; }
.metric-icon.yellow { background:#fff8df; color:#b88600; }

.admin-grid {
    display:grid;
    grid-template-columns:360px 1fr;
    gap:18px;
}

.admin-card {
    padding:20px;
}

.admin-card-title {
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:650;
}

.staff-card {
    text-align:center;
}

.staff-avatar {
    width:92px;
    height:92px;
    border-radius:50%;
    margin:26px auto 16px;
    background:#111;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:38px;
    font-weight:700;
}

.staff-card h2 {
    margin:0;
    font-size:20px;
}

.staff-card p,
.staff-card span {
    color:#667085;
    margin:4px 0 0;
}

.staff-card strong {
    display:block;
    margin-top:18px;
    font-size:20px;
}

.admin-table {
    width:100%;
    border-collapse:collapse;
    font-size:14px;
}

.admin-table th,
.admin-table td {
    border-bottom:1px solid #eee;
    padding:13px 12px;
    vertical-align:middle;
}

.admin-table th {
    color:#404040;
    font-weight:650;
    background:#fff;
}

.admin-table small {
    display:block;
    color:#667085;
    margin-top:4px;
}

.row-icon,
.avatar-mini {
    width:30px;
    height:30px;
    border-radius:50%;
    display:inline-grid;
    place-items:center;
    margin-right:8px;
    background:#eef2ff;
    color:#4054d6;
    font-weight:700;
}

.avatar-photo {
    width:42px;
    height:42px;
    border-radius:50%;
    object-fit:cover;
    margin-right:8px;
    border:2px solid #eef2ff;
    background:#f3f3f3;
}

.row-icon.teal {
    background:#eaf9fb;
    color:#178ba1;
}

.service-pill,
.status-pill {
    display:inline-flex;
    align-items:center;
    min-height:24px;
    border-radius:999px;
    padding:0 10px;
    font-size:12px;
    font-weight:650;
}

.service-pill {
    background:#f6f6f6;
    color:#333;
}

.status-pill.success { background:#e7f6ec; color:#1f7a42; }
.status-pill.danger { background:#fdecec; color:#b42318; }
.status-pill.secondary { background:#f1f3f5; color:#475467; }
.status-pill.warning { background:#fff3cd; color:#8a6100; }

.filter-card {
    display:flex;
    align-items:flex-end;
    gap:14px;
    padding:18px;
    margin-bottom:22px;
}

.filter-card label {
    display:block;
    font-weight:650;
    margin-bottom:6px;
}

.filter-card input,
.filter-card select,
.admin-search input {
    height:42px;
    min-width:240px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 12px;
}

.filter-card button {
    height:42px;
    border:1px solid #ddd;
    border-radius:6px;
    background:#fff;
    padding:0 16px;
}

.schedule-control-grid {
    display:grid;
    grid-template-columns:320px 1fr;
    gap:16px;
    margin-bottom:18px;
}

.schedule-control-card {
    margin:0;
}

.date-filter-form label,
.schedule-block-form label {
    display:block;
    font-weight:650;
    margin-bottom:6px;
}

.date-filter-row {
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
}

.date-filter-row input,
.date-filter-row button {
    height:42px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 12px;
}

.date-filter-row button {
    background:#fff;
    font-weight:650;
}

.schedule-block-form {
    display:grid;
    grid-template-columns:repeat(3, minmax(140px, 1fr)) auto minmax(160px, 1fr) auto;
    gap:12px;
    align-items:end;
}

.schedule-block-form input,
.schedule-block-form select {
    width:100%;
    height:42px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 12px;
}

.schedule-block-form .is-disabled {
    opacity:.48;
}

.schedule-block-form .check-inline {
    height:42px;
    margin:0;
}

.schedule-block-form button {
    height:42px;
    border:0;
    border-radius:6px;
    background:#111;
    color:#fff;
    padding:0 16px;
    font-weight:650;
    white-space:nowrap;
}

.schedule-block-strip {
    display:flex;
    align-items:center;
    gap:12px;
    min-height:52px;
    padding:12px 14px;
    border:1px solid #f0d1d1;
    border-radius:8px;
    background:#fffafa;
    margin-bottom:22px;
}

.schedule-block-strip-title {
    display:inline-flex;
    align-items:center;
    gap:8px;
    flex:0 0 auto;
    font-weight:650;
    color:#b42318;
}

.schedule-block-chips {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.schedule-block-chip {
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:36px;
    padding:0 4px 0 10px;
    border:1px solid #f0b8b8;
    border-radius:999px;
    background:#fff;
    color:#7a1f1f;
    font-size:13px;
}

.schedule-block-chip strong,
.schedule-block-chip em {
    color:#b42318;
}

.schedule-block-chip em {
    font-style:normal;
}

.schedule-block-chip button {
    width:28px;
    height:28px;
    border:0;
    border-radius:50%;
    background:#c91832;
    color:#fff;
}

.schedule-block-empty {
    color:#667085;
    font-size:14px;
}

.calendar-head h2 {
    margin:0;
    font-size:18px;
}

.date-switcher {
    display:grid;
    grid-template-columns:72px 180px 72px;
    border:1px solid #ccc;
    border-radius:6px;
    overflow:hidden;
}

.date-switcher a {
    min-height:44px;
    display:grid;
    place-items:center;
    color:#111;
    text-decoration:none;
    border-right:1px solid #ddd;
}

.date-switcher a:last-child {
    border-right:0;
}

.date-switcher .today {
    background:#111;
    color:#fff;
    font-weight:650;
}

.schedule-wrap {
    overflow:auto;
    border:1px solid #e6e6e6;
    border-radius:8px;
    background:#fff;
}

.schedule-table {
    width:100%;
    min-width:920px;
    border-collapse:collapse;
    table-layout:fixed;
}

.schedule-table th,
.schedule-table td {
    border:1px solid #e9e9e9;
    vertical-align:top;
}

.schedule-table th {
    height:42px;
    background:var(--staff-color, #111);
    color:#fff;
    font-weight:650;
}

.schedule-table th:first-child {
    width:92px;
    background:#fafafa;
    color:#111;
}

.time-cell {
    text-align:center;
    font-weight:650;
    color:#333;
    background:#fafafa;
    padding-top:18px;
}

.appointment-block {
    display:block;
    min-height:92px;
    margin:6px;
    padding:9px;
    border-radius:4px;
    background:var(--staff-color, #111);
    color:#fff;
    text-decoration:none;
}

.appointment-block strong,
.appointment-block span,
.appointment-block small {
    display:block;
}

.appointment-block span,
.appointment-block small {
    opacity:.9;
    font-size:12px;
}

.appointment-block em {
    display:inline-flex;
    margin-top:6px;
    padding:2px 7px;
    border-radius:999px;
    background:#26a6c9;
    font-style:normal;
    font-size:11px;
}

.schedule-block {
    display:block;
    min-height:92px;
    margin:6px;
    padding:9px;
    border-radius:4px;
    background:#d92d20;
    color:#fff;
}

.schedule-block strong,
.schedule-block small {
    display:block;
}

.schedule-block small {
    opacity:.9;
    margin-top:4px;
    font-size:12px;
}

.empty-slot,
.empty-slot-actions {
    min-height:92px;
    margin:6px;
    border-radius:4px;
    color:#b0b0b0;
    text-decoration:none;
    display:grid;
    place-items:center;
    font-size:24px;
}

.empty-slot-actions {
    grid-template-columns:1fr 1fr;
    gap:6px;
}

.empty-slot-actions form {
    width:100%;
    height:100%;
}

.empty-slot-add,
.empty-slot-lock {
    width:100%;
    height:100%;
    min-height:80px;
    border:1px dashed #d7d7d7;
    border-radius:4px;
    background:#fff;
    color:#9a9a9a;
    display:grid;
    place-items:center;
    text-decoration:none;
    transition:border-color .18s, color .18s, background .18s;
}

.empty-slot-lock {
    cursor:pointer;
}

.empty-slot-add:hover {
    border-color:#111;
    color:#111;
    background:#fafafa;
}

.empty-slot-lock:hover {
    border-color:#c91832;
    color:#c91832;
    background:#fff5f5;
}

.list-table td:first-child {
    display:flex;
    align-items:center;
}

.icon-actions {
    display:flex;
    gap:6px;
}

.icon-actions a,
.icon-actions button {
    width:42px;
    height:42px;
    border:0;
    border-radius:6px;
    display:grid;
    place-items:center;
    background:#111;
    color:#fff;
    text-decoration:none;
}

.icon-actions .edit { background:#f2b705; color:#111; }
.icon-actions .delete { background:#c91832; color:#fff; }

.customer-actions {
    display:flex;
    align-items:center;
    gap:8px;
}

.block-phone-form {
    display:grid;
    grid-template-columns:66px 86px minmax(130px, 1fr) 42px;
    gap:6px;
    align-items:center;
    min-width:350px;
}

.block-phone-form input,
.block-phone-form select {
    height:38px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 8px;
    font-size:13px;
}

.mini-action {
    width:42px;
    height:42px;
    border:0;
    border-radius:6px;
    display:grid;
    place-items:center;
    color:#fff;
    text-decoration:none;
}

.mini-action.dark { background:#111; }
.mini-action.green { background:#159447; }
.mini-action.red { background:#c91832; }

.toggle-dot {
    width:34px;
    height:18px;
    border-radius:999px;
    background:#0d6efd;
    display:inline-block;
    position:relative;
}

.toggle-dot::after {
    content:"";
    width:14px;
    height:14px;
    border-radius:50%;
    background:#fff;
    position:absolute;
    right:2px;
    top:2px;
}

.admin-search {
    margin-bottom:14px;
}

.admin-search input {
    width:100%;
}

.settings-title {
    font-size:18px;
    margin:0 0 18px;
}

.settings-form {
    display:grid;
    grid-template-columns:repeat(2, minmax(220px, 1fr));
    gap:16px;
    align-items:end;
}

.settings-form label {
    display:block;
    font-weight:650;
    margin-bottom:6px;
}

.settings-form .check-inline {
    grid-column:1 / -1;
    margin-bottom:0;
}

.settings-form input,
.settings-form select,
.settings-form textarea {
    width:100%;
    border:1px solid #ddd;
    border-radius:6px;
    padding:10px 12px;
}

.settings-form input,
.settings-form select {
    height:42px;
    padding-top:0;
    padding-bottom:0;
}

.settings-form textarea {
    min-height:260px;
    resize:vertical;
    line-height:1.55;
}

.legal-form,
.legal-form > div {
    grid-column:1 / -1;
}

.legal-tabs {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:18px;
}

.legal-tabs a {
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 14px;
    border:1px solid #ddd;
    border-radius:8px;
    color:#222;
    text-decoration:none;
    font-weight:700;
    background:#fff;
}

.legal-tabs a.active {
    background:#111;
    color:#fff;
    border-color:#111;
}

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

.public-page {
    width:min(920px, calc(100vw - 32px));
    margin:42px auto;
}

.public-page-card {
    border:1px solid #e5ded2;
    border-radius:8px;
    background:#fff;
    padding:28px;
    box-shadow:0 12px 32px rgba(0,0,0,.08);
}

.public-page-card h1 {
    margin:0 0 18px;
    font-size:32px;
}

.public-page-content {
    color:#2f2f2f;
    line-height:1.75;
}

.site-legal-footer {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:14px;
    padding:24px 16px 32px;
    color:#777;
    font-size:14px;
}

.site-legal-footer a {
    color:#555;
    text-decoration:none;
}

.site-legal-footer a:hover {
    color:#111;
    text-decoration:underline;
}

.booking-legal-links {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:10px 14px;
    margin-top:18px;
    padding-top:16px;
    border-top:1px solid rgba(0,0,0,.08);
    font-size:13px;
}

.booking-legal-links a {
    color:#5d5348;
    text-decoration:none;
    font-weight:650;
}

.booking-legal-links a:hover {
    color:#111;
    text-decoration:underline;
}

.personnel-form {
    display:grid;
    grid-template-columns:repeat(5, minmax(120px, 1fr)) auto auto;
    gap:12px;
    align-items:end;
}

.personnel-form label,
.personnel-table label {
    font-weight:650;
    font-size:13px;
    color:#333;
}

.personnel-form input,
.personnel-table input {
    width:100%;
    height:40px;
    border:1px solid #ddd;
    border-radius:6px;
    padding:0 10px;
}

.personnel-table .small-input {
    width:76px;
}

.stacked-inputs {
    display:grid;
    gap:6px;
    min-width:220px;
}

.stacked-inputs input + input {
    color:#667085;
}

.check-inline {
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
}

.check-inline input {
    width:16px;
    height:16px;
}

.inline-filter {
    box-shadow:none;
}

.empty-row {
    text-align:center;
    color:#667085;
    padding:28px !important;
}

@media (max-width: 992px) {
    .admin-nav {
        padding-left:10px;
        padding-right:10px;
    }

    .admin-nav-item,
    .admin-account button {
        min-width:72px;
        font-size:12px;
    }

    .admin-page {
        padding:24px 12px 44px;
    }

    .admin-toolbar,
    .admin-card-head,
    .calendar-head,
    .filter-card {
        align-items:stretch;
        flex-direction:column;
    }

    .schedule-control-grid,
    .schedule-block-form {
        grid-template-columns:1fr;
    }

    .schedule-block-form button {
        width:100%;
    }

    .schedule-block-strip {
        align-items:stretch;
        flex-direction:column;
    }

    .schedule-block-chip {
        width:100%;
        justify-content:space-between;
        border-radius:6px;
        padding:6px 6px 6px 10px;
    }

    .metric-grid,
    .admin-grid {
        grid-template-columns:1fr;
    }

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

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

    .toolbar-actions {
        flex-direction:column;
        border-radius:0;
        gap:8px;
    }

    .dark-action,
    .green-action,
    .cyan-action,
    .outline-action {
        justify-content:center;
        border-radius:6px;
    }

    .date-switcher {
        grid-template-columns:1fr 2fr 1fr;
    }

    .customer-actions,
    .block-phone-form {
        align-items:stretch;
        grid-template-columns:1fr;
        min-width:0;
        width:100%;
    }

    .mini-action {
        width:100%;
    }
}
