/* KYRA CRM · Componentes base v1.0 · requiere kyra-tokens.css */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--ky-bg);color:var(--ky-text);font:var(--ky-fw-regular) var(--ky-fs-base)/var(--ky-lh-normal) var(--ky-font-ui);-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:var(--ky-font-display);font-weight:var(--ky-fw-black);line-height:var(--ky-lh-tight);margin:0;color:var(--ky-text)}
h1{font-size:var(--ky-fs-2xl)}h2{font-size:var(--ky-fs-xl)}h3{font-size:var(--ky-fs-lg);font-weight:var(--ky-fw-heavy)}h4{font-size:var(--ky-fs-md);font-weight:var(--ky-fw-heavy)}
a{color:var(--ky-link)}
.ky-num{font-family:var(--ky-font-mono);font-variant-numeric:tabular-nums}
.ky-label{font:var(--ky-fw-semibold) var(--ky-fs-xs)/1 var(--ky-font-ui);text-transform:uppercase;letter-spacing:var(--ky-ls-label);color:var(--ky-text-muted)}
:focus-visible{outline:none;box-shadow:var(--ky-focus)}

/* Iconos */
.ky-icon{width:var(--ky-icon-size);height:var(--ky-icon-size);flex:none;fill:none;stroke:var(--ky-icon-color);stroke-width:var(--ky-icon-stroke);stroke-linecap:round;stroke-linejoin:round}
.ky-icon.xs{--ky-icon-size:var(--ky-icon-xs);--ky-icon-stroke:2.25}.ky-icon.sm{--ky-icon-size:var(--ky-icon-sm);--ky-icon-stroke:2.25}
.ky-icon.lg{--ky-icon-size:var(--ky-icon-lg)}.ky-icon.xl{--ky-icon-size:var(--ky-icon-xl);--ky-icon-stroke:1.75}
.ky-icon.muted{--ky-icon-color:var(--ky-icon-color-muted)}.ky-icon.active{--ky-icon-color:var(--ky-icon-color-active)}
.ky-icon-box{display:inline-grid;place-items:center;width:var(--ky-icon-bg-size);height:var(--ky-icon-bg-size);border-radius:var(--ky-icon-bg-radius);background:var(--ky-icon-bg);color:var(--ky-text)}
.ky-icon-box.primary{background:var(--ky-primary);color:var(--ky-on-primary)}

/* Botones */
.ky-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--ky-sp-2);height:36px;padding:0 var(--ky-sp-4);border:1px solid transparent;border-radius:var(--ky-r-md);font:var(--ky-fw-bold) var(--ky-fs-base)/1 var(--ky-font-ui);cursor:pointer;text-decoration:none;transition:background var(--ky-t-fast) var(--ky-ease),border-color var(--ky-t-fast) var(--ky-ease)}
.ky-btn.primary{background:var(--ky-primary);color:var(--ky-on-primary)}.ky-btn.primary:hover{background:var(--ky-primary-hover)}.ky-btn.primary:active{background:var(--ky-primary-press)}
.ky-btn.secondary{background:var(--ky-surface);color:var(--ky-text);border-color:var(--ky-border-strong)}.ky-btn.secondary:hover{border-color:var(--ky-primary)}
.ky-btn.ghost{background:transparent;color:var(--ky-text)}.ky-btn.ghost:hover{background:var(--ky-surface-2)}
.ky-btn.danger{background:var(--ky-danger);color:#fff}
.ky-btn.sm{height:30px;padding:0 var(--ky-sp-3);font-size:var(--ky-fs-sm)}.ky-btn.lg{height:44px;padding:0 var(--ky-sp-6);font-size:var(--ky-fs-md)}
.ky-btn[disabled]{opacity:.45;cursor:not-allowed}
.ky-btn-icon{width:36px;padding:0}

/* Formularios */
.ky-field{display:grid;gap:6px}.ky-field>label{font-size:var(--ky-fs-sm);font-weight:var(--ky-fw-semibold)}
.ky-input,.ky-select,.ky-textarea{width:100%;height:38px;padding:0 var(--ky-sp-3);background:var(--ky-surface);color:var(--ky-text);border:1px solid var(--ky-border-strong);border-radius:var(--ky-r-md);font:inherit}
.ky-textarea{height:auto;padding:var(--ky-sp-3)}
.ky-input::placeholder{color:var(--ky-text-faint)}
.ky-input:focus,.ky-select:focus,.ky-textarea:focus{outline:none;border-color:var(--ky-primary);box-shadow:var(--ky-focus)}
.ky-input.error{border-color:var(--ky-danger)}.ky-help{font-size:var(--ky-fs-xs);color:var(--ky-text-muted)}.ky-help.error{color:var(--ky-danger-text)}

/* Tarjetas, KPI, badges */
.ky-card{background:var(--ky-surface);border:1px solid var(--ky-border);border-radius:var(--ky-r-lg);padding:var(--ky-sp-5);box-shadow:var(--ky-shadow-sm)}
.ky-kpi{display:grid;gap:4px}.ky-kpi b{font:var(--ky-fw-bold) var(--ky-fs-2xl)/1 var(--ky-font-mono);font-variant-numeric:tabular-nums}
.ky-badge{display:inline-flex;align-items:center;gap:4px;height:22px;padding:0 var(--ky-sp-2);border-radius:var(--ky-r-pill);font:var(--ky-fw-semibold) var(--ky-fs-xs)/1 var(--ky-font-ui);background:var(--ky-surface-2);color:var(--ky-text-muted)}
.ky-badge.success{background:var(--ky-success-bg);color:var(--ky-success-text)}.ky-badge.warning{background:var(--ky-warning-bg);color:var(--ky-warning-text)}
.ky-badge.danger{background:var(--ky-danger-bg);color:var(--ky-danger-text)}.ky-badge.info{background:var(--ky-info-bg);color:var(--ky-info-text)}
.ky-badge.brand{background:var(--ky-primary-soft);color:var(--ky-accent-text)}
.ky-avatar{flex:none;width:32px;height:32px;border-radius:50%;display:inline-grid;place-items:center;background:var(--ky-marine-3);color:#fff;font:var(--ky-fw-bold) var(--ky-fs-xs)/1 var(--ky-font-ui)}
.ky-progress{height:8px;border-radius:var(--ky-r-pill);background:var(--ky-surface-2);overflow:hidden}.ky-progress>i{display:block;height:100%;background:var(--ky-primary);border-radius:inherit}

/* Tablas */
.ky-table{width:100%;border-collapse:collapse;background:var(--ky-surface)}
.ky-table th{font:var(--ky-fw-semibold) var(--ky-fs-xs)/1 var(--ky-font-ui);text-transform:uppercase;letter-spacing:var(--ky-ls-label);color:var(--ky-text-muted);text-align:left;padding:var(--ky-sp-3) var(--ky-sp-4);background:var(--ky-surface-2);border-bottom:1px solid var(--ky-border)}
.ky-table td{padding:0 var(--ky-sp-4);height:var(--ky-row-h);border-bottom:1px solid var(--ky-border);font-size:var(--ky-fs-base)}
.ky-table th,.ky-table td{white-space:nowrap}
.ky-table.compact th,.ky-table.compact td{padding-inline:var(--ky-sp-3)}
.ky-table tr:hover td{background:var(--ky-primary-soft)}
.ky-table td.num{font-family:var(--ky-font-mono);text-align:right;font-variant-numeric:tabular-nums}

/* Pestañas */
.ky-tabs{display:flex;gap:var(--ky-sp-1);border-bottom:1px solid var(--ky-border)}
.ky-tab{padding:var(--ky-sp-3) var(--ky-sp-4);font-weight:var(--ky-fw-semibold);color:var(--ky-text-muted);border-bottom:2px solid transparent;margin-bottom:-1px;cursor:pointer}
.ky-tab.on{color:var(--ky-text);border-bottom-color:var(--ky-primary)}

/* Estructura de la aplicación */
.ky-app{display:grid;grid-template-columns:var(--ky-sidebar-w) 1fr;min-height:100vh}
.ky-app.collapsed{grid-template-columns:var(--ky-sidebar-w-collapsed) 1fr}
.ky-sidebar{background:var(--ky-sidebar-bg);color:var(--ky-sidebar-text);padding:var(--ky-sp-4) var(--ky-sp-3);display:flex;flex-direction:column;gap:var(--ky-sp-4)}
.ky-sidebar .ky-logo{height:30px;width:auto;margin:var(--ky-sp-1) var(--ky-sp-2) var(--ky-sp-3)}
.ky-nav{display:grid;gap:2px}
.ky-nav a{display:flex;align-items:center;gap:var(--ky-sp-3);height:40px;padding:0 var(--ky-sp-3);border-radius:var(--ky-r-md);color:var(--ky-sidebar-text);text-decoration:none;font-weight:var(--ky-fw-medium)}
.ky-nav a .ky-icon{--ky-icon-color:var(--ky-icon-color-on-dark)}
.ky-nav a:hover{background:rgba(255,255,255,.06);color:#fff}
.ky-nav a.on{background:var(--ky-sidebar-active-bg);color:var(--ky-sidebar-active-text)}
.ky-nav a.on .ky-icon{--ky-icon-color:var(--ky-icon-color-on-dark-active)}
.ky-topbar{height:var(--ky-topbar-h);background:var(--ky-topbar-bg);border-bottom:1px solid var(--ky-border);display:flex;align-items:center;gap:var(--ky-sp-3);padding:0 var(--ky-sp-6)}
.ky-page{padding:var(--ky-sp-6);display:grid;gap:var(--ky-sp-5);align-content:start}
.ky-modal{background:var(--ky-surface);border-radius:var(--ky-r-xl);box-shadow:var(--ky-shadow-lg);padding:var(--ky-sp-6)}
.ky-toast{background:var(--ky-ink);color:#fff;border-radius:var(--ky-r-md);padding:var(--ky-sp-3) var(--ky-sp-4);box-shadow:var(--ky-shadow-md);border-left:4px solid var(--ky-primary)}
