/*
|--------------------------------------------------------------------------
| Dental Software UI
|--------------------------------------------------------------------------
|
| Paleta oficial:
| Fondo:       #F1F1F2
| Neutro:      #BCBABE
| Azul suave:  #A1D6E2
| Azul dental: #1995AD
|
| Fuente:
| Space Grotesk Variable instalada localmente mediante Fontsource.
|
*/

/* ================================================================
   VARIABLES
   ================================================================ */

:root {
    --clinic-primary: #4f8df7;
    --clinic-primary-hover: #3979eb;
    --clinic-primary-strong: #2468dc;
    --clinic-primary-soft: #eaf2ff;
    --clinic-primary-softer: #f4f8ff;
    --clinic-background: #f3f7fc;
    --clinic-surface: #ffffff;
    --clinic-surface-muted: #f7faff;
    --clinic-text: #121826;
    --clinic-text-secondary: #667085;
    --clinic-border: #dde7f4;
    --clinic-success: #20ad67;
    --clinic-warning: #f59e0b;
    --clinic-danger: #e5484d;
    --clinic-shadow: 0 12px 35px rgba(47, 91, 150, 0.08);
    --clinic-focus: 0 0 0 3px rgba(79, 141, 247, 0.22);

    --dental-neutral: #BCBABE;
    --dental-soft: #A1D6E2;
    --dental-primary: #1995AD;

    --dental-primary-hover: #167F94;
    --dental-primary-dark: #116A7C;
    --dental-primary-soft: #E9F6F8;
    --dental-primary-softer: #F4FAFB;

    --dental-white: #FFFFFF;
    --dental-ink: #1D3038;
    --dental-text: #30444C;
    --dental-text-soft: #66777E;
    --dental-placeholder: #8C999E;

    --dental-line: #DFE7E9;
    --dental-line-strong: #CBD8DC;
    --dental-danger: #C64A4A;
    --dental-danger-soft: #FFF1F1;
    --dental-success: #24856D;
    --dental-success-soft: #EAF7F3;
    --dental-warning: #A46C18;
    --dental-warning-soft: #FFF7E8;

    --dental-sidebar: 270px;
    --dental-header: 64px;

    --dental-radius-xs: 6px;
    --dental-radius-sm: 8px;
    --dental-radius: 10px;
    --dental-radius-lg: 14px;

    --dental-shadow-xs:
        0 1px 2px rgba(29, 48, 56, 0.035);

    --dental-shadow-sm:
        0 6px 18px rgba(29, 48, 56, 0.055);

    --dental-shadow:
        0 14px 34px rgba(29, 48, 56, 0.075);

    --dental-focus:
        0 0 0 3px rgba(25, 149, 173, 0.16);

    --dental-transition:
        160ms cubic-bezier(0.2, 0, 0, 1);
}
/* ================================================================
   BASE
   ================================================================ */

html,
body,
#app,
#App {
    min-height: 100%;
}

html {
    color-scheme: light;
    background: var(--dental-canvas);
}

body.dental-ui {
    min-width: 320px;
    margin: 0 !important;
    overflow-x: hidden;
    background: var(--dental-canvas) !important;
    color: var(--dental-text) !important;
    font-family:
        "Space Grotesk Variable",
        "Space Grotesk",
        system-ui,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif !important;
    font-optical-sizing: auto;
    font-variation-settings: "wght" 450;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

body.dental-ui *,
body.dental-ui *::before,
body.dental-ui *::after {
    box-sizing: border-box;
    font-family: inherit;
}

body.dental-ui ::selection {
    background: rgba(161, 214, 226, 0.65);
    color: var(--dental-ink);
}

body.dental-ui ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

body.dental-ui ::-webkit-scrollbar-track {
    background: transparent;
}

body.dental-ui ::-webkit-scrollbar-thumb {
    min-height: 48px;
    border: 3px solid transparent;
    border-radius: 999px;
    background: rgba(188, 186, 190, 0.8);
    background-clip: padding-box;
}

body.dental-ui ::-webkit-scrollbar-thumb:hover {
    background: var(--dental-neutral);
    background-clip: padding-box;
}

body.dental-ui h1,
body.dental-ui h2,
body.dental-ui h3,
body.dental-ui h4,
body.dental-ui h5,
body.dental-ui h6,
body.dental-ui p {
    margin-top: 0;
}

body.dental-ui h1,
body.dental-ui h2,
body.dental-ui h3,
body.dental-ui h4,
body.dental-ui strong,
body.dental-ui b {
    color: var(--dental-ink);
}

body.dental-ui a {
    color: var(--dental-primary-dark);
    text-decoration: none;
}

body.dental-ui a:hover {
    color: var(--dental-primary);
}

/* ================================================================
   LUCIDE
   ================================================================ */

body.dental-ui .lucide,
body.dental-ui .lucide-slot,
body.dental-ui [data-lucide] {
    width: 18px;
    height: 18px;
    min-width: 18px;
    flex: 0 0 auto;
    stroke-width: 1.8;
    color: currentColor;
    vertical-align: middle;
    pointer-events: none;
}

body.dental-ui button .lucide,
body.dental-ui a .lucide {
    width: 17px;
    height: 17px;
}

/* ================================================================
   ESTRUCTURA GENERAL
   ================================================================ */

body.dental-ui .clinic-page,
body.dental-ui .content-page,
body.dental-ui .saas-page {
    width: 100% !important;
    min-height: 100vh !important;
    padding:
        calc(var(--dental-header) + 24px)
        28px
        48px
        calc(var(--dental-sidebar) + 28px) !important;
    color: var(--dental-text) !important;
}

body.dental-ui .clinic-page > *,
body.dental-ui .saas-page > *,
body.dental-ui .content-page > .content {
    width: min(100%, 1480px);
    margin-right: auto;
    margin-left: auto;
}

body.dental-ui .content-page .content,
body.dental-ui .content-page .container-fluid,
body.dental-ui .content-page .row,
body.dental-ui .content-page [class*="col-"] {
    max-width: none !important;
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* ================================================================
   HEADER
   ================================================================ */

body.dental-ui .navbar-custom {
    position: fixed !important;
    z-index: 1050 !important;
    top: 0 !important;
    right: 0 !important;
    left: var(--dental-sidebar) !important;
    height: var(--dental-header) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--dental-line) !important;
    border-radius: 0 !important;
    background: rgba(255, 255, 255, 0.96) !important;
    box-shadow: var(--dental-shadow-xs) !important;
    backdrop-filter: blur(14px);
}

body.dental-ui .navbar-custom .brand-link,
body.dental-ui .navbar-custom .icon-btn,
body.dental-ui .navbar-custom .date-display,
body.dental-ui .navbar-custom .user-dropdown,
body.dental-ui .navbar-custom .notif-dropdown {
    border-radius: var(--dental-radius-sm) !important;
}

body.dental-ui .navbar-custom .brand-symbol {
    display: grid !important;
    width: 34px !important;
    height: 34px !important;
    place-items: center !important;
    border: 1px solid rgba(25, 149, 173, 0.2) !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-primary-soft) !important;
    color: var(--dental-primary) !important;
}

body.dental-ui .navbar-custom .business-name {
    color: var(--dental-ink) !important;
    font-size: 14px !important;
    font-weight: 650 !important;
}

body.dental-ui .navbar-custom .icon-btn {
    display: inline-grid !important;
    width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid var(--dental-line) !important;
    background: var(--dental-white) !important;
    color: var(--dental-text-soft) !important;
    box-shadow: none !important;
}

body.dental-ui .navbar-custom .icon-btn:hover {
    border-color: var(--dental-soft) !important;
    background: var(--dental-primary-softer) !important;
    color: var(--dental-primary-dark) !important;
}

/* ================================================================
   SIDEBAR
   ================================================================ */

body.dental-ui .sidebar-container {
    position: fixed !important;
    z-index: 1060 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: var(--dental-sidebar) !important;
    border-right: 1px solid var(--dental-line) !important;
    background: var(--dental-white) !important;
    box-shadow: 8px 0 30px rgba(29, 48, 56, 0.035) !important;
}

body.dental-ui .sidebar-menu {
    padding: 14px 12px 96px !important;
}

body.dental-ui .menu-section {
    margin: 18px 10px 7px !important;
    color: #89979C !important;
    font-size: 10px !important;
    font-weight: 650 !important;
    letter-spacing: 0.08em !important;
    line-height: 1.2 !important;
    text-transform: uppercase !important;
}

body.dental-ui .menu-item {
    position: relative !important;
    display: flex !important;
    min-height: 50px !important;
    margin: 2px 0 !important;
    padding: 7px 9px !important;
    align-items: center !important;
    border: 1px solid transparent !important;
    border-radius: var(--dental-radius-sm) !important;
    background: transparent !important;
    color: var(--dental-text) !important;
    box-shadow: none !important;
    transition:
        background var(--dental-transition),
        border-color var(--dental-transition),
        color var(--dental-transition) !important;
}

body.dental-ui .menu-item:hover {
    border-color: rgba(161, 214, 226, 0.6) !important;
    background: var(--dental-primary-softer) !important;
    color: var(--dental-primary-dark) !important;
    transform: none !important;
}

body.dental-ui .menu-item .icon-box {
    display: grid !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    margin-right: 10px !important;
    place-items: center !important;
    border: 0 !important;
    border-radius: var(--dental-radius-sm) !important;
    background: transparent !important;
    color: #64777E !important;
    box-shadow: none !important;
}

body.dental-ui .menu-item .label {
    display: block !important;
    color: inherit !important;
    font-size: 13.5px !important;
    font-weight: 620 !important;
    line-height: 1.18 !important;
}

body.dental-ui .menu-item .desc {
    display: block !important;
    margin-top: 2px !important;
    color: var(--dental-text-soft) !important;
    font-size: 10.5px !important;
    font-weight: 450 !important;
    line-height: 1.2 !important;
}

body.dental-ui .menu-item.active,
body.dental-ui .menu-item.active-parent {
    border-color: rgba(25, 149, 173, 0.26) !important;
    background: var(--dental-primary-soft) !important;
    color: var(--dental-primary-dark) !important;
    box-shadow: inset 3px 0 0 var(--dental-primary) !important;
}

body.dental-ui .menu-item.active .icon-box,
body.dental-ui .menu-item.active-parent .icon-box {
    background: transparent !important;
    color: var(--dental-primary) !important;
}

body.dental-ui .menu-item.active .label,
body.dental-ui .menu-item.active-parent .label {
    color: var(--dental-primary-dark) !important;
    font-weight: 680 !important;
}

body.dental-ui .menu-item.active .desc,
body.dental-ui .menu-item.active-parent .desc {
    color: #5B7C84 !important;
}

body.dental-ui .sidebar-footer {
    border-top: 1px solid var(--dental-line) !important;
    background: var(--dental-white) !important;
}

body.dental-ui .sidebar-footer .user-card {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.dental-ui .user-avatar,
body.dental-ui .avatar,
body.dental-ui .avatar-mark {
    display: grid !important;
    place-items: center !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-primary) !important;
    color: var(--dental-white) !important;
}

/* ================================================================
   ENCABEZADOS DE PÁGINA
   ================================================================ */

body.dental-ui .page-head,
body.dental-ui .page-titlebar,
body.dental-ui .form-titlebar,
body.dental-ui .seccion-header {
    display: flex !important;
    margin: 0 0 22px !important;
    padding: 0 0 18px !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 20px !important;
    border-bottom: 1px solid var(--dental-line) !important;
}

body.dental-ui .page-head > div,
body.dental-ui .seccion-textos {
    min-width: 0 !important;
}

body.dental-ui .page-head h1,
body.dental-ui .page-titlebar h1,
body.dental-ui .form-titlebar h1,
body.dental-ui .seccion-titulo,
body.dental-ui .form-head h1 {
    margin: 0 !important;
    color: var(--dental-ink) !important;
    font-size: clamp(27px, 2.5vw, 36px) !important;
    font-variation-settings: "wght" 690 !important;
    font-weight: 690 !important;
    letter-spacing: -0.035em !important;
    line-height: 1.05 !important;
    text-wrap: balance;
}

body.dental-ui .page-head p,
body.dental-ui .page-titlebar p,
body.dental-ui .form-titlebar p,
body.dental-ui .subline,
body.dental-ui .seccion-descripcion,
body.dental-ui .hint {
    max-width: 760px !important;
    margin: 6px 0 0 !important;
    color: var(--dental-text-soft) !important;
    font-size: 13.5px !important;
    font-weight: 450 !important;
    line-height: 1.55 !important;
}

body.dental-ui .page-kicker,
body.dental-ui .section-kicker,
body.dental-ui .eyebrow {
    display: block !important;
    min-height: 0 !important;
    margin: 0 0 6px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--dental-primary) !important;
    font-size: 10.5px !important;
    font-weight: 680 !important;
    letter-spacing: 0.07em !important;
    text-transform: uppercase !important;
}

body.dental-ui .seccion-icono {
    display: grid !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    place-items: center !important;
    border: 1px solid rgba(25, 149, 173, 0.18) !important;
    border-radius: var(--dental-radius) !important;
    background: var(--dental-primary-soft) !important;
    color: var(--dental-primary) !important;
    box-shadow: none !important;
}

/* ================================================================
   PANELES Y TARJETAS
   ================================================================ */

body.dental-ui .panel,
body.dental-ui .list-panel,
body.dental-ui .form-panel,
body.dental-ui .patient-form,
body.dental-ui .appointment-form,
body.dental-ui .operation-form,
body.dental-ui .file-form,
body.dental-ui .user-form-screen,
body.dental-ui .method-editor,
body.dental-ui .doctor-scope-panel,
body.dental-ui .permission-group,
body.dental-ui .role-record,
body.dental-ui .roles-table,
body.dental-ui .report-sheet,
body.dental-ui .operation-workbench,
body.dental-ui .premium-card,
body.dental-ui .user-card,
body.dental-ui .modal-content,
body.dental-ui .user-modal-card {
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius) !important;
    background: var(--dental-white) !important;
    box-shadow: var(--dental-shadow-xs) !important;
}

body.dental-ui .panel,
body.dental-ui .form-panel,
body.dental-ui .patient-form,
body.dental-ui .appointment-form,
body.dental-ui .operation-form,
body.dental-ui .file-form,
body.dental-ui .user-form-screen {
    padding: 20px !important;
}

body.dental-ui .panel,
body.dental-ui .metric-card,
body.dental-ui .premium-card,
body.dental-ui .user-card {
    transition:
        border-color var(--dental-transition),
        box-shadow var(--dental-transition) !important;
}

body.dental-ui .panel:hover,
body.dental-ui .metric-card:hover,
body.dental-ui .premium-card:hover,
body.dental-ui .user-card:hover {
    border-color: var(--dental-line-strong) !important;
    box-shadow: var(--dental-shadow-sm) !important;
    transform: none !important;
}

body.dental-ui .panel-head,
body.dental-ui .panel-title,
body.dental-ui .tool-head,
body.dental-ui .list-toolbar,
body.dental-ui .ledger-head,
body.dental-ui .directory-head {
    display: flex !important;
    margin: 0 0 16px !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
}

body.dental-ui .list-panel,
body.dental-ui .ledger-panel,
body.dental-ui .directory-panel,
body.dental-ui .timeline-panel,
body.dental-ui .queue-panel {
    overflow: hidden !important;
    padding: 0 !important;
}

body.dental-ui .list-panel > header,
body.dental-ui .ledger-head,
body.dental-ui .directory-head,
body.dental-ui .timeline-panel > header,
body.dental-ui .queue-panel > header,
body.dental-ui .list-toolbar {
    margin: 0 !important;
    padding: 15px 18px !important;
    border-bottom: 1px solid var(--dental-line) !important;
    background: #FBFDFD !important;
}

body.dental-ui .panel h2,
body.dental-ui .panel-title h2,
body.dental-ui .list-toolbar h2 {
    margin: 0 !important;
    color: var(--dental-ink) !important;
    font-size: 17px !important;
    font-weight: 660 !important;
    letter-spacing: -0.018em !important;
}

body.dental-ui .panel h3 {
    margin: 0 !important;
    color: var(--dental-ink) !important;
    font-size: 14px !important;
    font-weight: 640 !important;
}

/* ================================================================
   MÉTRICAS
   ================================================================ */

body.dental-ui .metric-grid,
body.dental-ui .summary-strip,
body.dental-ui .care-stats,
body.dental-ui .package-strip {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)) !important;
    gap: 12px !important;
}

body.dental-ui .metric-card,
body.dental-ui .metric,
body.dental-ui .care-stats > span,
body.dental-ui .package-strip article {
    min-height: 118px !important;
    padding: 16px !important;
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius) !important;
    background: var(--dental-white) !important;
    box-shadow: var(--dental-shadow-xs) !important;
}

body.dental-ui .metric-card > span,
body.dental-ui .metric > span {
    display: grid !important;
    width: 36px !important;
    height: 36px !important;
    margin-bottom: 13px !important;
    place-items: center !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-primary-soft) !important;
    color: var(--dental-primary) !important;
}

body.dental-ui .metric-card small,
body.dental-ui .metric small,
body.dental-ui .package-strip small {
    display: block !important;
    color: var(--dental-text-soft) !important;
    font-size: 11.5px !important;
    font-weight: 520 !important;
    line-height: 1.35 !important;
}

body.dental-ui .metric-card strong,
body.dental-ui .metric strong,
body.dental-ui .package-strip strong,
body.dental-ui .care-stats b {
    display: block !important;
    margin-top: 5px !important;
    color: var(--dental-ink) !important;
    font-size: clamp(23px, 2vw, 30px) !important;
    font-weight: 680 !important;
    letter-spacing: -0.04em !important;
    line-height: 1 !important;
}

body.dental-ui .metric-hot {
    border-color: var(--dental-primary) !important;
    background: var(--dental-primary) !important;
    color: var(--dental-white) !important;
}

body.dental-ui .metric-hot strong,
body.dental-ui .metric-hot small,
body.dental-ui .metric-hot span {
    color: var(--dental-white) !important;
}

/* ================================================================
   GRIDS
   ================================================================ */

body.dental-ui .grid,
body.dental-ui .board,
body.dental-ui .module-list,
body.dental-ui .user-cards-container {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)) !important;
    gap: 14px !important;
}

body.dental-ui .layout {
    display: grid !important;
    grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr) !important;
    gap: 16px !important;
    align-items: start !important;
}

body.dental-ui .work-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
    align-items: start !important;
}

body.dental-ui .record-layout,
body.dental-ui .calendar-shell {
    display: grid !important;
    grid-template-columns: 310px minmax(0, 1fr) !important;
    gap: 16px !important;
    align-items: start !important;
}

/* ================================================================
   LISTAS
   ================================================================ */

body.dental-ui .patient-row,
body.dental-ui .appointment-row,
body.dental-ui .ledger-row,
body.dental-ui .file-row,
body.dental-ui .directory-row,
body.dental-ui .timeline-row,
body.dental-ui .module-row,
body.dental-ui .user-row,
body.dental-ui .request-card,
body.dental-ui .method-row,
body.dental-ui .row,
body.dental-ui .queue-item {
    min-width: 0 !important;
    margin: 0 !important;
    padding: 14px 18px !important;
    border: 0 !important;
    border-bottom: 1px solid #E9EFF1 !important;
    border-radius: 0 !important;
    background: var(--dental-white) !important;
    box-shadow: none !important;
    transition: background var(--dental-transition) !important;
}

body.dental-ui .patient-row:last-child,
body.dental-ui .appointment-row:last-child,
body.dental-ui .ledger-row:last-child,
body.dental-ui .file-row:last-child,
body.dental-ui .directory-row:last-child,
body.dental-ui .timeline-row:last-child,
body.dental-ui .module-row:last-child,
body.dental-ui .user-row:last-child,
body.dental-ui .method-row:last-child,
body.dental-ui .row:last-child {
    border-bottom: 0 !important;
}

body.dental-ui .patient-row:hover,
body.dental-ui .appointment-row:hover,
body.dental-ui .ledger-row:hover,
body.dental-ui .file-row:hover,
body.dental-ui .directory-row:hover,
body.dental-ui .timeline-row:hover,
body.dental-ui .module-row:hover,
body.dental-ui .user-row:hover,
body.dental-ui .request-card:hover,
body.dental-ui .method-row:hover,
body.dental-ui .queue-item:hover {
    background: var(--dental-primary-softer) !important;
    transform: none !important;
}

body.dental-ui .timeline-row.active,
body.dental-ui .queue-item.active,
body.dental-ui .fiscal-option.active {
    background: var(--dental-primary-soft) !important;
    box-shadow: inset 3px 0 0 var(--dental-primary) !important;
}

/* ================================================================
   BOTONES
   ================================================================ */

body.dental-ui button,
body.dental-ui .btn,
body.dental-ui .btn-primary,
body.dental-ui .btn-secondary,
body.dental-ui .btn-main,
body.dental-ui .btn-soft,
body.dental-ui .btn-light,
body.dental-ui .btn-ghost,
body.dental-ui .btn-link,
body.dental-ui .inline-btn,
body.dental-ui .text-action,
body.dental-ui .icon-button,
body.dental-ui .back-button,
body.dental-ui .back-btn,
body.dental-ui .collect-btn {
    min-height: 38px !important;
    border-radius: var(--dental-radius-sm) !important;
    font-size: 12.5px !important;
    font-weight: 610 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    transition:
        background var(--dental-transition),
        border-color var(--dental-transition),
        color var(--dental-transition),
        box-shadow var(--dental-transition),
        transform var(--dental-transition) !important;
}

body.dental-ui button:focus-visible,
body.dental-ui a:focus-visible,
body.dental-ui input:focus-visible,
body.dental-ui select:focus-visible,
body.dental-ui textarea:focus-visible {
    outline: none !important;
    box-shadow: var(--dental-focus) !important;
}

body.dental-ui .btn-primary,
body.dental-ui .btn-main,
body.dental-ui .btn-dark,
body.dental-ui .collect-btn,
body.dental-ui form button:not(.btn-danger):not(.btn-secondary):not(.btn-light):not(.btn-soft):not(.btn-link):not(.icon-button) {
    display: inline-flex !important;
    padding: 10px 14px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid var(--dental-primary) !important;
    background: var(--dental-primary) !important;
    color: var(--dental-white) !important;
}

body.dental-ui .btn-primary:hover,
body.dental-ui .btn-main:hover,
body.dental-ui .btn-dark:hover,
body.dental-ui .collect-btn:hover,
body.dental-ui form button:not(.btn-danger):not(.btn-secondary):not(.btn-light):not(.btn-soft):not(.btn-link):not(.icon-button):hover {
    border-color: var(--dental-primary-hover) !important;
    background: var(--dental-primary-hover) !important;
    color: var(--dental-white) !important;
    transform: translateY(-1px) !important;
}

body.dental-ui .btn-secondary,
body.dental-ui .btn-soft,
body.dental-ui .btn-light,
body.dental-ui .btn-link,
body.dental-ui .inline-btn,
body.dental-ui .text-action,
body.dental-ui .back-button,
body.dental-ui .back-btn {
    display: inline-flex !important;
    padding: 9px 12px !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;
    border: 1px solid var(--dental-line-strong) !important;
    background: var(--dental-white) !important;
    color: var(--dental-text) !important;
}

body.dental-ui .btn-secondary:hover,
body.dental-ui .btn-soft:hover,
body.dental-ui .btn-light:hover,
body.dental-ui .btn-link:hover,
body.dental-ui .inline-btn:hover,
body.dental-ui .text-action:hover,
body.dental-ui .back-button:hover,
body.dental-ui .back-btn:hover {
    border-color: var(--dental-soft) !important;
    background: var(--dental-primary-softer) !important;
    color: var(--dental-primary-dark) !important;
}

body.dental-ui .icon-button,
body.dental-ui .icon-btn {
    display: inline-grid !important;
    width: 38px !important;
    height: 38px !important;
    min-height: 38px !important;
    padding: 0 !important;
    place-items: center !important;
    border: 1px solid var(--dental-line) !important;
    background: var(--dental-white) !important;
    color: var(--dental-text-soft) !important;
}

body.dental-ui .icon-button:hover,
body.dental-ui .icon-btn:hover {
    border-color: var(--dental-soft) !important;
    background: var(--dental-primary-softer) !important;
    color: var(--dental-primary-dark) !important;
}

body.dental-ui .btn-danger,
body.dental-ui .danger-item,
body.dental-ui .btn-delete-card,
body.dental-ui .text-action.danger,
body.dental-ui .icon-button.danger,
body.dental-ui .icon-btn.delete {
    border-color: #F0CACA !important;
    background: var(--dental-danger-soft) !important;
    color: var(--dental-danger) !important;
}

body.dental-ui .btn-danger:hover,
body.dental-ui .btn-delete-card:hover,
body.dental-ui .text-action.danger:hover,
body.dental-ui .icon-button.danger:hover {
    border-color: #E7AAAA !important;
    background: #FFE8E8 !important;
    color: #A83939 !important;
}

body.dental-ui .head-actions,
body.dental-ui .action-rail,
body.dental-ui .panel-actions,
body.dental-ui .row-actions,
body.dental-ui .module-actions,
body.dental-ui .form-actions,
body.dental-ui .actions {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}

/* ================================================================
   FORMULARIOS
   ================================================================ */

body.dental-ui label {
    display: grid;
    gap: 6px;
    color: var(--dental-text) !important;
    font-size: 12px !important;
    font-weight: 590 !important;
    line-height: 1.3 !important;
}

body.dental-ui input,
body.dental-ui select,
body.dental-ui textarea,
body.dental-ui .vs__dropdown-toggle {
    width: 100% !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
    border: 1px solid var(--dental-line-strong) !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-white) !important;
    color: var(--dental-ink) !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    outline: none !important;
    box-shadow: none !important;
    transition:
        border-color var(--dental-transition),
        box-shadow var(--dental-transition),
        background var(--dental-transition) !important;
}

body.dental-ui textarea {
    min-height: 104px !important;
    resize: vertical;
    line-height: 1.5 !important;
}

body.dental-ui input::placeholder,
body.dental-ui textarea::placeholder {
    color: var(--dental-placeholder) !important;
    opacity: 1;
}

body.dental-ui input:hover,
body.dental-ui select:hover,
body.dental-ui textarea:hover,
body.dental-ui .vs__dropdown-toggle:hover {
    border-color: #B6C8CD !important;
}

body.dental-ui input:focus,
body.dental-ui select:focus,
body.dental-ui textarea:focus,
body.dental-ui .vs__dropdown-toggle:focus-within {
    border-color: var(--dental-primary) !important;
    background: var(--dental-white) !important;
    box-shadow: var(--dental-focus) !important;
}

body.dental-ui input:disabled,
body.dental-ui select:disabled,
body.dental-ui textarea:disabled {
    cursor: not-allowed;
    background: #F5F7F7 !important;
    color: #89969A !important;
}

body.dental-ui .form-grid,
body.dental-ui .mini-form,
body.dental-ui .form-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
}

body.dental-ui .wide,
body.dental-ui .full,
body.dental-ui .form-actions {
    grid-column: 1 / -1 !important;
}

body.dental-ui fieldset {
    margin: 0 !important;
    padding: 18px 0 0 !important;
    border: 0 !important;
    border-top: 1px solid var(--dental-line) !important;
}

/* ================================================================
   TABLAS
   ================================================================ */

body.dental-ui .table-wrap {
    width: 100% !important;
    overflow-x: auto !important;
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius) !important;
    background: var(--dental-white) !important;
}

body.dental-ui table {
    width: 100% !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
}

body.dental-ui th {
    padding: 11px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--dental-line) !important;
    background: #F8FAFA !important;
    color: var(--dental-text-soft) !important;
    font-size: 10.5px !important;
    font-weight: 650 !important;
    letter-spacing: 0.045em !important;
    text-align: left !important;
    text-transform: uppercase !important;
    white-space: nowrap;
}

body.dental-ui td {
    padding: 13px 14px !important;
    border: 0 !important;
    border-bottom: 1px solid #EAF0F1 !important;
    background: var(--dental-white) !important;
    color: var(--dental-text) !important;
    font-size: 13px !important;
    vertical-align: middle !important;
}

body.dental-ui tbody tr:last-child td {
    border-bottom: 0 !important;
}

body.dental-ui tbody tr {
    transition: background var(--dental-transition);
}

body.dental-ui tbody tr:hover td {
    background: var(--dental-primary-softer) !important;
}

/* ================================================================
   ESTADOS
   ================================================================ */

body.dental-ui .status,
body.dental-ui .status-pill,
body.dental-ui .meta-badge,
body.dental-ui .status-badge,
body.dental-ui .modules span,
body.dental-ui .appt-chip {
    display: inline-flex !important;
    min-height: 25px !important;
    padding: 5px 9px !important;
    align-items: center !important;
    gap: 5px !important;
    border: 1px solid transparent !important;
    border-radius: 999px !important;
    background: #EFF3F4 !important;
    color: #586A71 !important;
    font-size: 11px !important;
    font-weight: 590 !important;
    line-height: 1 !important;
}

body.dental-ui .status.active,
body.dental-ui .status.pagado,
body.dental-ui .status.confirmada,
body.dental-ui .status-active,
body.dental-ui .appt-chip.confirmada {
    border-color: #CBE7DE !important;
    background: var(--dental-success-soft) !important;
    color: var(--dental-success) !important;
}

body.dental-ui .status.pendiente,
body.dental-ui .status.por_vencer,
body.dental-ui .status.vencido {
    border-color: #EBD9B6 !important;
    background: var(--dental-warning-soft) !important;
    color: var(--dental-warning) !important;
}

body.dental-ui .status.suspendido,
body.dental-ui .status.cancelado,
body.dental-ui .status.rechazada,
body.dental-ui .status-inactive,
body.dental-ui .appt-chip.cancelada {
    border-color: #F0CACA !important;
    background: var(--dental-danger-soft) !important;
    color: var(--dental-danger) !important;
}

body.dental-ui .appt-chip.atendida {
    border-color: rgba(25, 149, 173, 0.22) !important;
    background: var(--dental-primary-soft) !important;
    color: var(--dental-primary-dark) !important;
}

/* ================================================================
   AGENDA
   ================================================================ */

body.dental-ui .calendar-panel {
    overflow-x: auto !important;
    padding: 14px !important;
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius) !important;
    background: var(--dental-white) !important;
}

body.dental-ui .week-head,
body.dental-ui .month-grid {
    display: grid !important;
    grid-template-columns: repeat(7, minmax(88px, 1fr)) !important;
    gap: 5px !important;
}

body.dental-ui .day-cell {
    min-height: 130px !important;
    padding: 9px !important;
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-white) !important;
    box-shadow: none !important;
    transition:
        border-color var(--dental-transition),
        background var(--dental-transition) !important;
}

body.dental-ui .day-cell:hover {
    border-color: var(--dental-soft) !important;
    background: var(--dental-primary-softer) !important;
}

body.dental-ui .day-cell.today,
body.dental-ui .day-cell.selected {
    border-color: var(--dental-primary) !important;
    background: var(--dental-primary-soft) !important;
}

/* ================================================================
   MODALES
   ================================================================ */

body.dental-ui .modal-content,
body.dental-ui .user-modal-card,
body.dental-ui .cash-modal,
body.dental-ui .summary-modal {
    overflow: hidden !important;
    border: 1px solid var(--dental-line) !important;
    border-radius: var(--dental-radius-lg) !important;
    background: var(--dental-white) !important;
    box-shadow: 0 28px 80px rgba(29, 48, 56, 0.18) !important;
}

body.dental-ui .modal-header,
body.dental-ui .custom-modal-header,
body.dental-ui .cash-modal header,
body.dental-ui .summary-modal header {
    padding: 16px 18px !important;
    border-bottom: 1px solid var(--dental-line) !important;
    background: #FBFDFD !important;
}

body.dental-ui .modal-body {
    padding: 18px !important;
}

body.dental-ui .modal-footer {
    display: flex !important;
    padding: 14px 18px !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 8px !important;
    border-top: 1px solid var(--dental-line) !important;
    background: #FBFDFD !important;
}

/* ================================================================
   ESTADOS VACÍOS Y AVISOS
   ================================================================ */

body.dental-ui .empty,
body.dental-ui .empty-state,
body.dental-ui .context-empty,
body.dental-ui .fiscal-empty,
body.dental-ui .no-users-premium,
body.dental-ui .no-access {
    padding: 28px 20px !important;
    border: 1px dashed var(--dental-line-strong) !important;
    border-radius: var(--dental-radius) !important;
    background: #FAFCFC !important;
    color: var(--dental-text-soft) !important;
    text-align: center !important;
    box-shadow: none !important;
}

body.dental-ui .notice {
    display: flex !important;
    margin-bottom: 16px !important;
    padding: 12px 14px !important;
    align-items: center !important;
    gap: 9px !important;
    border: 1px solid #EBD9B6 !important;
    border-radius: var(--dental-radius-sm) !important;
    background: var(--dental-warning-soft) !important;
    color: var(--dental-warning) !important;
    font-size: 12.5px !important;
    font-weight: 560 !important;
}

/* ================================================================
   RESPONSIVE
   ================================================================ */

@media (max-width: 1180px) {
    body.dental-ui .layout,
    body.dental-ui .record-layout,
    body.dental-ui .calendar-shell,
    body.dental-ui .work-grid,
    body.dental-ui .lists,
    body.dental-ui .cash-workbench,
    body.dental-ui .agenda-workbench {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 991px) {
    :root {
        --dental-header: 60px;
    }

    body.dental-ui .clinic-page,
    body.dental-ui .content-page,
    body.dental-ui .saas-page {
        padding:
            calc(var(--dental-header) + 16px)
            14px
            104px !important;
    }

    body.dental-ui .navbar-custom {
        left: 0 !important;
    }

    body.dental-ui .page-head,
    body.dental-ui .page-titlebar,
    body.dental-ui .form-titlebar,
    body.dental-ui .seccion-header {
        align-items: flex-start !important;
        flex-direction: column !important;
        gap: 12px !important;
    }

    body.dental-ui .page-head h1,
    body.dental-ui .page-titlebar h1,
    body.dental-ui .form-titlebar h1,
    body.dental-ui .seccion-titulo {
        font-size: 28px !important;
    }

    body.dental-ui .grid,
    body.dental-ui .board,
    body.dental-ui .module-list,
    body.dental-ui .metric-grid,
    body.dental-ui .summary-strip,
    body.dental-ui .care-stats,
    body.dental-ui .package-strip,
    body.dental-ui .form-grid,
    body.dental-ui .mini-form,
    body.dental-ui .form-row,
    body.dental-ui .user-form-screen {
        grid-template-columns: 1fr !important;
    }

    body.dental-ui .head-actions,
    body.dental-ui .panel-actions,
    body.dental-ui .row-actions,
    body.dental-ui .module-actions {
        width: 100% !important;
        align-items: stretch !important;
        justify-content: stretch !important;
    }

    body.dental-ui .week-head,
    body.dental-ui .month-grid {
        min-width: 720px !important;
    }

    body.dental-ui table {
        min-width: 720px !important;
    }
}

@media (max-width: 600px) {
    body.dental-ui .clinic-page,
    body.dental-ui .content-page,
    body.dental-ui .saas-page {
        padding-right: 11px !important;
        padding-left: 11px !important;
    }

    body.dental-ui .panel,
    body.dental-ui .form-panel,
    body.dental-ui .patient-form,
    body.dental-ui .appointment-form,
    body.dental-ui .operation-form,
    body.dental-ui .file-form,
    body.dental-ui .user-form-screen {
        padding: 15px !important;
    }

    body.dental-ui .page-head h1,
    body.dental-ui .page-titlebar h1,
    body.dental-ui .form-titlebar h1,
    body.dental-ui .seccion-titulo {
        font-size: 25px !important;
    }

    body.dental-ui .head-actions,
    body.dental-ui .panel-actions,
    body.dental-ui .row-actions,
    body.dental-ui .module-actions,
    body.dental-ui .form-actions {
        flex-direction: column !important;
        align-items: stretch !important;
    }

    body.dental-ui .head-actions > *,
    body.dental-ui .panel-actions > *,
    body.dental-ui .row-actions > *,
    body.dental-ui .module-actions > *,
    body.dental-ui .form-actions > * {
        width: 100% !important;
        justify-content: center !important;
    }

    body.dental-ui .metric-card,
    body.dental-ui .metric,
    body.dental-ui .care-stats > span,
    body.dental-ui .package-strip article {
        min-height: 104px !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.dental-ui *,
    body.dental-ui *::before,
    body.dental-ui *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* HEADER_HORIZONTAL_SIN_SIDEBAR_INICIO */

/*
 * El menú principal ahora vive dentro del Header.
 * Estas reglas anulan definitivamente el espacio reservado
 * para el antiguo menú lateral.
 */
@media (min-width: 992px) {
  body.dental-ui {
    --dental-sidebar: 0px !important;
  }

  body.dental-ui .sidebar-container {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
  }

  body.dental-ui .navbar-custom {
    left: 0 !important;
    right: 0 !important;

    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    border-left: 0 !important;
    transform: none !important;
  }

  body.dental-ui .clinic-page,
  body.dental-ui .content-page,
  body.dental-ui .saas-page,
  body.dental-ui .roles-page,
  body.dental-ui main.clinic-page,
  body.dental-ui main.content-page,
  body.dental-ui main.saas-page,
  body.dental-ui main.roles-page {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  body.dental-ui:has(.sidebar-container) main.clinic-page,
  body.dental-ui:has(.sidebar-container) main.content-page,
  body.dental-ui:has(.sidebar-container) main.saas-page,
  body.dental-ui:has(.sidebar-container) main.roles-page {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;

    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  body.dental-ui .clinic-page > *,
  body.dental-ui .content-page > *,
  body.dental-ui .saas-page > *,
  body.dental-ui .roles-page > * {
    width: 100% !important;
    max-width: none !important;

    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* HEADER_HORIZONTAL_SIN_SIDEBAR_FIN */

@media (min-width: 992px) {
  /*
   * Conserva el dashboard centrado y profesional.
   * El encabezado y las tarjetas comparten el mismo ancho.
   */
  body.dental-ui main.clinic-page,
  body.dental-ui main.content-page,
  body.dental-ui main.saas-page,
  body.dental-ui main.roles-page,
  body.dental-ui .clinic-page,
  body.dental-ui .content-page,
  body.dental-ui .saas-page,
  body.dental-ui .roles-page {
    width: 100% !important;
    max-width: 1360px !important;

    margin-left: auto !important;
    margin-right: auto !important;

    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.dental-ui .clinic-page > *,
  body.dental-ui .content-page > *,
  body.dental-ui .saas-page > *,
  body.dental-ui .roles-page > * {
    max-width: none !important;
  }
}

/* ================================================================
     DASHBOARD CLINICO PREMIUM
     ================================================================ */
body.dental-ui:has(.clinic-dashboard) { background: var(--clinic-background) !important; }

body.dental-ui .clinic-dashboard {
    --clinic-ios-control-height: 50px;
    --clinic-ios-control-radius: 16px;
    --clinic-ios-card-radius: 28px;
    --clinic-ios-pill-radius: 999px;
    --clinic-ios-border: rgba(129, 158, 197, .18);
    --clinic-ios-shadow: 0 14px 38px rgba(47, 91, 150, .09), 0 2px 8px rgba(47, 91, 150, .035);
    --clinic-ios-control-shadow: 0 8px 20px rgba(47, 91, 150, .08), inset 0 1px 0 rgba(255, 255, 255, .72);
    width: 100% !important;
    max-width: 1400px !important;
    min-height: 100vh !important;
    margin: 0 auto !important;
    padding: calc(var(--dental-header) + 26px) 28px 56px !important;
    overflow-x: clip;
    color: var(--clinic-text);
    font-family: "Space Grotesk Variable", "Space Grotesk", sans-serif;
    text-transform: capitalize;
}
body.dental-ui .clinic-dashboard > * { width: 100% !important; max-width: none !important; }

body.dental-ui .clinic-dashboard__header {
    position: relative;
    min-height: 122px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 26px;
    padding: 5px 6px;
}
body.dental-ui .clinic-dashboard__heading { position: relative; z-index: 1; min-width: 0; }
body.dental-ui .clinic-dashboard__greeting { display: block; margin-bottom: 3px; color: var(--clinic-primary); font-size: 14px; font-weight: 600; }
body.dental-ui .clinic-dashboard__heading h1 { margin: 0 !important; color: var(--clinic-text) !important; font-size: clamp(30px, 2.5vw, 34px) !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 1.14 !important; }
body.dental-ui .clinic-dashboard__heading p { margin: 8px 0 13px; color: var(--clinic-text-secondary); font-size: 14px; line-height: 1.5; }
body.dental-ui .clinic-dashboard__date { display: inline-flex; align-items: center; gap: 7px; color: #536176; font-size: 13px; font-weight: 550; text-transform: capitalize; }
body.dental-ui .clinic-dashboard__date svg { width: 18px; height: 18px; color: var(--clinic-primary); }

body.dental-ui .clinic-dashboard__actions { position: relative; z-index: 2; min-width: 0; display: flex; align-items: center; justify-content: flex-end; gap: 12px; }
body.dental-ui .clinic-dashboard__search { width: min(320px, 25vw); min-height: var(--clinic-ios-control-height) !important; display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; padding: 0 16px; align-items: center; gap: 11px; border: 1px solid var(--clinic-ios-border); border-radius: var(--clinic-ios-control-radius) !important; background: rgba(255,255,255,.94); color: var(--clinic-text-secondary); font-size: 14px !important; text-align: left; box-shadow: var(--clinic-ios-control-shadow) !important; backdrop-filter: blur(12px); transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
body.dental-ui .clinic-dashboard__search:hover { border-color: rgba(79,141,247,.3); background: #fff; color: var(--clinic-text); box-shadow: 0 11px 26px rgba(47,91,150,.11) !important; transform: translateY(-1px); }
body.dental-ui .clinic-dashboard__search kbd { min-width: 42px; padding: 4px 7px; border: 1px solid rgba(129,158,197,.22); border-radius: 8px; background: linear-gradient(180deg,#fff 0%,#f2f6fc 100%); color: #6d788a; font: inherit; font-size: 10px; font-weight: 650; text-align: center; box-shadow: 0 1px 2px rgba(47,91,150,.08); }

body.dental-ui .clinic-dashboard__button { min-height: var(--clinic-ios-control-height); display: inline-flex; padding: 0 23px; align-items: center; justify-content: center; gap: 9px; border: 1px solid transparent; border-radius: var(--clinic-ios-control-radius); font-size: 14px; font-weight: 650; line-height: 1; text-decoration: none; white-space: nowrap; -webkit-tap-highlight-color: transparent; transition: background 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
body.dental-ui .clinic-dashboard__button svg { width: 20px; height: 20px; }
body.dental-ui .clinic-dashboard__button:hover { transform: translateY(-1px); }
body.dental-ui .clinic-dashboard__button:active { transform: translateY(0) scale(.985); }
body.dental-ui .clinic-dashboard__button--primary { border-color: rgba(49,117,231,.08); background: linear-gradient(180deg,#5a96fa 0%,#4284f2 100%); color: #fff; box-shadow: 0 10px 24px rgba(57,121,235,.25), inset 0 1px 0 rgba(255,255,255,.22); }
body.dental-ui .clinic-dashboard__button--primary:hover { border-color: transparent; background: linear-gradient(180deg,#5591f6 0%,#3679eb 100%); color: #fff; box-shadow: 0 13px 28px rgba(57,121,235,.3), inset 0 1px 0 rgba(255,255,255,.2); }
body.dental-ui .clinic-dashboard__button--secondary { border-color: var(--clinic-ios-border); background: rgba(255,255,255,.92); color: var(--clinic-primary-strong); box-shadow: 0 4px 12px rgba(47,91,150,.045); }
body.dental-ui .clinic-dashboard__button--secondary:hover { border-color: rgba(79,141,247,.26); background: #f7faff; color: var(--clinic-primary-strong); box-shadow: 0 8px 18px rgba(47,91,150,.08); }
body.dental-ui .clinic-dashboard__button--light { border-color: rgba(255,255,255,.72); background: rgba(255,255,255,.96); color: var(--clinic-primary-strong); box-shadow: 0 10px 26px rgba(29,72,135,.16), inset 0 1px 0 #fff; }
body.dental-ui .clinic-dashboard__button--light:hover { background: #fff; color: var(--clinic-primary-strong); box-shadow: 0 13px 30px rgba(29,72,135,.2); }
body.dental-ui .clinic-dashboard__button--ghost { border-color: rgba(255,255,255,.34); background: rgba(255,255,255,.11); color: #fff; box-shadow: inset 0 1px 0 rgba(255,255,255,.12); backdrop-filter: blur(10px); }
body.dental-ui .clinic-dashboard__button--ghost:hover { border-color: rgba(255,255,255,.5); background: rgba(255,255,255,.18); color: #fff; }
body.dental-ui .clinic-dashboard__refresh { width: var(--clinic-ios-control-height) !important; height: var(--clinic-ios-control-height) !important; min-height: var(--clinic-ios-control-height) !important; display: grid; padding: 0 !important; place-items: center; border: 1px solid var(--clinic-ios-border) !important; border-radius: var(--clinic-ios-control-radius) !important; background: rgba(255,255,255,.94) !important; color: var(--clinic-text-secondary) !important; box-shadow: var(--clinic-ios-control-shadow) !important; transition: border-color 180ms ease, background 180ms ease, color 180ms ease, transform 180ms ease !important; }
body.dental-ui .clinic-dashboard__refresh:hover { border-color: rgba(79,141,247,.28) !important; background: #fff !important; color: var(--clinic-primary) !important; transform: translateY(-1px); }
body.dental-ui .clinic-dashboard__refresh:active { transform: scale(.96); }
body.dental-ui .clinic-dashboard__clock { min-width: 76px; text-align: right; }
body.dental-ui .clinic-dashboard__clock strong, body.dental-ui .clinic-dashboard__clock span { display: block; }
body.dental-ui .clinic-dashboard__clock strong { color: var(--clinic-text); font-size: 22px; font-variant-numeric: tabular-nums; font-weight: 700; line-height: 1; }
body.dental-ui .clinic-dashboard__clock span { margin-top: 4px; color: var(--clinic-text-secondary); font-size: 12px; }
body.dental-ui .clinic-dashboard__specialty-mark { position: absolute; z-index: 0; right: 41%; top: 10px; width: 76px; height: 76px; color: color-mix(in srgb,var(--clinic-primary) 10%,transparent); stroke-width: 1.45; transform: rotate(8deg); pointer-events: none; }

body.dental-ui .clinic-dashboard__alert { display: grid; grid-template-columns: 44px minmax(0,1fr) auto; margin: 0 0 16px; padding: 13px 15px; align-items: center; gap: 13px; border-radius: 16px; font-size: 13px; }
body.dental-ui .clinic-dashboard__alert > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 13px; background: rgba(255,255,255,.72); }
body.dental-ui .clinic-dashboard__alert strong, body.dental-ui .clinic-dashboard__alert p { display: block; margin: 0; color: inherit; }
body.dental-ui .clinic-dashboard__alert p { margin-top: 2px; line-height: 1.4; }
body.dental-ui .clinic-dashboard__alert a, body.dental-ui .clinic-dashboard__alert button { min-height: 42px; padding: 0 12px; border: 0; background: transparent; color: inherit; font-size: 13px; font-weight: 650; }
body.dental-ui .clinic-dashboard__alert--danger { background: #fff0f1; color: #a82f34; }
body.dental-ui .clinic-dashboard__alert--warning { background: #fff7e7; color: #9a6107; }
body.dental-ui .clinic-dashboard__alert--success { background: #ebf9f1; color: #167d49; }

body.dental-ui .clinic-dashboard__layout { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 24px; align-items: stretch; }
body.dental-ui .clinic-dashboard__hero { position: relative; min-height: 300px; display: grid; grid-column: 1 / span 8; grid-row: 1; grid-template-columns: minmax(0,1.42fr) minmax(230px,.58fr); overflow: hidden; border-radius: 30px; background: linear-gradient(135deg,color-mix(in srgb,var(--clinic-primary) 66%,white) 0%,var(--clinic-primary) 64%,var(--clinic-primary-strong) 100%); color: #fff; box-shadow: 0 20px 46px color-mix(in srgb,var(--clinic-primary) 22%,transparent), inset 0 1px 0 rgba(255,255,255,.18); }
body.dental-ui .clinic-dashboard__hero-content { position: relative; z-index: 2; min-width: 0; display: flex; padding: 36px 18px 36px 36px; flex-direction: column; justify-content: center; }
body.dental-ui .clinic-dashboard__hero-kicker { display: inline-flex; width: fit-content; align-items: center; gap: 7px; color: rgba(255,255,255,.84); font-size: 13px; font-weight: 600; }
body.dental-ui .clinic-dashboard__hero-kicker svg { width: 18px; height: 18px; }
body.dental-ui .clinic-dashboard__hero h2 { max-width: 570px; margin: 12px 0 9px; color: #fff !important; font-size: clamp(25px,2.1vw,29px); font-weight: 700; letter-spacing: 0; line-height: 1.16; }
body.dental-ui .clinic-dashboard__hero-content > p { max-width: 580px; margin: 0; color: rgba(255,255,255,.83); font-size: 14px; line-height: 1.5; }
body.dental-ui .clinic-dashboard__hero-content > p strong { color: #fff; font-weight: 650; }
body.dental-ui .clinic-dashboard__hero-facts { display: flex; gap: 30px; margin-top: 22px; }
body.dental-ui .clinic-dashboard__hero-facts > span { display: grid; grid-template-columns: 20px minmax(0,1fr); gap: 1px 8px; color: rgba(255,255,255,.72); font-size: 12px; }
body.dental-ui .clinic-dashboard__hero-facts svg { width: 20px; height: 20px; grid-row: 1 / span 2; color: rgba(255,255,255,.88); }
body.dental-ui .clinic-dashboard__hero-facts b { color: #fff; font-size: 13px; font-weight: 650; }
body.dental-ui .clinic-dashboard__hero-actions { display: flex; gap: 12px; margin-top: 24px; }

body.dental-ui .clinic-dashboard__hero-visual { position: relative; min-width: 0; overflow: hidden; }
body.dental-ui .clinic-dashboard__hero-visual::before { content: ""; position: absolute; inset: 20px 20px 20px 0; border-radius: 50% 24% 48% 42%; background: rgba(255,255,255,.12); }
body.dental-ui .clinic-dashboard__visual-orbit { position: absolute; border: 1px solid rgba(255,255,255,.26); border-radius: 50%; }
body.dental-ui .clinic-dashboard__visual-orbit--one { top: 34px; right: -32px; width: 225px; height: 225px; }
body.dental-ui .clinic-dashboard__visual-orbit--two { top: 68px; right: 1px; width: 158px; height: 158px; }
body.dental-ui .clinic-dashboard__visual-specialty { position: absolute; top: 38px; right: 47px; width: 148px; height: 166px; display: grid; place-items: center; }
body.dental-ui .clinic-dashboard__visual-specialty > svg { width: 112px; height: 112px; color: rgba(255,255,255,.94); stroke-width: 1.35; filter: drop-shadow(0 18px 22px rgba(34,83,160,.2)); }
body.dental-ui .clinic-dashboard__visual-specialty > span { position: absolute; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: #fff; color: var(--clinic-primary); box-shadow: 0 12px 28px rgba(33,79,150,.2); }
body.dental-ui .clinic-dashboard__visual-specialty > span svg { width: 23px; height: 23px; }
body.dental-ui .clinic-dashboard__visual-badge { position: absolute; right: 25px; bottom: 23px; display: grid; grid-template-columns: 34px minmax(0,1fr); padding: 10px 12px; align-items: center; gap: 9px; border-radius: 14px; background: rgba(255,255,255,.94); color: var(--clinic-text-secondary); font-size: 10px; box-shadow: 0 12px 30px rgba(27,67,129,.16); }
body.dental-ui .clinic-dashboard__visual-badge > svg { width: 34px; height: 34px; padding: 7px; border-radius: 10px; background: var(--clinic-primary-soft); color: var(--clinic-primary); }
body.dental-ui .clinic-dashboard__visual-badge b, body.dental-ui .clinic-dashboard__visual-badge span { display: block; }
body.dental-ui .clinic-dashboard__visual-badge b { color: var(--clinic-text); font-size: 11px; }

body.dental-ui :is(.clinic-dashboard__summary,.clinic-dashboard__schedule,.clinic-dashboard__next,.clinic-dashboard__quick-actions) { min-width: 0; border: 1px solid rgba(129,158,197,.1); border-radius: var(--clinic-ios-card-radius); background: rgba(255,255,255,.97); box-shadow: var(--clinic-ios-shadow); }
body.dental-ui .clinic-dashboard__summary { grid-column: 1 / span 8; grid-row: 2; padding: 28px 30px 22px; }
body.dental-ui .clinic-dashboard__section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
body.dental-ui .clinic-dashboard__section-heading > div > span, body.dental-ui .clinic-dashboard__schedule-header > div > span { display: block; margin-bottom: 3px; color: var(--clinic-primary); font-size: 13px; font-weight: 600; }
body.dental-ui .clinic-dashboard__section-heading h2, body.dental-ui .clinic-dashboard__schedule-header h2 { margin: 0; color: var(--clinic-text); font-size: 19px; font-weight: 700; letter-spacing: 0; line-height: 1.25; }
body.dental-ui .clinic-dashboard__section-heading > span { color: var(--clinic-text-secondary); font-size: 13px; font-weight: 550; }

body.dental-ui .clinic-dashboard__metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 24px; }
body.dental-ui .clinic-dashboard__metric { min-width: 0; display: grid; grid-template-columns: 50px 96px; min-height: 64px; padding: 7px 12px; align-items: center; justify-content: center; column-gap: 14px; border-right: 1px solid rgba(129,158,197,.16); }
body.dental-ui .clinic-dashboard__metric:last-child { border-right: 0; }
body.dental-ui .clinic-dashboard__metric-icon { width: 50px; height: 50px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 17px; background: var(--clinic-primary-soft); color: var(--clinic-primary); box-shadow: inset 0 1px 0 rgba(255,255,255,.65); }
body.dental-ui .clinic-dashboard__metric-icon svg { width: 22px; height: 22px; display: block; margin: 0; }
body.dental-ui .clinic-dashboard__metric-icon.amber { background: #fff5df; color: #c47a08; }
body.dental-ui .clinic-dashboard__metric-icon.green { background: #e9f9f0; color: var(--clinic-success); }
body.dental-ui .clinic-dashboard__metric-icon.red { background: #fff0f1; color: var(--clinic-danger); }
body.dental-ui .clinic-dashboard__metric > div { width: 96px; height: 50px; display: grid; grid-template-rows: 32px 18px; align-items: center; }
body.dental-ui .clinic-dashboard__metric strong { height: 32px; display: flex; align-items: flex-start; color: var(--clinic-text); font-size: 32px; font-variant-numeric: tabular-nums; font-weight: 700; letter-spacing: 0; line-height: 32px; }
body.dental-ui .clinic-dashboard__metric strong > span { line-height: inherit; }
body.dental-ui .clinic-dashboard__metric div > span { height: 18px; margin: 0; display: flex; align-items: flex-end; color: var(--clinic-text-secondary); font-size: 13px; line-height: 16px; white-space: nowrap; }
body.dental-ui .clinic-dashboard__summary-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-top: 23px; padding-top: 18px; align-items: center; gap: 10px; border-top: 1px solid rgba(129,158,197,.13); overflow-x: auto; scrollbar-width: none; }
body.dental-ui .clinic-dashboard__summary-meta::-webkit-scrollbar { display: none; }
body.dental-ui .clinic-dashboard__summary-meta > * { width: 100%; min-width: 0; min-height: 40px; display: inline-flex; padding: 0 9px; align-items: center; justify-content: center; gap: 6px; border: 1px solid rgba(129,158,197,.1); border-radius: var(--clinic-ios-pill-radius); background: #f4f8ff; color: var(--clinic-text-secondary); font-size: 11.5px; line-height: 1; text-decoration: none; white-space: nowrap; transition: background 180ms ease, border-color 180ms ease, transform 180ms ease; }
body.dental-ui .clinic-dashboard__summary-meta a:hover { border-color: rgba(79,141,247,.2); background: #ebf3ff; transform: translateY(-1px); }
body.dental-ui .clinic-dashboard__summary-meta svg { width: 17px; height: 17px; display: block; flex: 0 0 17px; margin: 0; color: var(--clinic-primary); }
body.dental-ui .clinic-dashboard__summary-meta b { color: #3d4a5e; font-weight: 650; line-height: 1; }

body.dental-ui .clinic-dashboard .dashboard-main, body.dental-ui .clinic-dashboard__sidebar { display: contents; }
body.dental-ui .clinic-dashboard__schedule { grid-column: 1 / span 8; grid-row: 3; overflow: hidden; }
body.dental-ui .clinic-dashboard__schedule-header { display: flex; padding: 27px 30px 23px; align-items: center; justify-content: space-between; gap: 24px; border-bottom: 1px solid rgba(129,158,197,.13); }
body.dental-ui .clinic-dashboard__schedule-header p { margin: 5px 0 0; color: var(--clinic-text-secondary); font-size: 13px; line-height: 1.4; }
body.dental-ui .clinic-dashboard .agenda-health { display: inline-flex; margin-top: 8px; align-items: center; gap: 7px; color: var(--clinic-text-secondary); font-size: 12px; font-weight: 550; }
body.dental-ui .clinic-dashboard .health-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--clinic-success); box-shadow: 0 0 0 4px rgba(32,173,103,.1); }
body.dental-ui .clinic-dashboard .agenda-controls { min-height: 50px; display: flex; padding: 4px; align-items: center; gap: 4px; border: 1px solid rgba(129,158,197,.1); border-radius: 18px; background: #f1f6fd; box-shadow: inset 0 1px 2px rgba(47,91,150,.04); }
body.dental-ui .clinic-dashboard .agenda-tabs-root { display: contents; }
body.dental-ui .clinic-dashboard .agenda-tabs { min-height: 42px; display: inline-flex; padding: 0; align-items: center; border-radius: 14px; background: transparent; }
body.dental-ui .clinic-dashboard .agenda-tab { min-height: 42px; padding: 0 16px; border: 0; border-radius: 14px; background: transparent; color: var(--clinic-text-secondary); font-size: 13px; font-weight: 600; transition: background 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
body.dental-ui .clinic-dashboard .agenda-tab:hover { color: var(--clinic-primary-strong); }
body.dental-ui .clinic-dashboard .agenda-tab[data-state="active"] { background: linear-gradient(180deg,#5a96fa 0%,#4284f2 100%); color: #fff; box-shadow: 0 7px 16px rgba(57,121,235,.22), inset 0 1px 0 rgba(255,255,255,.2); }
body.dental-ui .clinic-dashboard__text-link { min-height: 42px; display: inline-flex; padding: 0 13px; align-items: center; gap: 7px; border-radius: 14px; color: var(--clinic-primary-strong); font-size: 13px; font-weight: 600; white-space: nowrap; transition: background 180ms ease, color 180ms ease; }
body.dental-ui .clinic-dashboard__text-link:hover { background: rgba(255,255,255,.78); color: #145bc6; }
body.dental-ui .clinic-dashboard .agenda-scroll { position: relative; overflow: hidden; }
body.dental-ui .clinic-dashboard .agenda-viewport { width: 100%; max-height: 560px; }
body.dental-ui .clinic-dashboard .appointment-list { min-height: 260px; padding: 8px 12px 14px; }

body.dental-ui .clinic-dashboard__appointment { min-height: 80px; display: grid; grid-template-columns: minmax(0,1fr) 44px; align-items: center; gap: 4px; border-bottom: 1px solid #edf2f8; border-radius: 14px; transition: background 170ms ease; }
body.dental-ui .clinic-dashboard__appointment:hover, body.dental-ui .clinic-dashboard__appointment.is-next { background: var(--clinic-primary-softer); }
body.dental-ui .clinic-dashboard__appointment-main { min-width: 0; min-height: 80px; display: grid; grid-template-columns: 66px 46px minmax(0,1fr) auto; padding: 8px 7px 8px 12px; align-items: center; gap: 13px; color: var(--clinic-text); text-decoration: none; }
body.dental-ui .clinic-dashboard__appointment-time strong, body.dental-ui .clinic-dashboard__appointment-time span { display: block; }
body.dental-ui .clinic-dashboard__appointment-time strong { color: var(--clinic-text); font-size: 17px; font-variant-numeric: tabular-nums; font-weight: 700; }
body.dental-ui .clinic-dashboard__appointment-time span { margin-top: 3px; color: var(--clinic-text-secondary); font-size: 12px; }
body.dental-ui .clinic-dashboard__appointment-avatar { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; background: var(--clinic-primary-soft); color: var(--clinic-primary-strong); font-size: 13px; font-weight: 700; }
body.dental-ui .clinic-dashboard__appointment-person { min-width: 0; }
body.dental-ui .clinic-dashboard__appointment-person > strong, body.dental-ui .clinic-dashboard__appointment-person > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.dental-ui .clinic-dashboard__appointment-person > strong { color: var(--clinic-text); font-size: 14px; font-weight: 650; }
body.dental-ui .clinic-dashboard__appointment-person > span { margin-top: 3px; color: var(--clinic-text-secondary); font-size: 13px; }
body.dental-ui .clinic-dashboard .appointment-meta-line { display: flex; margin-top: 5px; align-items: center; flex-wrap: wrap; gap: 6px 10px; }
body.dental-ui .clinic-dashboard .appointment-meta-line small { display: inline-flex; align-items: center; gap: 5px; color: #7a8596; font-size: 12px; }
body.dental-ui .clinic-dashboard .appointment-meta-line svg { width: 14px; height: 14px; }
body.dental-ui .clinic-dashboard :is(.wait-pill,.clinic-dashboard__wait) { width: fit-content; padding: 4px 8px; border-radius: 999px; font-size: 12px; font-weight: 600; }
body.dental-ui .clinic-dashboard :is(.wait-pill,.clinic-dashboard__wait).success { background: #e9f9f0; color: #16824b; }
body.dental-ui .clinic-dashboard :is(.wait-pill,.clinic-dashboard__wait).warning { background: #fff5df; color: #9b6208; }
body.dental-ui .clinic-dashboard :is(.wait-pill,.clinic-dashboard__wait).danger { background: #fff0f1; color: #a82f34; }
body.dental-ui .clinic-dashboard .status-badge { min-height: 27px !important; display: inline-flex !important; padding: 5px 10px !important; align-items: center; border: 0 !important; border-radius: 999px; font-size: 12px !important; font-weight: 600 !important; letter-spacing: 0; text-transform: none; white-space: nowrap; }
body.dental-ui .clinic-dashboard .status-badge.neutral { background: #f0f3f7 !important; color: #566275 !important; }
body.dental-ui .clinic-dashboard .status-badge.success { background: #e9f9f0 !important; color: #16824b !important; }
body.dental-ui .clinic-dashboard .status-badge.warning { background: #fff5df !important; color: #9b6208 !important; }
body.dental-ui .clinic-dashboard .status-badge.danger { background: #fff0f1 !important; color: #a82f34 !important; }
body.dental-ui .clinic-dashboard__appointment-menu { width: 44px !important; height: 44px !important; min-height: 44px !important; display: grid; padding: 0 !important; place-items: center; border: 0 !important; border-radius: 12px !important; background: transparent !important; color: var(--clinic-text-secondary) !important; }
body.dental-ui .clinic-dashboard__appointment-menu:hover, body.dental-ui .clinic-dashboard__appointment-menu[data-state="open"] { background: var(--clinic-primary-soft) !important; color: var(--clinic-primary) !important; }

body.dental-ui .clinic-dashboard__available-slot { min-height: 64px; display: grid; grid-template-columns: 40px minmax(0,1fr) 20px; margin: 10px 4px 0; padding: 10px 12px; align-items: center; gap: 11px; border-radius: 14px; background: var(--clinic-primary-softer); color: var(--clinic-text); }
body.dental-ui .clinic-dashboard__available-slot > span:first-child { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: var(--clinic-primary-soft); color: var(--clinic-primary); }
body.dental-ui .clinic-dashboard__available-slot strong, body.dental-ui .clinic-dashboard__available-slot small { display: block; }
body.dental-ui .clinic-dashboard__available-slot strong { font-size: 13px; font-weight: 650; }
body.dental-ui .clinic-dashboard__available-slot small { margin-top: 2px; color: var(--clinic-text-secondary); font-size: 12px; }

body.dental-ui .clinic-dashboard__empty { min-height: 300px; display: grid; grid-template-columns: 170px minmax(0,350px); padding: 36px 30px; place-content: center; align-items: center; gap: 34px; text-align: left; }
body.dental-ui .clinic-dashboard__empty-visual { position: relative; width: 160px; height: 160px; display: grid; place-items: center; border-radius: 50%; background: var(--clinic-primary-softer); }
body.dental-ui .clinic-dashboard__empty-visual > span { width: 82px; height: 82px; display: grid; place-items: center; border-radius: 28px; background: var(--clinic-primary-soft); color: var(--clinic-primary); transform: rotate(-6deg); }
body.dental-ui .clinic-dashboard__empty-visual > span svg { width: 38px; height: 38px; }
body.dental-ui .clinic-dashboard__empty-visual > svg { position: absolute; top: 25px; right: 22px; width: 26px; height: 26px; color: #8db7f9; }
body.dental-ui .clinic-dashboard__empty strong { color: var(--clinic-text); font-size: 20px; font-weight: 700; }
body.dental-ui .clinic-dashboard__empty p { margin: 7px 0 18px; color: var(--clinic-text-secondary); font-size: 14px; line-height: 1.5; }

body.dental-ui .clinic-dashboard__next { grid-column: 9 / span 4; grid-row: 1; min-height: 300px; padding: 28px; }
body.dental-ui .clinic-dashboard__next-content { margin-top: 22px; }
body.dental-ui .clinic-dashboard__next-patient { display: flex; align-items: center; gap: 13px; }
body.dental-ui .clinic-dashboard__next-patient > span { width: 56px; height: 56px; display: grid; flex: 0 0 auto; place-items: center; border-radius: 18px; background: var(--clinic-primary-soft); color: var(--clinic-primary-strong); font-size: 15px; font-weight: 700; }
body.dental-ui .clinic-dashboard__next-patient strong { display: block; color: var(--clinic-text); font-size: 16px; font-weight: 650; }
body.dental-ui .clinic-dashboard__next-patient p { margin: 4px 0 0; color: var(--clinic-text-secondary); font-size: 13px; }
body.dental-ui .clinic-dashboard__next-details { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 18px; }
body.dental-ui .clinic-dashboard__next-details > span { min-width: 0; display: grid; grid-template-columns: 18px minmax(0,1fr); padding: 10px; gap: 1px 7px; border-radius: 12px; background: var(--clinic-primary-softer); color: var(--clinic-text-secondary); font-size: 11px; }
body.dental-ui .clinic-dashboard__next-details svg { width: 18px; height: 18px; grid-row: 1 / span 2; color: var(--clinic-primary); }
body.dental-ui .clinic-dashboard__next-details b { overflow: hidden; color: var(--clinic-text); font-size: 13px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
body.dental-ui .clinic-dashboard__next-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; margin-top: 17px; }
body.dental-ui .clinic-dashboard__next-actions > :only-child { grid-column: 1 / -1; }
body.dental-ui .clinic-dashboard__next-actions .clinic-dashboard__button { min-width: 0; padding: 0 10px; font-size: 13px; }
body.dental-ui .clinic-dashboard__next-empty { min-height: 218px; display: flex; padding: 12px 10px 0; align-items: center; flex-direction: column; justify-content: center; text-align: center; }
body.dental-ui .clinic-dashboard__next-empty > div { position: relative; width: 92px; height: 92px; display: grid; margin-bottom: 12px; place-items: center; border-radius: 50%; background: var(--clinic-primary-softer); }
body.dental-ui .clinic-dashboard__next-empty > div > span { width: 58px; height: 58px; display: grid; place-items: center; border-radius: 20px; background: var(--clinic-primary-soft); color: var(--clinic-primary); }
body.dental-ui .clinic-dashboard__next-empty > div > span svg { width: 28px; height: 28px; }
body.dental-ui .clinic-dashboard__next-empty > div > svg { position: absolute; top: 7px; right: 4px; color: #8db7f9; }
body.dental-ui .clinic-dashboard__next-empty strong { color: var(--clinic-text); font-size: 16px; font-weight: 650; }
body.dental-ui .clinic-dashboard__next-empty p { margin: 5px 0 14px; color: var(--clinic-text-secondary); font-size: 13px; }
body.dental-ui .clinic-dashboard__next-empty .clinic-dashboard__button { min-height: 44px; }

body.dental-ui .clinic-dashboard__quick-actions { grid-column: 9 / span 4; grid-row: 2 / span 2; padding: 28px; }
body.dental-ui .clinic-dashboard__quick-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-top: 20px; }
body.dental-ui .clinic-dashboard__quick-action { min-width: 0; min-height: 112px !important; display: flex; padding: 16px !important; align-items: flex-start; flex-direction: column; justify-content: space-between; gap: 10px; border: 1px solid rgba(129,158,197,.11) !important; border-radius: 20px !important; background: linear-gradient(145deg,#f8fbff 0%,#f1f6fd 100%) !important; color: var(--clinic-text) !important; font-size: 13px !important; text-align: left; box-shadow: 0 5px 14px rgba(47,91,150,.045), inset 0 1px 0 #fff !important; -webkit-tap-highlight-color: transparent; transition: border-color 180ms ease, background 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease !important; }
body.dental-ui .clinic-dashboard__quick-action:hover { border-color: rgba(79,141,247,.2) !important; background: linear-gradient(145deg,#fff 0%,#edf4ff 100%) !important; color: var(--clinic-primary-strong) !important; box-shadow: 0 11px 24px rgba(47,91,150,.09), inset 0 1px 0 #fff !important; transform: translateY(-2px); }
body.dental-ui .clinic-dashboard__quick-action:active { transform: scale(.985); }
body.dental-ui .clinic-dashboard__quick-action > span { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: #fff; color: var(--clinic-primary); box-shadow: 0 7px 18px rgba(47,91,150,.08), inset 0 1px 0 #fff; }
body.dental-ui .clinic-dashboard__quick-action svg { width: 22px; height: 22px; }
body.dental-ui .clinic-dashboard__quick-action strong { color: inherit; font-size: 13px; font-weight: 650; line-height: 1.25; }
body.dental-ui .clinic-dashboard__quick-action small { color: var(--clinic-danger); font-size: 12px; }

body.dental-ui .clinic-dashboard__progress { display: grid; grid-template-columns: 72px minmax(0,1fr); margin-top: 22px; padding: 16px; align-items: center; gap: 16px; border: 1px solid rgba(129,158,197,.1); border-radius: 20px; background: #f7faff; }
body.dental-ui .clinic-dashboard .progress-ring { width: 72px; height: 72px; transform: rotate(-90deg); }
body.dental-ui .clinic-dashboard :is(.ring-track,.ring-value) { fill: none; stroke-width: 5; }
body.dental-ui .clinic-dashboard .ring-track { stroke: #e7eef8; }
body.dental-ui .clinic-dashboard .ring-value { stroke: var(--clinic-primary); stroke-linecap: round; }
body.dental-ui .clinic-dashboard .ring-text { transform: rotate(90deg); transform-origin: 26px 26px; fill: var(--clinic-text); font-size: 11px; font-weight: 700; dominant-baseline: middle; }
body.dental-ui .clinic-dashboard__progress > div > span, body.dental-ui .clinic-dashboard__progress > div > strong { display: block; }
body.dental-ui .clinic-dashboard__progress > div > span { color: var(--clinic-primary); font-size: 12px; font-weight: 600; }
body.dental-ui .clinic-dashboard__progress > div > strong { margin-top: 3px; color: var(--clinic-text); font-size: 13px; font-weight: 650; }
body.dental-ui .clinic-dashboard .daily-progress { height: 7px; margin-top: 10px; overflow: hidden; border-radius: 999px; background: #e7eef8; }
body.dental-ui .clinic-dashboard .daily-progress-indicator { width: 100%; height: 100%; border-radius: inherit; background: var(--clinic-primary); }
body.dental-ui .clinic-dashboard .progress-breakdown { display: flex; margin-top: 8px; flex-wrap: wrap; gap: 5px 9px; }
body.dental-ui .clinic-dashboard .progress-breakdown span { display: inline-flex; align-items: center; gap: 5px; color: var(--clinic-text-secondary); font-size: 11px; }
body.dental-ui .clinic-dashboard .progress-breakdown i { width: 6px; height: 6px; border-radius: 50%; background: #94a3b8; }
body.dental-ui .clinic-dashboard .progress-breakdown i.success { background: var(--clinic-success); }
body.dental-ui .clinic-dashboard .progress-breakdown i.warning { background: var(--clinic-warning); }
body.dental-ui .clinic-dashboard .progress-breakdown i.danger { background: var(--clinic-danger); }

body.dental-ui .clinic-dashboard__operations { display: grid; margin-top: 18px; padding-top: 16px; gap: 8px; border-top: 1px solid rgba(129,158,197,.13); }
body.dental-ui :is(.clinic-dashboard__operation-link,.clinic-dashboard__rooms-status) { min-height: 42px; display: grid; grid-template-columns: 30px minmax(0,1fr); padding: 6px 8px; align-items: center; gap: 9px; border-radius: 11px; color: var(--clinic-text-secondary); }
body.dental-ui .clinic-dashboard__operation-link:hover { background: var(--clinic-primary-softer); }
body.dental-ui :is(.clinic-dashboard__operation-link,.clinic-dashboard__rooms-status) > svg { width: 30px; height: 30px; padding: 6px; border-radius: 9px; background: var(--clinic-primary-soft); color: var(--clinic-primary); }
body.dental-ui :is(.clinic-dashboard__operation-link,.clinic-dashboard__rooms-status) span { font-size: 12px; }
body.dental-ui :is(.clinic-dashboard__operation-link,.clinic-dashboard__rooms-status) b { margin-right: 5px; color: var(--clinic-text); font-size: 13px; }

body.dental-ui .clinic-dashboard__skeleton { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 20px; }
body.dental-ui .clinic-dashboard__skeleton > div { border-radius: 24px; background: linear-gradient(90deg,#e7eef8 25%,#f6f9fd 45%,#e7eef8 65%); background-size: 220% 100%; animation: clinic-dashboard-shimmer 1.2s linear infinite; }
body.dental-ui .clinic-dashboard__skeleton-hero { min-height: 282px; grid-column: span 8; }
body.dental-ui .clinic-dashboard__skeleton-side { min-height: 282px; grid-column: span 4; }
body.dental-ui .clinic-dashboard__skeleton-summary { min-height: 210px; grid-column: span 8; }
body.dental-ui .clinic-dashboard__skeleton-agenda { min-height: 430px; grid-column: span 8; }
body.dental-ui .clinic-dashboard .rise { animation: clinic-dashboard-in 180ms ease-out both; }
body.dental-ui .clinic-dashboard .spinning { animation: clinic-dashboard-spin 800ms linear infinite; }
@keyframes clinic-dashboard-in { from { opacity: 0; transform: translateY(2px); } to { opacity: 1; transform: none; } }
@keyframes clinic-dashboard-spin { to { transform: rotate(360deg); } }
@keyframes clinic-dashboard-shimmer { from { background-position: 100% 0; } to { background-position: -100% 0; } }
body.dental-ui .clinic-dashboard :is(button,a,input):focus-visible { outline: 2px solid var(--clinic-primary) !important; outline-offset: 2px; box-shadow: var(--clinic-focus) !important; }

/* Portales de Reka UI */
body.dental-ui .dashboard-tooltip { z-index: 2147483000; max-width: 240px; padding: 8px 10px; border-radius: 9px; background: #17233a; color: #fff; font-size: 12px; font-weight: 550; box-shadow: 0 10px 26px rgba(15,23,42,.16); }
body.dental-ui .dashboard-tooltip-arrow { fill: #17233a; }
body.dental-ui :is(.appointment-card,.appointment-menu,.dashboard-command) { border: 1px solid var(--clinic-border); background: #fff; font-family: "Space Grotesk Variable","Space Grotesk",sans-serif; box-shadow: 0 20px 50px rgba(35,69,116,.16); }
body.dental-ui .appointment-card { z-index: 2147483000; width: min(300px,calc(100vw - 24px)); padding: 16px; border-radius: 18px; }
body.dental-ui .appointment-card-head { display: flex; align-items: center; gap: 11px; }
body.dental-ui :is(.appointment-card-avatar,.command-avatar) { display: grid; place-items: center; border-radius: 14px; background: var(--clinic-primary-soft); color: var(--clinic-primary-strong); font-weight: 700; }
body.dental-ui .appointment-card-avatar { width: 44px; height: 44px; }
body.dental-ui .appointment-card-head strong, body.dental-ui .appointment-card-head small { display: block; }
body.dental-ui .appointment-card-head strong { color: var(--clinic-text); font-size: 14px; }
body.dental-ui .appointment-card-head small { margin-top: 3px; color: var(--clinic-text-secondary); font-size: 12px; }
body.dental-ui .appointment-card-rows { display: grid; gap: 8px; margin: 13px 0; padding: 12px; border-radius: 12px; background: var(--clinic-primary-softer); }
body.dental-ui .appointment-card-rows span { display: flex; align-items: center; gap: 7px; color: #536176; font-size: 12px; }
body.dental-ui .appointment-card-rows svg { width: 15px; height: 15px; color: var(--clinic-primary); }
body.dental-ui .appointment-card-arrow { fill: #fff; }
body.dental-ui .appointment-menu { z-index: 2147483001; min-width: 238px; max-width: calc(100vw - 20px); padding: 7px; border-radius: 14px; }
body.dental-ui .appointment-menu-label { padding: 7px 9px; color: var(--clinic-text-secondary); font-size: 12px; font-weight: 600; }
body.dental-ui .appointment-menu-separator { height: 1px; margin: 4px; background: #edf2f8; }
body.dental-ui .appointment-menu-item { min-height: 42px; display: flex; padding: 0 10px; align-items: center; gap: 9px; border-radius: 10px; color: #374358; font-size: 13px; outline: none; }
body.dental-ui .appointment-menu-item[data-highlighted] { background: var(--clinic-primary-soft); color: var(--clinic-primary-strong); }
body.dental-ui .appointment-menu-item.danger { color: #ad3439; }
body.dental-ui .appointment-menu-item.danger[data-highlighted] { background: #fff0f1; }
body.dental-ui .dashboard-dialog-overlay { position: fixed; inset: 0; z-index: 2147483002; background: rgba(18,24,38,.46); backdrop-filter: blur(3px); }
body.dental-ui .dashboard-command { position: fixed; top: 12vh; left: 50%; z-index: 2147483003; width: min(640px,calc(100vw - 32px)); max-height: min(680px,78vh); display: flex; overflow: hidden; transform: translateX(-50%); border-radius: 20px; flex-direction: column; outline: none; }
body.dental-ui .command-head { min-height: 68px; display: grid; grid-template-columns: 24px minmax(0,1fr) auto; padding: 0 20px; align-items: center; gap: 10px; border-bottom: 1px solid var(--clinic-border); }
body.dental-ui .command-head input { height: 66px; padding: 0 !important; border: 0 !important; background: transparent !important; color: var(--clinic-text) !important; font-size: 14px !important; box-shadow: none !important; }
body.dental-ui .command-head kbd, body.dental-ui .command-footer kbd { padding: 3px 6px; border: 1px solid #d7e1ee; border-radius: 5px; background: #f4f7fb; color: #748095; font: inherit; font-size: 10px; }
body.dental-ui .command-body { min-height: 220px; overflow-y: auto; padding: 10px; }
body.dental-ui .command-group-label { display: block; padding: 8px 10px; color: var(--clinic-text-secondary); font-size: 12px; font-weight: 600; }
body.dental-ui .command-result { min-height: 64px; display: grid; grid-template-columns: 42px minmax(0,1fr) 18px; padding: 9px 10px; align-items: center; gap: 12px; border-radius: 13px; color: var(--clinic-text); }
body.dental-ui .command-result:hover { background: var(--clinic-primary-softer); }
body.dental-ui .command-avatar { width: 42px; height: 42px; }
body.dental-ui .command-result-copy strong, body.dental-ui .command-result-copy small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.dental-ui .command-result-copy strong { color: var(--clinic-text); font-size: 14px; }
body.dental-ui .command-result-copy small { margin-top: 3px; color: var(--clinic-text-secondary); font-size: 12px; }
body.dental-ui .command-state { min-height: 210px; display: flex; padding: 24px; align-items: center; justify-content: center; gap: 10px; flex-direction: column; color: var(--clinic-text-secondary); font-size: 13px; text-align: center; }
body.dental-ui .command-state svg { width: 26px; height: 26px; color: var(--clinic-primary); }
body.dental-ui .command-footer { min-height: 48px; display: flex; padding: 0 14px; align-items: center; gap: 16px; border-top: 1px solid var(--clinic-border); background: #f8faff; color: var(--clinic-text-secondary); font-size: 11px; }
body.dental-ui .command-footer span { display: inline-flex; align-items: center; gap: 4px; }
body.dental-ui .command-footer a { margin-left: auto; color: var(--clinic-primary-strong); font-weight: 650; }
body.dental-ui .command-close { position: absolute; top: -46px; right: 0; width: 40px; height: 40px; display: grid; padding: 0; place-items: center; border: 1px solid rgba(255,255,255,.35); border-radius: 12px; background: rgba(255,255,255,.12); color: #fff; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

@media (max-width: 1180px) {
    body.dental-ui .clinic-dashboard { padding-right: 20px !important; padding-left: 20px !important; }
    body.dental-ui .clinic-dashboard__actions { display: grid; grid-template-columns: minmax(190px,1fr) auto auto; }
    body.dental-ui .clinic-dashboard__clock { display: none; }
    body.dental-ui .clinic-dashboard__search { width: 100%; }
    body.dental-ui .clinic-dashboard__hero { grid-template-columns: minmax(0,1fr) 220px; }
    body.dental-ui .clinic-dashboard__visual-badge { display: none; }
    body.dental-ui .clinic-dashboard__metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 0; }
    body.dental-ui .clinic-dashboard__metric:nth-child(2) { border-right: 0; }
    body.dental-ui .clinic-dashboard__summary-meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 900px) {
    body.dental-ui .clinic-dashboard__header { align-items: flex-start; flex-direction: column; gap: 18px; }
    body.dental-ui .clinic-dashboard__actions { width: 100%; grid-template-columns: minmax(0,1fr) auto auto; }
    body.dental-ui .clinic-dashboard__specialty-mark { right: 20px; }
    body.dental-ui :is(.clinic-dashboard__hero,.clinic-dashboard__summary,.clinic-dashboard__schedule,.clinic-dashboard__next,.clinic-dashboard__quick-actions) { grid-column: 1 / -1; }
    body.dental-ui .clinic-dashboard__hero { grid-row: 1; }
    body.dental-ui .clinic-dashboard__summary { grid-row: 2; }
    body.dental-ui .clinic-dashboard__next { grid-row: 3; }
    body.dental-ui .clinic-dashboard__schedule { grid-row: 4; }
    body.dental-ui .clinic-dashboard__quick-actions { grid-row: 5; }
    body.dental-ui .clinic-dashboard__quick-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
    body.dental-ui .clinic-dashboard__operations { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.dental-ui .clinic-dashboard__skeleton > div { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
    body.dental-ui .clinic-dashboard { padding: calc(var(--dental-header) + 16px) 16px 100px !important; }
    body.dental-ui .clinic-dashboard__header { min-height: 0; margin-bottom: 20px; padding: 2px 0 0; }
    body.dental-ui .clinic-dashboard__heading h1 { font-size: 25px !important; }
    body.dental-ui .clinic-dashboard__heading p { font-size: 14px; }
    body.dental-ui .clinic-dashboard__actions { display: grid; grid-template-columns: 50px minmax(0,1fr); gap: 10px; }
    body.dental-ui .clinic-dashboard__search { grid-column: 1 / -1; grid-row: 1; width: 100%; }
    body.dental-ui .clinic-dashboard__search kbd { display: none; }
    body.dental-ui .clinic-dashboard__actions > .clinic-dashboard__button { grid-column: 2; grid-row: 2; width: 100%; }
    body.dental-ui .clinic-dashboard__refresh { grid-column: 1; grid-row: 2; }
    body.dental-ui .clinic-dashboard__specialty-mark { display: none; }
    body.dental-ui .clinic-dashboard__alert { grid-template-columns: 42px minmax(0,1fr); }
    body.dental-ui .clinic-dashboard__alert > :last-child { grid-column: 2; justify-self: start; }
    body.dental-ui .clinic-dashboard__layout { gap: 18px; }
    body.dental-ui .clinic-dashboard__hero { min-height: 0; display: block; border-radius: 26px; }
    body.dental-ui .clinic-dashboard__hero-content { padding: 28px 22px; }
    body.dental-ui .clinic-dashboard__hero h2 { font-size: 24px; }
    body.dental-ui .clinic-dashboard__hero-facts { display: grid; gap: 14px; margin-top: 21px; }
    body.dental-ui .clinic-dashboard__hero-actions { display: grid; grid-template-columns: 1fr; }
    body.dental-ui .clinic-dashboard__hero-actions .clinic-dashboard__button { width: 100%; }
    body.dental-ui .clinic-dashboard__hero-visual { position: absolute; inset: auto -28px -25px auto; width: 170px; height: 170px; opacity: .18; pointer-events: none; }
    body.dental-ui .clinic-dashboard__visual-specialty { top: 15px; right: 20px; transform: scale(.78); }
    body.dental-ui :is(.clinic-dashboard__summary,.clinic-dashboard__schedule,.clinic-dashboard__next,.clinic-dashboard__quick-actions) { border-radius: 24px; }
    body.dental-ui .clinic-dashboard__summary { padding: 23px 18px 18px; }
    body.dental-ui .clinic-dashboard__section-heading h2, body.dental-ui .clinic-dashboard__schedule-header h2 { font-size: 18px; }
    body.dental-ui .clinic-dashboard__metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; margin-top: 18px; }
    body.dental-ui .clinic-dashboard__metric { min-height: 88px; padding: 12px 8px; border-right: 0; border-bottom: 1px solid #edf2f8; }
    body.dental-ui .clinic-dashboard__metric:nth-child(odd) { border-right: 1px solid #edf2f8; }
    body.dental-ui .clinic-dashboard__metric:nth-child(3), body.dental-ui .clinic-dashboard__metric:nth-child(4) { border-bottom: 0; }
    body.dental-ui .clinic-dashboard__metric { grid-template-columns: 42px 88px; padding: 12px 6px; column-gap: 10px; }
    body.dental-ui .clinic-dashboard__metric-icon { width: 42px; height: 42px; border-radius: 13px; }
    body.dental-ui .clinic-dashboard__metric > div { width: 88px; height: 46px; grid-template-rows: 29px 17px; }
    body.dental-ui .clinic-dashboard__metric strong { font-size: 27px; }
    body.dental-ui .clinic-dashboard__metric div > span { height: 17px; font-size: 12px; line-height: 15px; }
    body.dental-ui .clinic-dashboard__summary-meta { display: flex; }
    body.dental-ui .clinic-dashboard__summary-meta > * { width: auto; flex: 0 0 auto; padding: 0 12px; font-size: 12px; }
    body.dental-ui .clinic-dashboard__next { min-height: 0; padding: 23px 18px; }
    body.dental-ui .clinic-dashboard__next-details, body.dental-ui .clinic-dashboard__next-actions { grid-template-columns: 1fr; }
    body.dental-ui .clinic-dashboard__schedule-header { padding: 23px 18px 18px; align-items: stretch; flex-direction: column; }
    body.dental-ui .clinic-dashboard .agenda-controls { width: 100%; display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: center; }
    body.dental-ui .clinic-dashboard .agenda-tabs { width: 100%; }
    body.dental-ui .clinic-dashboard .agenda-tab { flex: 1; min-height: 42px; padding: 0 12px; }
    body.dental-ui .clinic-dashboard__text-link { padding: 0 10px; justify-content: center; }
    body.dental-ui .clinic-dashboard .appointment-list { padding: 6px; }
    body.dental-ui .clinic-dashboard__appointment { min-height: 118px; grid-template-columns: minmax(0,1fr) 44px; }
    body.dental-ui .clinic-dashboard__appointment-main { min-height: 118px; grid-template-columns: 52px minmax(0,1fr); gap: 9px; padding: 10px 2px 10px 8px; }
    body.dental-ui .clinic-dashboard__appointment-time { grid-row: 1; }
    body.dental-ui .clinic-dashboard__appointment-avatar { grid-column: 1; grid-row: 2; width: 44px; height: 44px; }
    body.dental-ui .clinic-dashboard__appointment-person { grid-column: 2; grid-row: 1 / span 2; }
    body.dental-ui .clinic-dashboard__appointment-main > .status-badge { display: none !important; }
    body.dental-ui .clinic-dashboard__appointment-person > strong, body.dental-ui .clinic-dashboard__appointment-person > span { white-space: normal; }
    body.dental-ui .clinic-dashboard__empty { min-height: 330px; display: flex; padding: 26px 20px; align-items: center; flex-direction: column; gap: 15px; text-align: center; }
    body.dental-ui .clinic-dashboard__empty-visual { width: 126px; height: 126px; }
    body.dental-ui .clinic-dashboard__empty .clinic-dashboard__button { width: 100%; }
    body.dental-ui .clinic-dashboard__quick-actions { padding: 23px 18px; }
    body.dental-ui .clinic-dashboard__quick-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    body.dental-ui .clinic-dashboard__quick-action { min-height: 112px !important; padding: 15px !important; }
    body.dental-ui .clinic-dashboard__operations { grid-template-columns: 1fr; }
    body.dental-ui .dashboard-command { top: 12px; width: calc(100vw - 24px); max-height: calc(100dvh - 24px); border-radius: 18px; }
    body.dental-ui .command-head { min-height: 64px; padding: 0 12px; }
    body.dental-ui .command-head input { height: 62px; font-size: 13px !important; }
    body.dental-ui .command-head > kbd, body.dental-ui .command-footer span { display: none; }
    body.dental-ui .command-close { top: auto; right: 8px; bottom: 6px; width: 42px; height: 42px; border-color: var(--clinic-border); background: #fff; color: var(--clinic-text-secondary); }
    body.dental-ui .command-footer { min-height: 56px; padding-right: 58px; }
}

@media (prefers-reduced-motion: reduce) {
    body.dental-ui .clinic-dashboard *, body.dental-ui .clinic-dashboard *::before, body.dental-ui .clinic-dashboard *::after,
    body.dental-ui .appointment-card, body.dental-ui .appointment-menu, body.dental-ui .dashboard-command, body.dental-ui .dashboard-dialog-overlay {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}