/* ==========================================================================
   Bruma · panel de la estilista y login
   ========================================================================== */

/* ---------- Login ---------- */
.login-body { overflow: hidden; }
.login {
    min-height: 100vh;
    min-height: 100dvh;
    display: grid;
    grid-template-columns: 1.08fr .92fr;
}
.login-visual { position: relative; overflow: hidden; background: var(--forest-deep); }
.login-visual img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(.55) brightness(.72);
}
.login-visual__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(24, 34, 27, .35), rgba(24, 34, 27, .78));
}
.login-visual__content {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 42px 46px;
    color: var(--paper);
}
.login-visual blockquote {
    font-family: var(--serif);
    font-size: clamp(34px, 3.6vw, 54px);
    line-height: 1.02;
    letter-spacing: -.02em;
    font-style: italic;
    max-width: 480px;
}
.login-visual__caption {
    font-size: 9px;
    letter-spacing: .17em;
    text-transform: uppercase;
    color: rgba(246, 242, 236, .55);
}
.login-panel {
    display: grid;
    place-items: center;
    padding: 40px;
    background: var(--paper);
    overflow-y: auto;
}
.login-box { width: min(380px, 100%); }
.login-box__mobile-brand { display: none; margin-bottom: 28px; }
.login-box .eyebrow { margin-bottom: 14px; }
.login-box h1 {
    font-family: var(--serif);
    font-weight: 400;
    font-size: clamp(42px, 4.2vw, 58px);
    line-height: .94;
    letter-spacing: -.03em;
}
.login-box h1 em { color: var(--forest); }
.login-lead { margin: 16px 0 26px; font-size: 12px; line-height: 1.65; color: var(--muted); }
.login-form { display: flex; flex-direction: column; gap: 14px; }
.login-form .btn { margin-top: 6px; }
.login-error {
    margin-bottom: 16px;
    padding: 10px 13px;
    border: 1px solid #e1bdb1;
    border-radius: 9px;
    background: var(--danger-bg);
    color: #7f4134;
    font-size: 11px;
    line-height: 1.5;
}
.login-demo {
    margin-top: 24px;
    border-top: 1px solid var(--line);
    padding-top: 14px;
    font-size: 10.5px;
    color: var(--muted);
}
.login-demo summary { cursor: pointer; font-size: 10px; letter-spacing: .03em; color: var(--muted); }
.login-demo summary:hover { color: var(--ink); }
.login-demo p { margin-top: 8px; line-height: 1.7; }
.login-demo strong { color: var(--ink-2); font-weight: 600; min-width: 48px; display: inline-block; }
.login-back {
    display: inline-block;
    margin-top: 26px;
    font-size: 10.5px;
    color: var(--muted);
    border-bottom: 1px solid transparent;
}
.login-back:hover { color: var(--ink); border-color: var(--line-strong); }

/* ---------- Estructura del panel ---------- */
.admin-body {
    overflow: hidden;
    background: #fbf8f3;
}
.admin-app { height: 100vh; height: 100dvh; display: flex; flex-direction: column; }

.topbar {
    flex: 0 0 64px;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 22px;
    padding: 0 20px;
    background: rgba(246, 242, 236, .92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--line);
    z-index: 30;
}
.topbar__brand { display: flex; align-items: center; gap: 12px; min-width: 0; }
.topbar__tag {
    padding-left: 12px;
    border-left: 1px solid var(--line-strong);
    font-size: 8.5px;
    font-weight: 600;
    letter-spacing: .17em;
    text-transform: uppercase;
    color: var(--muted-2);
}
.topbar__nav { display: flex; align-items: center; justify-content: center; gap: 20px; min-width: 0; }
.nav-cluster { display: flex; align-items: center; gap: 3px; }
.nav-cluster .icon-btn { width: 30px; height: 30px; font-size: 17px; color: var(--muted); }
.nav-cluster .btn { height: 30px; padding: 0 12px; font-size: 10px; }
.topbar__title { display: flex; align-items: baseline; gap: 9px; min-width: 0; }
.topbar__title h1 {
    font-family: var(--serif);
    font-weight: 400;
    font-size: 27px;
    line-height: 1;
    letter-spacing: -.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.topbar__title span { font-size: 10px; color: var(--muted-2); letter-spacing: .05em; }
.topbar__actions { display: flex; align-items: center; gap: 8px; justify-self: end; }
.topbar__actions .btn { height: 34px; }
.notif-btn { position: relative; width: 36px; height: 36px; border: 1px solid transparent; }
.notif-btn:hover { background: rgba(29, 27, 24, .05); }
.notif-btn__count {
    position: absolute;
    top: -1px;
    right: -2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: var(--clay);
    color: #fff;
    font-size: 8px;
    font-weight: 600;
    line-height: 1;
}
.notif-btn__count[data-zero="true"] { display: none; }
.topbar .avatar { cursor: pointer; }

.admin-mobile-bar { display: none; }
.rail-backdrop { display: none; }

.workspace {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 354px;
    overflow: hidden;
}

/* ---------- Calendario ---------- */
.calendar-pane {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 0;
    padding: 0 0 0 20px;
}
.cal-toolbar {
    flex: 0 0 54px;
    display: flex;
    align-items: center;
    gap: 18px;
    padding-right: 20px;
}
.segmented {
    display: flex;
    align-items: center;
    gap: 2px;
    padding: 3px;
    background: var(--paper-2);
    border-radius: 9px;
}
.segmented button {
    height: 27px;
    padding: 0 12px;
    border: 0;
    border-radius: 6px;
    background: transparent;
    color: var(--muted);
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .02em;
    transition: background .2s, color .2s, box-shadow .2s;
}
.segmented button:hover { color: var(--ink); }
.segmented button.is-active {
    background: var(--white);
    color: var(--ink);
    box-shadow: 0 1px 3px rgba(45, 38, 27, .12);
}
.cal-legend { display: flex; align-items: center; gap: 14px; font-size: 9px; color: var(--muted); }
.cal-legend span { display: flex; align-items: center; gap: 5px; }
.cal-stats { margin-left: auto; font-size: 9.5px; color: var(--muted); letter-spacing: .01em; }
.cal-stats strong { color: var(--ink-2); font-weight: 600; }
.cal-stats .sep { margin: 0 6px; color: var(--line-strong); }

.calendar {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    margin-right: 20px;
    background: var(--white);
    border: 1px solid var(--line);
    border-bottom: 0;
    border-radius: 14px 14px 0 0;
    overflow: hidden;
}
.cal-head {
    flex: 0 0 62px;
    display: grid;
    grid-template-columns: 66px minmax(0, 1fr);
    border-bottom: 1px solid var(--line);
    background: var(--white);
    z-index: 2;
}
.cal-gutter {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-bottom: 9px;
    border-right: 1px solid transparent;
}
.cal-gutter span {
    font-size: 7.5px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--muted-2);
}
.cal-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-day {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 1px;
    padding: 8px 4px 7px;
    border: 0;
    border-left: 1px solid #f0ebe3;
    background: transparent;
    min-width: 0;
    width: 100%;
    font: inherit;
    color: inherit;
    cursor: pointer;
    transition: background .15s;
}
.cal-day:hover { background: #fbf7f0; }
.cal-day.is-today:hover { background: #f8f4ec; }
.cal-day:first-child { border-left: 0; }
.cal-day__weekday {
    font-size: 8px;
    font-weight: 500;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted-2);
}
.cal-day__num {
    width: 27px;
    height: 27px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-size: 15px;
    font-weight: 500;
    color: var(--ink-2);
    line-height: 1;
}
.cal-day.is-today .cal-day__weekday { color: var(--forest); }
.cal-day.is-today .cal-day__num { background: var(--forest); color: var(--paper); }
.cal-day.is-closed .cal-day__num { color: var(--muted-2); }
.cal-day.is-today.is-closed .cal-day__num { background: transparent; color: var(--muted); }
.cal-day__closed {
    font-size: 6.5px;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--muted-2);
}

.cal-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
    scrollbar-color: #d7cec0 transparent;
}
.cal-scroll::-webkit-scrollbar { width: 8px; }
.cal-scroll::-webkit-scrollbar-thumb { background: #d7cec0; border-radius: 99px; border: 2px solid var(--white); }
.cal-body { display: grid; grid-template-columns: 66px minmax(0, 1fr); }
.cal-times { position: relative; border-right: 1px solid transparent; }
.cal-time:first-child { transform: translateY(0); }
.cal-time {
    position: absolute;
    right: 9px;
    transform: translateY(-50%);
    font-size: 8px;
    letter-spacing: .04em;
    color: var(--muted-2);
    white-space: nowrap;
}
.cal-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); position: relative; }
.day-col {
    position: relative;
    border-left: 1px solid #f0ebe3;
    background-image: repeating-linear-gradient(
        to bottom,
        transparent 0,
        transparent 35px,
        #f7f2ea 35px,
        #f7f2ea 36px,
        transparent 36px,
        transparent 71px,
        #ece5da 71px,
        #ece5da 72px
    );
    background-position: 0 0;
    cursor: crosshair;
    min-width: 0;
}
.day-col:first-child { border-left: 0; }
.day-col.is-today { background-color: #fdfbf6; }
.day-col.is-closed {
    background-color: #faf7f1;
    background-image: repeating-linear-gradient(
        135deg,
        rgba(201, 191, 174, .08) 0,
        rgba(201, 191, 174, .08) 1px,
        transparent 1px,
        transparent 8px
    );
}
.day-col.is-weekend { background-color: #fdfbf7; }
.day-col__closed-label {
    position: absolute;
    top: 22px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 7px;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--muted-2);
    padding: 3px 7px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: rgba(255, 253, 249, .8);
    white-space: nowrap;
    pointer-events: none;
}
.day-col.is-window .day-col__win {
    position: absolute;
    inset: 0;
    background: rgba(169, 184, 166, .07);
    pointer-events: none;
    border-radius: 0;
}
.now-line {
    position: absolute;
    left: 0;
    right: 0;
    height: 1.5px;
    background: var(--clay);
    z-index: 5;
    pointer-events: none;
}
.now-line::before {
    content: '';
    position: absolute;
    left: -3px;
    top: -3px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--clay);
}

/* Eventos */
.ev {
    position: absolute;
    z-index: 2;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 4px 6px 3px;
    border-radius: 7px;
    border: 1px solid transparent;
    overflow: hidden;
    font-size: 9px;
    line-height: 1.25;
    text-align: left;
    cursor: pointer;
    transition: box-shadow .15s, transform .15s;
}
.ev:hover { z-index: 20; box-shadow: 0 6px 16px -6px rgba(45, 38, 27, .35); transform: translateY(-1px); }
.ev__time { font-size: 7.5px; font-weight: 600; letter-spacing: .05em; opacity: .7; }
.ev__name {
    font-size: 9.5px;
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: -.005em;
}
.ev__service {
    font-size: 7.5px;
    opacity: .72;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.ev--short .ev__service { display: none; }
.ev--short .ev__time { display: inline; }
.ev--tiny { padding: 2px 5px; justify-content: center; }
.ev--tiny .ev__time { display: none; }
.ev--tiny .ev__name { font-size: 8.5px; }

.ev--confirmed {
    background: #e4ece4;
    border-color: #bccdbf;
    border-left: 3px solid #4f6c57;
    color: #2c4233;
}
.ev--pending {
    background: #fdf3e2;
    border: 1px dashed #d1a160;
    border-left: 3px solid #c08a43;
    color: #74501c;
}
.ev--reschedule {
    background: #e9eff8;
    border-color: #bac8df;
    border-left: 3px solid #647d9f;
    color: #344a63;
}
.ev--cancel {
    background: #f8e9e2;
    border-color: #dfb6a4;
    border-left: 3px solid #b56d4f;
    color: #7e4332;
}
.ev--completed {
    background: #f1eee7;
    border-color: #dbd3c5;
    border-left: 3px solid #a9a091;
    color: #6f685b;
    opacity: .78;
}
.ev--ghost {
    background: rgba(255, 253, 249, .55);
    border: 1.5px dashed #8ea3bd;
    color: #465d78;
    border-left: 1.5px dashed #8ea3bd;
}
.ev__ghost-label {
    font-size: 6.5px;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #647d9f;
}
.ev--ghost .ev__name { font-size: 9px; }

.cal-hint {
    flex: 0 0 auto;
    padding: 7px 20px 8px;
    font-size: 8.5px;
    color: var(--muted-2);
    display: flex;
    align-items: center;
    gap: 5px;
}
.cal-hint span { font-size: 11px; color: var(--muted); }

/* ---------- Panel lateral ---------- */
.rail {
    display: flex;
    flex-direction: column;
    background: #fbf8f3;
    border-left: 1px solid var(--line);
    overflow-y: auto;
    min-height: 0;
    scrollbar-width: thin;
    scrollbar-color: #d7cec0 transparent;
}
.rail::-webkit-scrollbar { width: 7px; }
.rail::-webkit-scrollbar-thumb { background: #d7cec0; border-radius: 99px; border: 2px solid #fbf8f3; }
.rail-profile {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 16px 18px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}
.rail-profile__info { display: flex; flex-direction: column; min-width: 0; gap: 1px; }
.rail-profile__info strong { font-size: 12px; font-weight: 600; line-height: 1.3; }
.rail-profile__info span { font-size: 9px; color: var(--muted-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rail-profile .icon-btn { display: none; margin-left: auto; }

.rail-section { padding: 16px 18px 14px; border-bottom: 1px solid var(--line); }
.rail-section--today { padding-bottom: 16px; }
.rail-section__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 10px;
}
.rail-section__head h2 {
    font-size: 8.5px;
    font-weight: 600;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--muted);
}
.rail-muted { font-size: 8.5px; color: var(--muted-2); }
.rail-section .count { background: var(--paper-3); }

.req {
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 11px;
    padding: 11px 12px;
    margin-bottom: 7px;
    cursor: pointer;
    transition: border-color .2s, box-shadow .2s;
}
.req:hover { border-color: var(--line-strong); box-shadow: 0 4px 14px -8px rgba(45, 38, 27, .25); }
.req:last-child { margin-bottom: 0; }
.req__top { display: flex; align-items: center; justify-content: space-between; gap: 6px; margin-bottom: 5px; }
.req__top .status-pill { padding: 3px 7px; font-size: 7px; letter-spacing: .08em; }
.req__top .status-pill i { width: 4px; height: 4px; }
.req__when { font-size: 8.5px; color: var(--muted); white-space: nowrap; }
.req h3 { font-size: 11.5px; font-weight: 600; line-height: 1.3; }
.req__meta { font-size: 9px; color: var(--muted); line-height: 1.4; }
.req__change {
    margin-top: 5px;
    padding-top: 5px;
    border-top: 1px dashed var(--line);
    font-size: 8.5px;
    color: var(--blue);
    line-height: 1.4;
}
.req__change strong { font-weight: 600; }
.req__actions { display: flex; gap: 5px; margin-top: 8px; }
.req-btn {
    height: 26px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: 6px;
    background: transparent;
    font-size: 8.5px;
    font-weight: 500;
    color: var(--ink-2);
    transition: border-color .2s, background .2s, color .2s;
}
.req-btn:hover { border-color: var(--ink); }
.req-btn--primary { background: var(--forest); border-color: var(--forest); color: var(--paper); }
.req-btn--primary:hover { background: var(--forest-deep); border-color: var(--forest-deep); }
.req-btn--danger { color: var(--danger); border-color: #dcc0b8; }
.req-btn--danger:hover { background: var(--danger-bg); border-color: var(--danger); }

.rail-empty {
    padding: 18px 14px;
    border: 1px dashed var(--line);
    border-radius: 10px;
    text-align: center;
    font-size: 9px;
    line-height: 1.55;
    color: var(--muted-2);
}
.rail-empty strong { display: block; color: var(--muted); font-size: 9.5px; font-weight: 500; margin-bottom: 2px; }

.today-item {
    width: 100%;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 8px;
    align-items: center;
    gap: 9px;
    padding: 7px 0;
    border: 0;
    border-top: 1px solid var(--line);
    background: transparent;
    text-align: left;
}
.today-item:first-child { border-top: 0; }
.today-item:hover .today-item__body strong { color: var(--forest); }
.today-item__time { font-size: 8.5px; color: var(--muted); letter-spacing: .03em; }
.today-item__body { display: flex; flex-direction: column; gap: 0; min-width: 0; }
.today-item__body strong { font-size: 10.5px; font-weight: 500; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.today-item__body small { font-size: 8px; color: var(--muted-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.today-item__dot { width: 6px; height: 6px; border-radius: 50%; background: var(--line-strong); }
.today-item__dot--confirmed { background: #5f8068; }
.today-item__dot--pending { background: #c08a43; }
.today-item__dot--completed { background: #a9a091; }
.today-item__dot--reschedule { background: #647d9f; }
.today-item__dot--cancel { background: #b56d4f; }
.today-item.is-past { opacity: .55; }

.rail-foot {
    margin-top: auto;
    padding: 12px 18px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.rail-foot form { margin: 0; }
.rail-foot__btn {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 7px;
    padding: 7px 0;
    border: 0;
    background: transparent;
    font-size: 9.5px;
    color: var(--muted);
    text-align: left;
}
.rail-foot__btn:hover { color: var(--ink); }
.rail-foot__btn svg { width: 14px; height: 14px; }
.rail-foot__btn .count { margin-left: auto; }

/* ---------- Modales del panel ---------- */
.modal {
    width: min(520px, calc(100vw - 32px));
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
}
.modal--form { width: min(590px, calc(100vw - 32px)); }
.modal--sm { width: min(450px, calc(100vw - 32px)); }
.modal__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px 14px;
}
.modal__head .eyebrow { margin-bottom: 6px; }
.modal__head h2 {
    font-family: var(--serif);
    font-weight: 400;
    font-size: 28px;
    line-height: 1.02;
    letter-spacing: -.02em;
}
.modal__body { padding: 0 22px 20px; }
.modal__lead { font-size: 10.5px; line-height: 1.6; color: var(--muted); margin-bottom: 14px; }
.modal__foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 7px;
    padding: 13px 22px;
    border-top: 1px solid var(--line);
    background: #fdfbf7;
}
.modal__hint { margin-right: auto; font-size: 8.5px; color: var(--muted-2); }
.modal__hint strong { color: var(--ink-2); font-weight: 600; }
.modal .form-grid { gap: 12px; }
.modal .field { gap: 5px; }
.modal .field > span { font-size: 8.5px; }
.modal .field input,
.modal .field select,
.modal .field textarea { min-height: 40px; padding: 8px 11px; font-size: 11.5px; }
.modal .field textarea { min-height: 66px; }
.modal .form-error { margin-top: 8px; font-size: 10px; }
.modal__body .btn--block { height: 42px; }

/* Detalle de una hora */
.detail-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 18px 22px 0;
}
.detail-head__meta { display: flex; align-items: center; gap: 8px; }
.detail-code {
    font-size: 8px;
    letter-spacing: .08em;
    color: var(--muted);
    padding: 3px 7px;
    border: 1px solid var(--line);
    border-radius: 4px;
}
.detail-client {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 14px 22px 14px;
}
.detail-client h2 {
    font-family: var(--serif);
    font-weight: 400;
    font-size: 29px;
    line-height: 1;
    letter-spacing: -.02em;
}
.detail-client p { font-size: 9px; color: var(--muted); margin-top: 3px; }
.detail-client p a { border-bottom: 1px solid var(--line); }
.detail-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 11px 16px;
    margin: 0 22px 14px;
    padding: 13px 15px;
    background: #faf7f1;
    border: 1px solid var(--line);
    border-radius: 10px;
}
.detail-row { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.detail-row span {
    font-size: 7.5px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--muted-2);
}
.detail-row strong { font-size: 10.5px; font-weight: 500; color: var(--ink-2); line-height: 1.35; }
.detail-row strong.big { font-family: var(--serif); font-size: 18px; font-weight: 400; line-height: 1.1; }
.detail-block {
    margin: 0 22px 12px;
    padding: 11px 13px;
    border: 1px solid var(--line);
    border-radius: 9px;
}
.detail-block > span {
    display: block;
    font-size: 7.5px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: var(--muted-2);
    margin-bottom: 3px;
}
.detail-block p { font-size: 10px; line-height: 1.55; color: var(--ink-2); }
.detail-block--request {
    background: #eef2f8;
    border-color: #c8d4e4;
}
.detail-block--request .detail-change {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 4px;
}
.detail-block--request .detail-change div { display: flex; flex-direction: column; gap: 1px; }
.detail-block--request .detail-change span { font-size: 8px; color: #6f8299; }
.detail-block--request .detail-change strong { font-size: 11px; color: #344a63; font-weight: 600; }
.detail-block--request .detail-change i { font-style: normal; color: #7b90a8; font-size: 12px; }
.detail-block--request p { color: #5f7590; margin-top: 5px; font-size: 9px; }
.detail-block--cancel { background: #fbeee8; border-color: #e3c4b8; }
.detail-links {
    display: flex;
    gap: 13px;
    flex-wrap: wrap;
    margin: 0 22px 14px;
    font-size: 9px;
    color: var(--muted);
}
.detail-links a,
.detail-links button {
    border: 0;
    background: none;
    padding: 0 0 1px;
    font-size: 9px;
    color: var(--muted);
    border-bottom: 1px solid var(--line-strong);
}
.detail-links a:hover,
.detail-links button:hover { color: var(--ink); }
.detail-actions {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
    padding: 12px 22px;
    border-top: 1px solid var(--line);
    background: #fdfbf7;
}
.detail-actions .btn { height: 31px; padding: 0 12px; font-size: 9.5px; }
.detail-actions .spacer { flex: 1; }

/* Avisos */
.notif-list { display: flex; flex-direction: column; gap: 8px; max-height: 380px; overflow-y: auto; }
.notif-card {
    padding: 11px 12px;
    border: 1px solid var(--line);
    border-radius: 9px;
    background: #fdfbf7;
}
.notif-card__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.notif-card__top strong { font-size: 10px; font-weight: 600; }
.notif-card__top span { font-size: 8px; color: var(--muted-2); }
.notif-card p {
    font-size: 9.5px;
    line-height: 1.5;
    color: var(--muted);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.notif-card__actions { display: flex; gap: 6px; margin-top: 7px; }
.notif-card__actions .btn { height: 27px; padding: 0 10px; font-size: 8.5px; }
.notif-empty { padding: 26px; text-align: center; font-size: 10px; color: var(--muted-2); }

/* Confirmación */
.modal--confirm .confirm-body { padding: 24px 24px 6px; }
.modal--confirm .confirm-body h2 {
    font-family: var(--serif);
    font-weight: 400;
    font-size: 30px;
    line-height: 1.05;
    letter-spacing: -.02em;
    margin: 8px 0 10px;
}
.modal--confirm .confirm-body p { font-size: 11px; line-height: 1.6; color: var(--muted); }
.modal--confirm .modal__foot { justify-content: flex-end; }

/* Estados vacíos */
.empty-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    padding: 22px 12px;
    border: 1px dashed var(--line);
    border-radius: 10px;
    text-align: center;
    font-size: 9px;
    color: var(--muted-2);
}

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
    .workspace { grid-template-columns: minmax(0, 1fr) 318px; }
    .cal-legend { display: none; }
    .topbar__site { display: none; }
}

@media (max-width: 1020px) {
    .workspace { grid-template-columns: minmax(0, 1fr) 292px; }
    .cal-stats { font-size: 8.5px; }
    .topbar { gap: 12px; }
    .topbar__title h1 { font-size: 23px; }
}

@media (max-width: 900px) {
    .admin-body { overflow: auto; }
    .admin-app { height: auto; min-height: 100dvh; }
    .topbar {
        position: sticky;
        top: 0;
        flex: 0 0 56px;
        height: 56px;
        padding: 0 14px;
        gap: 8px;
    }
    .topbar__tag { display: none; }
    .topbar__nav { justify-content: flex-end; gap: 8px; }
    .topbar__title h1 { font-size: 19px; }
    .topbar__title span { display: none; }
    .topbar__actions { gap: 4px; }
    .topbar__actions .avatar { display: none; }
    .topbar__actions .btn--primary { height: 32px; padding: 0 12px; font-size: 10px; }
    .topbar__actions .btn--primary span { display: none; }
    .notif-btn { width: 32px; height: 32px; }
    .admin-mobile-bar {
        position: sticky;
        top: 56px;
        z-index: 25;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        height: 48px;
        padding: 0 14px;
        background: rgba(246, 242, 236, .94);
        backdrop-filter: blur(12px);
        border-bottom: 1px solid var(--line);
    }
    .admin-mobile-bar .segmented { background: var(--paper-2); }
    .admin-mobile-bar .btn { height: 30px; padding: 0 11px; font-size: 9.5px; }
    .workspace {
        display: block;
        height: auto;
        overflow: visible;
    }
    .calendar-pane {
        height: calc(100dvh - 104px);
        padding: 0 12px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
    }
    .calendar { min-width: 680px; }
    .calendar.calendar--day { min-width: 0; }
    .cal-toolbar { display: none; }
    .calendar { margin-right: 0; border-radius: 12px 12px 0 0; }
    .cal-head { grid-template-columns: 52px minmax(0, 1fr); }
    .cal-gutter { padding-bottom: 7px; }
    .cal-gutter span { font-size: 6.5px; }
    .cal-body { grid-template-columns: 52px minmax(0, 1fr); }
    .cal-head { overflow: visible; }
    .cal-scroll { overflow-x: hidden; }
    .cal-body { min-width: 0; }
    .cal-time { right: 6px; font-size: 7px; }
    .cal-hint { font-size: 7.5px; padding-bottom: 10px; }
    .cal-day__num { width: 24px; height: 24px; font-size: 14px; }

    .rail {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        width: min(370px, 92vw);
        z-index: 210;
        transform: translateX(102%);
        transition: transform .3s cubic-bezier(.2, .7, .3, 1);
        box-shadow: -20px 0 50px -20px rgba(30, 26, 20, .4);
    }
    .rail.is-open { transform: none; }
    .rail-profile .icon-btn { display: grid; }
    .rail-backdrop {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 200;
        background: rgba(28, 24, 18, .35);
        opacity: 0;
        pointer-events: none;
        transition: opacity .25s;
    }
    .rail-backdrop.is-open { opacity: 1; pointer-events: auto; }
}

@media (max-width: 640px) {
    .topbar__nav .nav-cluster .btn { display: none; }
    .topbar__title { max-width: 160px; }
    .topbar__title h1 { font-size: 18px; }
    .topbar__actions .btn--primary { padding: 0 10px; font-size: 9.5px; }
    .calendar { min-width: 620px; }
    .calendar.calendar--day { min-width: 0; }
    .modal { width: calc(100vw - 24px); }
    .modal__head { padding: 18px 18px 12px; }
    .modal__body { padding: 0 18px 16px; }
    .modal__foot { padding: 12px 18px; }
    .detail-head, .detail-client { padding-left: 18px; padding-right: 18px; }
    .detail-grid { margin-left: 18px; margin-right: 18px; }
    .detail-block { margin-left: 18px; margin-right: 18px; }
    .detail-links { margin-left: 18px; margin-right: 18px; }
    .detail-actions { padding-left: 18px; padding-right: 18px; }
    .detail-actions .spacer { display: none; }
    .detail-actions .btn { flex: 1 1 45%; }
    .login { grid-template-columns: 1fr; }
    .login-visual { display: none; }
    .login-panel { padding: 28px 22px; min-height: 100dvh; align-items: start; padding-top: 44px; }
    .login-box__mobile-brand { display: inline-flex; }
    .login-box h1 { font-size: 44px; }
}

@media (max-width: 400px) {
    .topbar__nav .nav-cluster .icon-btn { width: 26px; }
    .topbar__title h1 { font-size: 16px; }
    .calendar { min-width: 580px; }
    .calendar.calendar--day { min-width: 0; }
}