/* Sistema de diseño · componentes compartidos por tienda, panel del cliente y admin */

/* ── Botón ─────────────────────────────────────────────────────────────── */
.btn{--btn-h:2.25rem;display:inline-flex;align-items:center;justify-content:center;gap:.375rem;flex-shrink:0;height:var(--btn-h);padding:0 .75rem;border:1px solid transparent;border-radius:var(--radius-md);background:var(--primary);background-clip:padding-box;color:var(--primary-foreground);font-size:.875rem;font-weight:500;line-height:1;white-space:nowrap;text-decoration:none;user-select:none;-webkit-user-select:none;outline:none;cursor:pointer;transition:background-color .15s,color .15s,border-color .15s,box-shadow .15s,opacity .15s,transform .1s var(--ease)}
.btn:hover{background-color:color-mix(in oklab,var(--primary) 82%,transparent)}
.btn:active:not([aria-haspopup]){transform:scale(.98)}
.btn:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.btn:disabled,.btn[aria-disabled=true],.btn.is-loading{pointer-events:none;opacity:.5}
.btn.is-loading{opacity:.75}
.btn svg{flex-shrink:0;pointer-events:none;width:1rem;height:1rem}
.btn .arrow{transition:transform .2s var(--ease-out)}
.btn:hover .arrow{transform:translateX(2px)}
.btn-primary{background:var(--primary);color:var(--primary-foreground)}
.btn-outline{background:var(--background);color:var(--foreground);border-color:var(--border);box-shadow:var(--shadow-xs)}
.btn-outline:hover,.btn-outline[aria-expanded=true]{background:var(--muted);color:var(--foreground)}
.dark .btn-outline{background:var(--input-30);border-color:var(--input)}
.dark .btn-outline:hover,.dark .btn-outline[aria-expanded=true]{background:var(--input-50)}
.btn-secondary{background:var(--secondary);color:var(--secondary-foreground)}
.btn-secondary:hover,.btn-secondary[aria-expanded=true]{background:color-mix(in oklch,var(--secondary),var(--foreground) 6%)}
.btn-ghost{background:transparent;color:var(--foreground)}
.btn-ghost:hover,.btn-ghost[aria-expanded=true]{background:var(--muted);color:var(--foreground)}
.dark .btn-ghost:hover,.dark .btn-ghost[aria-expanded=true]{background:var(--muted-50)}
.btn-destructive{background:var(--destructive-10);color:var(--destructive)}
.btn-destructive:hover{background:var(--destructive-20)}
.btn-destructive:focus-visible{border-color:color-mix(in oklab,var(--destructive) 40%,transparent);box-shadow:0 0 0 3px var(--destructive-20)}
.dark .btn-destructive{background:var(--destructive-20)}
.btn-success{background:var(--success-10);color:var(--success)}
.btn-success:hover{background:color-mix(in oklab,var(--success) 18%,transparent)}
.btn-soft{background:var(--primary-10);color:var(--foreground)}
.btn-soft:hover{background:var(--primary-20)}
.btn-link{background:transparent;color:var(--foreground);height:auto;padding:0;text-decoration:underline;text-underline-offset:4px;text-decoration-color:color-mix(in oklab,var(--foreground) 35%,transparent)}
.btn-link:hover{background:transparent;text-decoration-color:currentColor}
.btn-xs{--btn-h:1.5rem;gap:.25rem;padding:0 .5rem;font-size:.75rem}
.btn-xs svg{width:.75rem;height:.75rem}
.btn-sm{--btn-h:2rem;gap:.25rem;padding:0 .625rem}
.btn-lg{--btn-h:2.75rem;padding:0 1.25rem;border-radius:var(--radius-lg);font-size:.9375rem}
.btn-xl{--btn-h:3rem;padding:0 1.5rem;border-radius:var(--radius-lg);font-size:1rem}
.btn-icon{padding:0;width:var(--btn-h)}
.btn-block{width:100%}
.btn-group{display:inline-flex}
.btn-group>.btn:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}
.btn-group>.btn:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.btn .spinner{display:none}
.btn.is-loading .spinner{display:block}
.btn.is-loading .btn-icon-default{display:none}

/* ── Badge ─────────────────────────────────────────────────────────────── */
.badge{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;flex-shrink:0;width:fit-content;height:1.375rem;padding:0 .5rem;overflow:hidden;border:1px solid transparent;border-radius:.375rem;background:var(--secondary);color:var(--secondary-foreground);font-size:.75rem;font-weight:500;line-height:1;white-space:nowrap}
.badge svg{width:.75rem;height:.75rem;pointer-events:none}
.badge-primary{background:var(--primary);color:var(--primary-foreground)}
.badge-outline{background:transparent;border-color:var(--border);color:var(--foreground)}
.badge-muted{background:var(--muted);color:var(--muted-foreground)}
.badge-success{background:var(--success-10);color:var(--success)}
.badge-warning{background:var(--warning-10);color:var(--warning)}
.badge-danger{background:var(--destructive-10);color:var(--destructive)}
.dark .badge-danger{background:var(--destructive-20)}
.badge-info{background:var(--info-10);color:var(--info)}
/* Estados: rectángulo con borde del color del estado (sin punto), con o sin icono, igual en la tienda y el admin */
.badge-status{gap:.375rem;height:1.625rem;padding:0 .5625rem;font-weight:600}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.35}}

/* ── Tarjeta ───────────────────────────────────────────────────────────── */
.card{--card-p:1.5rem;display:flex;flex-direction:column;gap:var(--card-p);min-width:0;padding-block:var(--card-p);border-radius:var(--radius-xl);background:var(--card);color:var(--card-foreground);font-size:.875rem;box-shadow:var(--shadow-ring)}
.card-sm{--card-p:1rem}
.card-flush{padding-block:0;gap:0;overflow:hidden}
.card-header{display:grid;grid-auto-rows:min-content;align-items:start;gap:.25rem;padding-inline:var(--card-p)}
.card-header:has(>.card-action){grid-template-columns:minmax(0,1fr) auto}
.card-header.border-b{padding-bottom:var(--card-p)}
.card-title{font-size:1rem;line-height:1.5;font-weight:600;letter-spacing:-.01em}
.card-sm .card-title{font-size:.875rem}
.card-description{color:var(--muted-foreground);font-size:.875rem}
.card-action{grid-column:2;grid-row:1/span 2;align-self:start;justify-self:end}
.card-body{padding-inline:var(--card-p)}
.card-footer{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding-inline:var(--card-p)}
.card-footer.border-t{padding-top:var(--card-p)}
.card-flush .card-header,.card-flush .card-footer{padding-block:var(--card-p)}
.card-interactive{transition:box-shadow .2s var(--ease),transform .2s var(--ease)}
.card-interactive:hover{transform:translateY(-2px);box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 16%,transparent),var(--shadow-md)}
.card-muted{background:var(--muted-50);box-shadow:0 0 0 1px var(--fg-10)}
.card-glass{background:var(--glass);box-shadow:var(--shadow-frame);-webkit-backdrop-filter:blur(18px) saturate(1.15);backdrop-filter:blur(18px) saturate(1.15)}

/* ── Estadística / KPI ─────────────────────────────────────────────────── */
.stat{--card-p:1.25rem;gap:.75rem}
.stat-head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-inline:var(--card-p);color:var(--muted-foreground);font-weight:500}
.stat-icon{display:flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:var(--radius-md);background:var(--primary-10);color:var(--foreground)}
.stat-icon svg{width:1rem;height:1rem}
.stat-value{padding-inline:var(--card-p);font-size:1.625rem;line-height:1.15;font-weight:600;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.stat-foot{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding-inline:var(--card-p);color:var(--muted-foreground);font-size:.8125rem}
.delta{display:inline-flex;align-items:center;gap:.125rem;height:1.25rem;padding:0 .375rem;border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;font-variant-numeric:tabular-nums}
.delta svg{width:.75rem;height:.75rem}
.delta-up{background:var(--success-10);color:var(--success)}
.delta-down{background:var(--destructive-10);color:var(--destructive)}
.delta-flat{background:var(--muted);color:var(--muted-foreground)}

/* ── Tabla ─────────────────────────────────────────────────────────────── */
.table-wrap{position:relative;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table{width:100%;caption-side:bottom;border-collapse:collapse;font-size:.875rem}
.table caption{margin-top:1rem;color:var(--muted-foreground)}
.table thead tr{border-bottom:1px solid var(--border)}
.table th{height:3rem;padding:0 .5rem;text-align:left;vertical-align:middle;font-weight:500;color:var(--muted-foreground);white-space:nowrap}
.table th a{display:inline-flex;align-items:center;gap:.25rem;transition:color .15s}
.table th a:hover,.table th[aria-sort] a{color:var(--foreground)}
.table th svg{width:.875rem;height:.875rem}
.table td{height:3.5rem;padding:.5rem;vertical-align:middle;white-space:nowrap}
.table tbody tr{border-bottom:1px solid var(--border);transition:background-color .15s}
.table tbody tr:last-child{border-bottom:0}
.table tbody tr:hover{background:var(--muted-50)}
.table tbody tr[aria-selected=true]{background:var(--muted)}
.table tfoot{border-top:1px solid var(--border);background:var(--muted-50);font-weight:500}
.row-link{cursor:pointer}
.table .cell-chevron{width:2.5rem;padding-left:0;color:var(--muted-foreground);text-align:right}
.table .cell-chevron svg{width:1rem;height:1rem;vertical-align:middle;transition:transform .15s,color .15s}
.table tr.is-clickable:hover .cell-chevron svg,.table tr.row-link:hover .cell-chevron svg{color:var(--foreground);transform:translateX(2px)}
@media (max-width:767.98px){.table-stack .cell-chevron{display:none}}
.table th:first-child,.table td:first-child{padding-left:1rem}
.table th:last-child,.table td:last-child{padding-right:1rem}
@media (min-width:640px){.table th:first-child,.table td:first-child{padding-left:1.5rem}.table th:last-child,.table td:last-child{padding-right:1.5rem}}
.table .num,.table .text-right{text-align:right}
.table .cell-wrap{white-space:normal;min-width:12rem}
.table .cell-check{width:1%}
.table .actions{width:1%;text-align:right}
.table .actions>div{display:inline-flex;align-items:center;gap:.25rem}
.table-empty td{height:8rem;text-align:center;color:var(--muted-foreground);white-space:normal}
.table-compact td{height:2.75rem}
.cell-user{display:flex;align-items:center;gap:.625rem;min-width:0}
.cell-user>div{display:flex;flex-direction:column;min-width:0}
.cell-user .name{font-weight:500;color:var(--card-foreground)}
.cell-user .sub{color:var(--muted-foreground);font-size:.8125rem}
@media (max-width:639.98px){
  .table-stack thead{display:none}
  .table-stack,.table-stack tbody,.table-stack tr,.table-stack td{display:block;width:100%}
  .table-stack tr{padding:.75rem 1rem}
  .table-stack td{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:auto;padding:.3125rem 0!important;white-space:normal;text-align:right}
  .table-stack td::before{content:attr(data-label);flex-shrink:0;color:var(--muted-foreground);font-weight:500;text-align:left}
  .table-stack td:not([data-label])::before,.table-stack td[data-label=""]::before,.table-stack td.cell-primary::before{display:none}
  .table-stack td.cell-primary{justify-content:flex-start;text-align:left;padding-bottom:.5rem!important}
  .table-stack .actions{width:auto;justify-content:flex-end}
}
.table-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.5rem}
.table-toolbar .toolbar-search{flex:1 1 16rem;max-width:22rem}
.toolbar-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.table-filters{display:grid;gap:1rem;padding:1rem 1.5rem;border-bottom:1px solid var(--border)}
@media (min-width:640px){.table-filters{grid-template-columns:repeat(auto-fit,minmax(11rem,1fr))}}
@media (max-width:639.98px){.table-toolbar{flex-direction:column;align-items:stretch;padding:1rem}.table-toolbar .toolbar-search{max-width:none;flex-basis:auto}.toolbar-actions>*{flex:1 1 auto}}
.table-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:.875rem 1.5rem;border-top:1px solid var(--border)}
.table-footer-info{color:var(--muted-foreground);font-size:.875rem}
.table-footer-start{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1.25rem}
.table-footer-per{display:flex;align-items:center;gap:.5rem;color:var(--muted-foreground);font-size:.875rem}
.table-footer-per .select{width:auto;min-width:4.5rem}
.table-footer-info b{font-weight:500;color:var(--foreground)}
.bulk-bar{display:none;align-items:center;gap:.75rem;padding:.625rem 1.5rem;border-bottom:1px solid var(--border);background:var(--muted-50);font-size:.875rem}
.bulk-bar.is-visible{display:flex;animation:fade-in .15s var(--ease-out)}

/* ── Paginación ────────────────────────────────────────────────────────── */
.pagination ul{display:flex;align-items:center;gap:.25rem}
.pagination .btn{min-width:2.25rem;font-variant-numeric:tabular-nums}
.pagination [aria-current=page]{background:var(--background);border-color:var(--border);color:var(--foreground);box-shadow:var(--shadow-xs)}
.dark .pagination [aria-current=page]{background:var(--input-30);border-color:var(--input)}
.pagination-ellipsis{display:flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;color:var(--muted-foreground)}

/* ── Formularios ───────────────────────────────────────────────────────── */
.input,.select,.textarea{width:100%;min-width:0;border:1px solid var(--input);border-radius:var(--radius-md);background-color:transparent;color:var(--foreground);font-size:1rem;box-shadow:var(--shadow-xs);outline:none;transition:color .15s,border-color .15s,box-shadow .15s,background-color .15s}
.input{height:2.25rem;padding:.25rem .625rem}
.textarea{display:block;min-height:5rem;padding:.5rem .625rem;line-height:1.5}
.input:focus-visible,.select:focus-visible,.textarea:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.input[aria-invalid=true],.select[aria-invalid=true],.textarea[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px var(--destructive-20)}
.input:disabled,.select:disabled,.textarea:disabled{opacity:.5;cursor:not-allowed}
.input[readonly]{background-color:var(--muted-50)}
.dark .input,.dark .select,.dark .textarea{background-color:var(--input-30)}
/* Autocompletado: el navegador impone su fondo y no se puede sustituir, así que se recorta al texto y queda tapado por las letras.
   Vale también para los campos que estaban ocultos al rellenarse (login en dos pasos, ventanas). En oscuro se devuelve el tono del campo. */
input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill{-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:var(--foreground);caret-color:var(--foreground)}
input:autofill,textarea:autofill,select:autofill{filter:none}
.dark .input:not(.input-group>*):-webkit-autofill,.dark .textarea:-webkit-autofill{box-shadow:inset 0 0 0 100vmax var(--input-30)}
.dark .input:not(.input-group>*):-webkit-autofill:focus-visible,.dark .textarea:-webkit-autofill:focus-visible{box-shadow:0 0 0 3px var(--ring-50),inset 0 0 0 100vmax var(--input-30)}
.input-sm{height:2rem}.input-lg{height:2.75rem;border-radius:var(--radius-lg)}
.input[type=file]{padding:.1875rem .375rem;font-size:.875rem;cursor:pointer}
.input[type=file]::file-selector-button{height:1.75rem;margin-right:.5rem;padding:0 .5rem;border:0;border-radius:var(--radius-sm);background:var(--muted);color:var(--foreground);font:inherit;font-weight:500;cursor:pointer}
.input.mono,.textarea.mono{font-family:var(--font-mono);font-size:.875rem;font-variant-numeric:tabular-nums}
.select{appearance:none;-webkit-appearance:none;height:2.25rem;padding:0 2rem 0 .625rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center;background-size:1rem;cursor:pointer}
.dark .select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a1a1a1' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
.select-sm{height:2rem}.select-auto{width:auto}
.select option,.select optgroup{background:var(--popover);color:var(--popover-foreground)}
@media (min-width:768px){.input,.select,.textarea{font-size:.875rem}}

.label{display:flex;align-items:center;gap:.375rem;font-size:.875rem;font-weight:500;line-height:1.2;user-select:none}
.label .req{color:var(--destructive)}
.label .optional{color:var(--muted-foreground);font-weight:400}
.field{display:flex;flex-direction:column;gap:.5rem;min-width:0}
.field-row{display:flex;align-items:center;gap:.75rem}
.field-row>.label{font-weight:400}
.hint{color:var(--muted-foreground);font-size:.8125rem;line-height:1.5}
.hint a{text-decoration:underline;text-underline-offset:4px}
.field-error{display:flex;align-items:center;gap:.375rem;color:var(--destructive);font-size:.8125rem}
.field-error svg{width:.875rem;height:.875rem}
.field:has([aria-invalid=true]) .label{color:var(--destructive)}
.field.has-error>.hint{display:none}
.field-group{display:flex;flex-direction:column;gap:1.25rem}
.form-grid{display:grid;gap:1.25rem;grid-template-columns:minmax(0,1fr)}
@media (min-width:640px){.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid>.col-full{grid-column:1/-1}}
.form-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.5rem}
@media (max-width:639.98px){.form-actions>.btn{flex:1 1 auto}}
.field-switch{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem}
.field-switch>div{display:flex;flex-direction:column;gap:.25rem;min-width:0}
.choice-card{position:relative;display:flex;align-items:flex-start;gap:.75rem;padding:.875rem 1rem;border-radius:var(--radius-lg);background:var(--box);box-shadow:0 0 0 1px var(--border);cursor:pointer;transition:box-shadow .15s,background-color .15s}
.choice-card:hover{box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 22%,transparent)}
.choice-card:has(:checked){box-shadow:0 0 0 2px var(--primary);background:var(--glass)}
.choice-card:has(:focus-visible){outline:2px solid var(--ring);outline-offset:3px}
.choice-card>input[type=radio].sr-only+*{flex:1}
.separator-text{display:flex;align-items:center;gap:1rem;color:var(--muted-foreground);font-size:.8125rem}
.separator-text::before,.separator-text::after{content:'';flex:1;height:1px;background:var(--border)}

.switch,.checkbox,.radio{appearance:none;-webkit-appearance:none;position:relative;flex-shrink:0;margin:0;border:1px solid var(--input);outline:none;cursor:pointer;vertical-align:middle;box-shadow:var(--shadow-xs);transition:background-color .2s var(--ease),border-color .15s,box-shadow .15s}
.switch{width:2rem;height:1.15rem;border-color:transparent;border-radius:9999px;background:var(--input)}
.dark .switch{background:color-mix(in oklab,var(--input) 80%,transparent)}
.switch::before{content:'';position:absolute;top:50%;left:0;width:1rem;height:1rem;margin-top:-.5rem;border-radius:50%;background:var(--background);pointer-events:none;transition:transform .2s var(--ease-out),background-color .2s}
.dark .switch::before{background:var(--foreground)}
.switch:checked{background:var(--primary)}
.switch:checked::before{transform:translateX(calc(2rem - 2px - 1rem))}
.dark .switch:checked::before{background:var(--primary-foreground)}
.checkbox,.radio{width:1rem;height:1rem;background:transparent}
.checkbox{border-radius:4px}
.radio{border-radius:50%}
.dark .checkbox,.dark .radio{background:var(--input-30)}
.checkbox::after{content:'';position:absolute;inset:0;background:var(--primary-foreground);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.875rem no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/.875rem no-repeat;opacity:0;transform:scale(.5);transition:transform .15s var(--ease-out),opacity .1s}
.checkbox:indeterminate::after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E")}
.radio::after{content:'';position:absolute;inset:0;width:.5rem;height:.5rem;margin:auto;border-radius:50%;background:var(--primary-foreground);transform:scale(0);transition:transform .15s var(--ease-out)}
.checkbox:checked,.checkbox:indeterminate,.radio:checked{background:var(--primary);border-color:var(--primary)}
.checkbox:checked::after,.checkbox:indeterminate::after{opacity:1;transform:none}
.radio:checked::after{transform:scale(1)}
.switch:focus-visible,.checkbox:focus-visible,.radio:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.switch:disabled,.checkbox:disabled,.radio:disabled{opacity:.5;cursor:not-allowed}

/* Grupo de campo con complementos (icono, prefijo, botón) */
.input-group{position:relative;display:flex;align-items:center;width:100%;min-width:0;height:2.25rem;border:1px solid var(--input);border-radius:var(--radius-md);box-shadow:var(--shadow-xs);transition:border-color .15s,box-shadow .15s}
.dark .input-group{background:var(--input-30)}
.input-group:has(>.input:focus-visible){border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.input-group:has([aria-invalid=true]){border-color:var(--destructive);box-shadow:0 0 0 3px var(--destructive-20)}
.input-group>.input{flex:1;height:100%;border:0;border-radius:0;background:transparent;box-shadow:none}
.input-group>.input:focus-visible{box-shadow:none}
.input-group-addon{display:flex;align-items:center;justify-content:center;gap:.5rem;align-self:stretch;flex-shrink:0;padding:0 .625rem;color:var(--muted-foreground);font-size:.875rem;user-select:none}
.input-group-addon:first-child{padding-right:0}
.input-group-addon:last-child{padding-left:0;padding-right:.25rem}
.input-group-addon svg{width:1rem;height:1rem}
/* Prefijo o sufijo de texto (moneda, %, ruta): segmento propio con su margen. Los iconos siguen dentro del campo */
.input-group>.input-group-addon:not(:has(svg,button)){padding:0 .75rem;background:var(--muted-50);color:var(--muted-foreground);font-size:.8125rem;font-weight:500;white-space:nowrap}
.input-group>.input-group-addon:not(:has(svg,button)):has(~.input){border-right:1px solid var(--input);border-top-left-radius:inherit;border-bottom-left-radius:inherit}
.input-group>.input~.input-group-addon:not(:has(svg,button)){border-left:1px solid var(--input);border-top-right-radius:inherit;border-bottom-right-radius:inherit}
.input-group-btn{display:inline-flex;align-items:center;justify-content:center;gap:.25rem;height:1.75rem;min-width:1.75rem;padding:0 .375rem;border-radius:calc(var(--radius) - 4px);color:var(--muted-foreground);font-size:.75rem;font-weight:500;outline:none;cursor:pointer;transition:background-color .15s,color .15s}
.input-group-btn:hover{background:var(--muted);color:var(--foreground)}
.input-group-btn:focus-visible{box-shadow:0 0 0 3px var(--ring-50)}
.input-group-btn svg{width:1rem;height:1rem}
.input-group-lg{height:2.75rem;border-radius:var(--radius-lg)}
.password-toggle .icon-hide{display:none}
.password-toggle.is-visible .icon-show{display:none}
.password-toggle.is-visible .icon-hide{display:block}

/* OTP: un solo campo visible como casillas */
.otp-input{max-width:16rem;height:3rem;font-family:var(--font-mono);font-size:1.375rem;letter-spacing:.6em;text-align:center;padding-left:.6em}
/* Etiqueta con un enlace a la derecha (p. ej. «¿Olvidaste tu contraseña?») */
.field-label-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem}
.field-aside{color:var(--muted-foreground);font-size:.8125rem;transition:color .15s}
.field-aside:hover{color:var(--foreground);text-decoration:underline;text-underline-offset:3px}
/* Acceso: «o», botón de Google, email ya escrito (paso de la contraseña) y «¿Nuevo en la plataforma?» */
.auth-or{display:flex;align-items:center;gap:.75rem;color:var(--muted-foreground);font-size:.8125rem}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--border)}
.btn-google{gap:.625rem}
.btn-google svg{width:1.125rem;height:1.125rem;flex-shrink:0}
.auth-who{display:flex;align-items:center;gap:.625rem;min-width:0;min-height:2.75rem;padding:.375rem .375rem .375rem .875rem;border-radius:.75rem;background:var(--muted);font-size:.875rem}
.auth-who>svg{width:1rem;height:1rem;flex-shrink:0;color:var(--muted-foreground)}
.auth-who b{flex:1;min-width:0;overflow:hidden;font-weight:500;text-overflow:ellipsis;white-space:nowrap}
.auth-who .badge svg{width:.75rem;height:.75rem}
.auth-new{display:flex;flex-direction:column;align-items:center;gap:.625rem;margin-top:.25rem;color:var(--muted-foreground);font-size:.875rem}
.auth-new .btn{width:100%}
.auth-switch{color:var(--muted-foreground);font-size:.875rem;text-align:center}
.auth-switch a{color:var(--foreground);font-weight:500;text-decoration:underline;text-underline-offset:4px;text-decoration-color:color-mix(in oklab,var(--foreground) 30%,transparent)}
.auth-switch a:hover{text-decoration-color:currentColor}
/* Formulario por pasos (ui-core.js: form[data-steps]); sin JavaScript se ve entero */
.auth-step{display:flex;flex-direction:column;gap:1rem;min-width:0;margin:0;padding:0;border:0}
.auth-step[hidden]{display:none}
.auth-steps{display:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:.625rem;margin:0 0 .25rem;padding:0;list-style:none}
.is-stepped .auth-steps{display:grid}
.auth-steps li{display:flex;flex-direction:column;gap:.375rem;color:var(--muted-foreground);font-size:.75rem;font-weight:500}
.auth-steps-bar{height:.1875rem;border-radius:9999px;background:var(--border);transition:background-color .2s}
.auth-steps li.is-current,.auth-steps li.is-done{color:var(--foreground)}
.auth-steps li.is-current .auth-steps-bar{background:var(--foreground)}
.auth-steps li.is-done .auth-steps-bar{background:color-mix(in oklab,var(--foreground) 55%,transparent)}
.auth-form:not(.is-stepped) [data-step-next],.auth-form:not(.is-stepped) [data-step-prev]{display:none}
.auth-step-actions{display:flex;gap:.625rem;margin-top:.375rem}
.auth-step-actions .btn[type=submit]{flex:1}
/* Código en 6 casillas (ui-core.js): 3 + 3 con un respiro en medio */
.otp-enhanced>.otp-input{display:none}
.otp-enhanced.is-recovery>.otp-input{display:block;max-width:none;letter-spacing:.2em}
.otp-enhanced.is-recovery>.otp-boxes{display:none}
.otp-boxes{display:flex;gap:.5rem;max-width:22rem}
.otp-box{flex:1 1 0;min-width:0;max-width:3.25rem;height:3.5rem;padding:0;border:1px solid var(--input);border-radius:.75rem;background:var(--input-30);color:var(--foreground);font-family:var(--font-mono);font-size:1.5rem;font-weight:600;text-align:center;caret-color:var(--foreground);transition:border-color .15s,box-shadow .15s,background-color .15s}
.otp-box:nth-child(3){margin-right:.625rem}
.otp-box:focus{outline:0;border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.otp-box.is-filled{border-color:color-mix(in oklab,var(--foreground) 35%,transparent)}
.otp-box[aria-invalid=true]{border-color:var(--destructive);box-shadow:0 0 0 3px var(--destructive-20)}
.otp-switch{align-self:flex-start;padding:0;border:0;background:none;color:var(--muted-foreground);font-size:.8125rem;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.otp-switch:hover{color:var(--foreground)}
@media (max-width:399.98px){.otp-boxes{gap:.375rem}.otp-box{height:3rem;font-size:1.25rem}.otp-box:nth-child(3){margin-right:.375rem}}

/* ── Pestañas ──────────────────────────────────────────────────────────── */
.tabs{display:flex;flex-direction:column;gap:1rem;min-width:0}
.tabs-list{position:relative;display:inline-flex;align-items:center;width:fit-content;max-width:100%;height:2.25rem;padding:3px;overflow-x:auto;border-radius:var(--radius-lg);background:var(--muted);color:var(--muted-foreground);scrollbar-width:none}
.tabs-list::-webkit-scrollbar{display:none}
.tabs-trigger{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.375rem;flex:0 0 auto;height:100%;padding:.25rem .75rem;border:1px solid transparent;border-radius:var(--radius-md);color:color-mix(in oklab,var(--foreground) 60%,transparent);font-size:.875rem;font-weight:500;white-space:nowrap;outline:none;cursor:pointer;transition:color .15s,background-color .15s,box-shadow .15s}
.dark .tabs-trigger{color:var(--muted-foreground)}
.tabs-trigger:hover{color:var(--foreground)}
.tabs-trigger:focus-visible{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.tabs-trigger svg{width:1rem;height:1rem}
.tabs-trigger[aria-selected=true],.tabs-trigger[aria-current=page]{color:var(--foreground);background:var(--background);box-shadow:var(--shadow-sm)}
.dark .tabs-trigger[aria-selected=true],.dark .tabs-trigger[aria-current=page]{background:var(--input-30);border-color:var(--input)}
/* Contadores (pestañas, menú, avisos…): el alto no cambia nunca. Hasta dos cifras, círculo exacto (alto = ancho mínimo); con
   más, se alargan solo a los lados, así la fila no se mueve y las puntas siguen siendo medio círculo. El número va
   centrado de forma exacta: con text-box la caja de texto se recorta a la altura de las cifras (de la línea base a la
   altura de mayúscula de Geist, 0,71875 em) y el relleno de arriba es (alto − 0,71875 em) / 2. Sin text-box queda el
   centrado flex con line-height:normal (con line-height:1 el hueco negativo se redondea arriba y las sube ~0,7 px). */
.tab-count{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;box-sizing:border-box;min-width:1.25rem;height:1.25rem;padding:0 .1875rem;border-radius:9999px;background:color-mix(in oklab,var(--foreground) 8%,transparent);color:var(--muted-foreground);font-size:.6875rem;font-weight:600;line-height:normal;font-variant-numeric:tabular-nums;white-space:nowrap}
@supports (text-box:trim-both cap alphabetic){.tab-count{display:inline-block;padding-top:calc((1.25rem - .71875em) / 2);padding-bottom:0;text-align:center;vertical-align:middle;text-box:trim-both cap alphabetic}}
.tabs-trigger[aria-selected=true] .tab-count,.tabs-trigger[aria-current=page] .tab-count{background:var(--foreground);color:var(--background)}
.tabs-line{gap:.25rem;width:100%;height:auto;padding:0;border-radius:0;background:transparent;box-shadow:inset 0 -1px 0 var(--border)}
.tabs-line .tabs-trigger{height:auto;padding:.625rem .5rem;border:0;border-radius:0}
.tabs-line .tabs-trigger[aria-selected=true],.tabs-line .tabs-trigger[aria-current=page],.dark .tabs-line .tabs-trigger[aria-selected=true]{background:transparent;box-shadow:inset 0 -2px 0 var(--foreground);border:0}
.tabs-panel{min-width:0;outline:none;animation:fade-in-up .22s var(--ease-out)}

/* ── Diálogo (elemento nativo <dialog>) y panel lateral ───────────────── */
dialog.dialog{position:fixed;inset:0;width:calc(100% - 2rem);max-width:28rem;max-height:calc(100vh - 2rem);margin:auto;padding:0;overflow:visible;border:0;background:transparent;color:var(--popover-foreground)}
dialog.dialog::backdrop{background:var(--overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);animation:fade-in .15s var(--ease-out)}
dialog.dialog[open]{animation:dialog-in .2s var(--ease-out)}
.dialog-sm{max-width:24rem!important}.dialog-lg{max-width:36rem!important}.dialog-xl{max-width:48rem!important}
.dialog-content{position:relative;display:grid;gap:1.25rem;max-height:calc(100vh - 2rem);padding:1.5rem;overflow-y:auto;border-radius:var(--radius-xl);background:var(--popover);font-size:.875rem;box-shadow:0 0 0 1px var(--fg-10),var(--shadow-lg)}
.dialog-header{display:flex;flex-direction:column;gap:.375rem;padding-right:2rem}
.dialog-title{font-size:1.0625rem;font-weight:600;line-height:1.3;letter-spacing:-.01em}
.dialog-description{color:var(--muted-foreground)}
.dialog-body{display:flex;flex-direction:column;gap:1rem;min-width:0}
.dialog-footer{display:flex;flex-direction:column-reverse;gap:.5rem}
@media (min-width:640px){.dialog-footer{flex-direction:row;justify-content:flex-end}}
.dialog-close{position:absolute;top:.875rem;right:.875rem}
.dialog-icon{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:var(--radius-lg);background:var(--muted)}
.dialog-icon.is-danger{background:var(--destructive-10);color:var(--destructive)}
.dialog-icon svg{width:1.25rem;height:1.25rem}
dialog.sheet{position:fixed;inset:0 0 0 auto;width:min(26rem,90vw);max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;border-left:1px solid var(--border);background:var(--popover);color:var(--popover-foreground);box-shadow:var(--shadow-lg)}
dialog.sheet::backdrop{background:var(--overlay);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
dialog.sheet[open]{display:flex;flex-direction:column;animation:sheet-in-right .3s var(--ease-out)}
.sheet-header{display:flex;flex-direction:column;gap:.375rem;padding:1.25rem 3rem .5rem 1.25rem}
.sheet-title{font-size:1.0625rem;font-weight:600}
.sheet-body{display:flex;flex-direction:column;gap:1rem;flex:1;min-height:0;overflow-y:auto;padding:.5rem 1.25rem 1.25rem}
.sheet-footer{display:flex;gap:.5rem;padding:1rem 1.25rem;border-top:1px solid var(--border)}
.sheet-footer>.btn{flex:1}

/* ── Menú desplegable ──────────────────────────────────────────────────── */
.dropdown{position:relative;display:inline-flex}
.dropdown-menu{position:absolute;top:calc(100% + .375rem);right:0;z-index:65;min-width:12rem;max-height:min(24rem,calc(100vh - 6rem));padding:.25rem;overflow-y:auto;border-radius:var(--radius-lg);background:var(--popover);color:var(--popover-foreground);box-shadow:0 0 0 1px var(--fg-10),var(--shadow-md);outline:none;visibility:hidden;opacity:0;transform:translateY(-4px) scale(.98);transform-origin:top right;transition:opacity .12s var(--ease),transform .12s var(--ease),visibility 0s linear .12s}
.dropdown[data-align=start] .dropdown-menu{left:0;right:auto;transform-origin:top left}
.dropdown[data-side=top] .dropdown-menu{top:auto;bottom:calc(100% + .375rem);transform-origin:bottom right}
.dropdown.is-open .dropdown-menu{visibility:visible;opacity:1;transform:none;transition:opacity .15s var(--ease-out),transform .2s var(--ease-out),visibility 0s}
.dropdown-label{padding:.375rem .5rem;color:var(--muted-foreground);font-size:.75rem;font-weight:500}
.dropdown-item{display:flex;align-items:center;gap:.5rem;width:100%;padding:.4375rem .5rem;border-radius:var(--radius-sm);font-size:.875rem;line-height:1.25rem;text-align:left;white-space:nowrap;outline:none;cursor:pointer;transition:background-color .1s,color .1s}
.dropdown-item svg{width:1rem;height:1rem;flex-shrink:0;color:var(--muted-foreground)}
.dropdown-item:hover,.dropdown-item:focus-visible{background:var(--accent);color:var(--accent-foreground)}
.dropdown-item.is-destructive,.dropdown-item.is-destructive svg{color:var(--destructive)}
.dropdown-item.is-destructive:hover,.dropdown-item.is-destructive:focus-visible{background:var(--destructive-10)}
.dropdown-separator{height:1px;margin:.25rem -.25rem;background:var(--border)}
.dropdown-menu form{display:contents}
.dropdown-profile{display:flex;align-items:center;gap:.75rem;padding:.625rem .5rem}
.dropdown-profile>div{display:flex;flex-direction:column;min-width:0}
.dropdown-profile .name{font-weight:600}
.dropdown-profile .sub{color:var(--muted-foreground);font-size:.8125rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* Menú de usuario: más ancho y sin barra de desplazamiento en escritorio (solo se desplaza si la ventana es muy baja) */
.dropdown-menu.user-menu{width:17rem;max-height:calc(100vh - 5rem);padding:.375rem}
.user-menu .dropdown-profile{padding:.75rem .625rem}
.user-menu .dropdown-item{padding:.5rem .625rem}
.user-menu .dropdown-separator{margin-inline:-.375rem}

/* ── Tooltip (data-tooltip, lo posiciona ui-core.js) ──────────────────────── */
.tooltip{position:fixed;top:0;left:0;z-index:95;width:max-content;max-width:18rem;padding:.375rem .625rem;border-radius:var(--radius-md);background:var(--foreground);color:var(--background);font-size:.75rem;line-height:1.35;pointer-events:none;animation:tip-in .12s var(--ease-out)}

/* ── Avisos (toasts) ───────────────────────────────────────────────────── */
.toaster{position:fixed;right:1.25rem;bottom:1.25rem;z-index:100;display:flex;flex-direction:column-reverse;gap:.5rem;width:22rem;max-width:calc(100vw - 2rem);pointer-events:none}
.toast{position:relative;display:flex;align-items:flex-start;gap:.625rem;padding:.875rem 2.25rem .875rem 1rem;border-radius:var(--radius-lg);background:var(--popover);color:var(--popover-foreground);font-size:.8125rem;line-height:1.45;box-shadow:0 0 0 1px var(--fg-10),0 8px 24px -6px rgb(0 0 0 / .16);pointer-events:auto;animation:toast-in .35s var(--ease-out)}
.dark .toast{box-shadow:0 0 0 1px var(--fg-10),0 8px 24px -6px rgb(0 0 0 / .5)}
.toast.is-leaving{animation:toast-out .2s var(--ease) forwards}
.toast-icon{display:flex;flex-shrink:0;margin-top:1px}
.toast-icon svg{width:1rem;height:1rem}
.toast[data-type=success] .toast-icon{color:var(--success)}
.toast[data-type=error] .toast-icon{color:var(--destructive)}
.toast[data-type=warning] .toast-icon{color:var(--warning)}
.toast[data-type=info] .toast-icon{color:var(--muted-foreground)}
.toast-body{display:flex;flex-direction:column;gap:.125rem;flex:1;min-width:0;overflow-wrap:anywhere}
.toast-title{font-weight:500}
.toast-description{color:var(--muted-foreground)}
.toast-close{position:absolute;top:.5rem;right:.5rem;display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:var(--radius-sm);color:var(--muted-foreground);transition:background-color .15s,color .15s}
.toast-close:hover{background:var(--muted);color:var(--foreground)}
.toast-close svg{width:.875rem;height:.875rem}
@keyframes toast-in{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
@keyframes toast-out{to{opacity:0;transform:translateY(8px) scale(.98)}}
@media (max-width:600px){.toaster{left:1rem;right:1rem;bottom:calc(1rem + env(safe-area-inset-bottom));width:auto}}

/* ── Alerta ────────────────────────────────────────────────────────────── */
.alert{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:.125rem .625rem;width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--card);color:var(--card-foreground);font-size:.875rem}
.alert:has(>svg){grid-template-columns:auto minmax(0,1fr)}
.alert>svg{grid-row:span 2;width:1rem;height:1rem;transform:translateY(2px)}
.alert>svg~*{grid-column:2}
.alert-title{font-weight:500}
.alert-description{color:var(--muted-foreground)}
.alert-description a,.alert-title a{text-decoration:underline;text-underline-offset:3px}
.alert-danger{color:var(--destructive);border-color:color-mix(in oklab,var(--destructive) 25%,var(--border));background:color-mix(in oklab,var(--destructive) 4%,var(--card))}
.alert-danger .alert-description{color:color-mix(in oklab,var(--destructive) 85%,var(--foreground))}
.alert-success{border-color:color-mix(in oklab,var(--success) 30%,var(--border));background:color-mix(in oklab,var(--success) 4%,var(--card))}
.alert-success>svg,.alert-success .alert-title{color:var(--success)}
.alert-warning{border-color:color-mix(in oklab,var(--warning) 35%,var(--border));background:color-mix(in oklab,var(--warning) 5%,var(--card))}
.alert-warning>svg,.alert-warning .alert-title{color:var(--warning)}
.alert-info>svg{color:var(--info)}
.alert-action{position:absolute;top:.5rem;right:.5rem}
.alert:has(>.alert-action){padding-right:3rem}
.alert.is-dismissing{animation:fade-out .2s var(--ease) forwards}

/* ── Avatar ────────────────────────────────────────────────────────────── */
.avatar{--size:2rem;position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--size);height:var(--size);border-radius:9999px;background:var(--muted);color:var(--foreground);font-size:calc(var(--size)*.38);font-weight:600;line-height:1;text-transform:uppercase;user-select:none;box-shadow:inset 0 0 0 1px var(--border)}
.avatar img{width:100%;height:100%;border-radius:inherit;object-fit:cover}
.avatar-sm{--size:1.5rem}.avatar-lg{--size:2.5rem}.avatar-xl{--size:4rem}
.avatar-square{border-radius:var(--radius-md)}

/* ── Separador, skeleton, progreso, tecla ─────────────────────────────── */
.separator{flex-shrink:0;width:100%;height:1px;background:var(--border)}
.skeleton{position:relative;overflow:hidden;border-radius:var(--radius-md);background:var(--muted)}
.skeleton::after{content:'';position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,var(--shimmer),transparent);animation:shimmer 1.6s ease-in-out infinite}
.skeleton-text{height:.875rem}.skeleton-title{height:1.5rem;width:40%}.skeleton-circle{border-radius:50%}
.progress{position:relative;width:100%;height:.375rem;overflow:hidden;border-radius:9999px;background:var(--muted)}
.progress-bar{width:var(--value,0%);height:100%;border-radius:inherit;background:var(--primary);transition:width .5s var(--ease-out);animation:progress-in .9s var(--ease-out)}
.progress-success .progress-bar{background:var(--success)}.progress-warning .progress-bar{background:var(--warning)}.progress-danger .progress-bar{background:var(--destructive)}
.progress-label{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.5rem;font-size:.875rem;font-weight:500}
.progress-label span:last-child{color:var(--muted-foreground);font-weight:400;font-variant-numeric:tabular-nums}
.kbd{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .3125rem;border-radius:var(--radius-sm);background:var(--muted);box-shadow:inset 0 -1px 0 var(--border);color:var(--muted-foreground);font-family:var(--font-sans);font-size:.6875rem;font-weight:500;line-height:1}

/* ── Estado vacío ──────────────────────────────────────────────────────── */
.empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;min-width:0;padding:3rem 1.5rem;text-align:center;text-wrap:balance}
.empty-dashed{border:1px dashed var(--border);border-radius:var(--radius-xl)}
.empty-icon{display:flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;margin-bottom:.5rem;border-radius:var(--radius-lg);background:var(--muted);color:var(--foreground);box-shadow:inset 0 0 0 1px var(--border)}
.empty-icon svg{width:1.25rem;height:1.25rem}
.empty-title{font-size:1.0625rem;font-weight:600;letter-spacing:-.01em}
.empty-text{max-width:24rem;color:var(--muted-foreground);font-size:.875rem;line-height:1.55}
.empty-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.75rem}

/* ── Código, IMEI y botón de copiar ───────────────────────────────────── */
.code{padding:.125rem .375rem;border-radius:var(--radius-sm);background:var(--muted);font-family:var(--font-mono);font-size:.8125rem;overflow-wrap:anywhere}
.code-block{display:block;padding:1rem;overflow-x:auto;border-radius:var(--radius-lg);background:var(--muted);font-family:var(--font-mono);font-size:.8125rem;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere}
.imei{display:inline-flex;align-items:center;gap:.375rem;font-family:var(--font-mono);font-size:.8125rem;font-variant-numeric:tabular-nums;letter-spacing:.01em;white-space:nowrap}
.imei-group{display:inline-flex;gap:.375em}
.imei-group>span:last-child{color:var(--muted-foreground)}
.copy-btn{display:inline-flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:var(--radius-sm);color:var(--muted-foreground);transition:background-color .15s,color .15s}
.copy-btn:hover{background:var(--muted);color:var(--foreground)}
.copy-btn svg{width:.875rem;height:.875rem}
.copy-btn .icon-done{display:none}
.copy-btn.is-copied{color:var(--success)}
.copy-btn.is-copied .icon-copy{display:none}
.copy-btn.is-copied .icon-done{display:block}
/* Como botón normal (p. ej. junto a «Actualizar»): mismo tamaño e icono que los demás botones de icono. */
.btn.copy-btn{width:var(--btn-h);height:var(--btn-h);border-radius:var(--radius-md)}
.btn.copy-btn svg{width:1rem;height:1rem}
.result-box{position:relative;padding:.875rem 2.75rem .875rem 1rem;border-radius:var(--radius-lg);background:var(--muted-50);box-shadow:inset 0 0 0 1px var(--border);font-family:var(--font-mono);font-size:.875rem;line-height:1.6;white-space:pre-wrap;overflow-wrap:anywhere}
.result-box .copy-btn{position:absolute;top:.625rem;right:.625rem}

/* ── Migas de pan ──────────────────────────────────────────────────────── */
.breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:.375rem;color:var(--muted-foreground);font-size:.875rem}
.breadcrumb li{display:inline-flex;align-items:center;gap:.375rem}
.breadcrumb a{transition:color .15s}
.breadcrumb a:hover{color:var(--foreground)}
.breadcrumb [aria-current=page]{color:var(--foreground);font-weight:500}
.breadcrumb li+li::before{content:'';width:.875rem;height:.875rem;background:currentColor;opacity:.6;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18 6-6-6-6'/%3E%3C/svg%3E") center/contain no-repeat}

/* ── Lista clave/valor ─────────────────────────────────────────────────── */
.kv{display:flex;flex-direction:column}
.kv-row{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;padding:.625rem 0;border-bottom:1px solid var(--border)}
.kv-row:last-child{border-bottom:0}
.kv-row>dt{flex-shrink:0;color:var(--muted-foreground)}
.kv-row>dd{min-width:0;text-align:right;overflow-wrap:anywhere}

/* ── Línea de tiempo ───────────────────────────────────────────────────── */
.timeline{display:flex;flex-direction:column}
.timeline li{position:relative;display:flex;gap:.75rem;padding-bottom:1.125rem}
.timeline li:last-child{padding-bottom:0}
.timeline li:not(:last-child)::before{content:'';position:absolute;left:.6875rem;top:1.625rem;bottom:.25rem;width:1px;background:var(--border)}
.tl-dot{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.375rem;height:1.375rem;border-radius:999px;background:var(--muted);color:var(--muted-foreground)}
.tl-dot svg{width:.75rem;height:.75rem}
.tl-done .tl-dot{background:var(--success-10);color:var(--success)}
.tl-current .tl-dot{background:var(--warning-10);color:var(--warning)}
.tl-failed .tl-dot{background:var(--destructive-10);color:var(--destructive)}
.tl-title{display:block;font-size:.875rem;font-weight:500}
.tl-when{display:block;color:var(--muted-foreground);font-size:.75rem}
.tl-text{margin-top:.25rem;color:var(--muted-foreground);font-size:.8125rem}

/* ── Historial de accesos y cambios de seguridad ───────────────────────── */
.activity-list{display:flex;flex-direction:column}
.activity-item{display:flex;align-items:center;gap:.75rem;padding:.625rem 0;border-bottom:1px solid var(--border)}
.activity-item:first-child{padding-top:0}
.activity-item:last-child{padding-bottom:0;border-bottom:0}
.activity-icon{display:grid;place-items:center;flex:none;width:2.25rem;height:2.25rem;border-radius:.625rem;background:var(--muted);color:var(--muted-foreground)}
.activity-icon svg{width:1.0625rem;height:1.0625rem}
.activity-icon.is-success{background:var(--success-10);color:var(--success)}
.activity-icon.is-warning{background:var(--warning-10);color:var(--warning)}
.activity-icon.is-danger{background:var(--destructive-10);color:var(--destructive)}
.activity-icon.is-info{background:var(--info-10);color:var(--info)}
.activity-body{flex:1;min-width:0}
.activity-title{font-size:.875rem;font-weight:500;line-height:1.3}
.activity-meta{margin-top:.0625rem;overflow:hidden;color:var(--muted-foreground);font-size:.8125rem;text-overflow:ellipsis;white-space:nowrap}
.activity-when{flex:none;color:var(--muted-foreground);font-size:.75rem;white-space:nowrap}
@media (max-width:479.98px){.activity-item{flex-wrap:wrap}.activity-when{width:100%;padding-left:3rem}}

/* ── Pasos (stepper) ───────────────────────────────────────────────────── */
.steps{display:grid;grid-template-columns:repeat(var(--steps,3),minmax(0,1fr));gap:.5rem}
.steps li{display:flex;flex-direction:column;gap:.5rem;color:var(--muted-foreground);font-size:.75rem;font-weight:500}
.steps li::before{content:'';height:.1875rem;border-radius:999px;background:var(--border);transition:background-color .3s}
.steps li.is-done,.steps li.is-current{color:var(--foreground)}
.steps li.is-done::before,.steps li.is-current::before{background:var(--primary)}
.steps-2{--steps:2}.steps-4{--steps:4}.steps-5{--steps:5}
.numbered{display:flex;flex-direction:column;gap:1rem;counter-reset:n}
.numbered>li{position:relative;display:flex;gap:.875rem;counter-increment:n}
.numbered>li::before{content:counter(n);display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.625rem;height:1.625rem;border-radius:50%;background:var(--primary);color:var(--primary-foreground);font-size:.75rem;font-weight:600}
.numbered>li:not(:last-child)::after{content:'';position:absolute;left:.8125rem;top:1.875rem;bottom:-.75rem;width:1px;background:var(--border)}

/* ── Cabecera de página y secciones ───────────────────────────────────── */
.page-header{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.5rem}
.page-header-text{min-width:0}
.page-kicker{margin-bottom:.375rem}
.page-title{font-size:1.5rem;font-weight:600;line-height:1.2;letter-spacing:-.03em}
.page-description{margin-top:.375rem;color:var(--muted-foreground);font-size:.875rem;max-width:44rem}
.page-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
@media (max-width:639.98px){.page-header{flex-direction:column;align-items:stretch}.page-actions>.btn{flex:1 1 auto}}
.section-title{font-size:1rem;font-weight:600;letter-spacing:-.01em}
.settings-section{display:grid;gap:1.5rem;grid-template-columns:minmax(0,1fr)}
@media (min-width:1024px){.settings-section{grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:2.5rem}}
.settings-aside h2{font-size:1rem;font-weight:600}
.settings-aside p{margin-top:.25rem;color:var(--muted-foreground)}
.settings-sep{height:1px;margin:2.5rem 0;background:var(--border)}

/* ── Gráficas (las dibuja admin-panel.js con SVG) ───────────────────────────── */
.chart{position:relative;width:100%;height:240px;font-size:.75rem;user-select:none}
.chart svg{width:100%;height:100%;overflow:visible}
.chart-sm{height:160px}.chart-lg{height:320px}.chart-spark{height:3rem}
.chart-grid line{stroke:var(--border);stroke-dasharray:4 4}
.chart-tick{fill:var(--muted-foreground);font-size:11px;font-family:var(--font-sans)}
.chart-s0{--c:var(--foreground)}
.chart-s1{--c:color-mix(in oklab,var(--foreground) 40%,transparent)}
.chart-s2{--c:color-mix(in oklab,var(--foreground) 20%,transparent)}
.chart-s3{--c:var(--chart-2)}
.chart-tone-success{--c:var(--chart-ok)}
.chart-tone-warning{--c:var(--chart-bad)}
.chart-line{fill:none;stroke:var(--c);stroke-width:2.25;stroke-linecap:round;stroke-linejoin:round}
.chart-area:not(.is-gradient){fill:var(--c);opacity:.08}
.chart-grad-top{stop-color:var(--c);stop-opacity:.22}
.chart-grad-bottom{stop-color:var(--c);stop-opacity:0}
.chart-guide{stroke:color-mix(in oklab,var(--foreground) 25%,transparent);stroke-dasharray:3 3;opacity:0;transition:opacity .12s}
.chart-guide.is-visible{opacity:1}
.chart-bar{fill:var(--c);transform-box:fill-box;transform-origin:50% 100%;animation:bar-grow .6s var(--ease-out) backwards;transition:opacity .15s}
.chart:hover .chart-bar:not(:hover){opacity:.6}
.chart-reveal{animation:chart-reveal 1s var(--ease-out) backwards}
.chart-tooltip{position:absolute;z-index:5;padding:.375rem .625rem;border-radius:var(--radius-md);background:var(--popover);box-shadow:0 0 0 1px var(--fg-10),var(--shadow-lg);font-size:.75rem;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s}
.chart-tooltip.is-visible{opacity:1}
.chart-tooltip b{display:block;font-weight:600;font-variant-numeric:tabular-nums}
.chart-legend{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.75rem;color:var(--muted-foreground);font-size:.75rem}
.chart-legend span{display:inline-flex;align-items:center;gap:.375rem}
.chart-swatch{width:.625rem;height:.625rem;border-radius:2px;background:var(--c)}

/* ── Selector de tema (luna/sol) ───────────────────────────────────────── */
.theme-toggle{position:relative}
.theme-toggle svg{transition:transform .3s var(--ease-out),opacity .2s}
.theme-toggle .icon-sun{position:absolute;transform:scale(0) rotate(-90deg);opacity:0}
.dark .theme-toggle .icon-moon{transform:scale(0) rotate(90deg);opacity:0}
.dark .theme-toggle .icon-sun{transform:none;opacity:1}

/* ── Baldosa de icono ──────────────────────────────────────────────────── */
.tile{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:var(--radius-lg);background:var(--primary);color:var(--primary-foreground)}
.tile svg{width:1.125rem;height:1.125rem}
.tile-soft{background:var(--primary-10);color:var(--foreground);box-shadow:inset 0 0 0 1px var(--border)}
.tile-sm{width:2rem;height:2rem;border-radius:var(--radius-md)}
.tile-sm svg{width:1rem;height:1rem}

/* ── Píldora de saldo y marca ──────────────────────────────────────────── */
.brand{display:inline-flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:600;letter-spacing:-.02em;line-height:1;border-radius:var(--radius-md)}
.brand-mark{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.75rem;height:1.75rem;border-radius:var(--radius-md);background:var(--primary);color:var(--primary-foreground);font-size:.875rem;font-weight:700}
.brand-mark svg{width:1rem;height:1rem}
.brand-mark.is-payandes{width:2rem;height:2rem;border-radius:0;background:none;color:inherit}
.brand-mark.is-payandes svg{width:100%;height:100%}
.brand-logo{height:1.75rem;width:auto;max-width:10rem;object-fit:contain}
.brand-icon{flex-shrink:0;width:1.75rem;height:1.75rem;border-radius:.4375rem;object-fit:contain}
.dark .brand-logo.is-invertible{filter:invert(1) hue-rotate(180deg)}
.balance-pill{display:inline-flex;align-items:center;gap:.5rem;height:2.25rem;padding:0 .875rem 0 .375rem;border-radius:999px;background:var(--box);box-shadow:0 0 0 1px var(--border);font-size:.875rem;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap;transition:box-shadow .15s}
.balance-pill:hover{box-shadow:0 0 0 1px color-mix(in oklab,var(--foreground) 22%,transparent)}
.balance-pill .balance-icon{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--primary);color:var(--primary-foreground)}
.balance-pill .balance-icon svg{width:.8125rem;height:.8125rem}
.balance-pill small{color:var(--muted-foreground);font-weight:500}
.live-dot{position:relative;display:inline-block;width:.5rem;height:.5rem;border-radius:50%;background:var(--success);flex-shrink:0}
.live-dot::after{content:'';position:absolute;inset:0;border-radius:inherit;background:inherit;animation:ping 2s var(--ease-out) infinite}

/* ── Zona de subida ────────────────────────────────────────────────────── */
.dropzone{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.375rem;min-height:9rem;padding:1.5rem;border:1px dashed var(--input);border-radius:var(--radius-xl);color:var(--muted-foreground);text-align:center;cursor:pointer;transition:border-color .15s,background-color .15s}
.dark .dropzone{border-color:color-mix(in oklab,var(--foreground) 22%,transparent)}
.dropzone:hover,.dropzone.is-dragover{background:var(--muted-50);border-color:var(--ring)}
.dropzone:focus-within{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.dropzone input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.dropzone-icon{display:flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;margin-bottom:.25rem;border-radius:var(--radius-lg);background:var(--muted);color:var(--foreground)}
.dropzone-icon svg{width:1.25rem;height:1.25rem}
.dropzone-title{color:var(--foreground);font-weight:500}
.dropzone-hint{font-size:.75rem}
.dropzone-file{color:var(--foreground);font-weight:500}

/* ── Barra de filtros de listados (pedidos, facturas, tickets…): desplegables y buscador, nunca pestañas ── */
.filter-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.75rem;padding:1rem 1.25rem;border-bottom:1px solid var(--border)}
.filter-bar .field{display:flex;flex-direction:column;gap:.375rem;flex:1 1 11rem;min-width:0;max-width:16rem}
.filter-bar .field.is-wide{flex:2 1 16rem;max-width:24rem}
.filter-bar .field>label{color:var(--muted-foreground);font-size:.75rem;font-weight:600}
.filter-bar .input,.filter-bar .select{width:100%}
.filter-bar-actions{display:flex;gap:.5rem;margin-left:auto}
@media (max-width:639.98px){.filter-bar .field,.filter-bar .field.is-wide{max-width:none;flex-basis:100%}.filter-bar-actions{width:100%}.filter-bar-actions .btn{flex:1}}

/* ── Desplegables con el diseño del Payer (ui-core.js convierte cada <select class="select">) ─────────────── */
.select-wrap{position:relative;display:block;min-width:0}
.select-wrap.is-auto{display:inline-block;width:auto;vertical-align:middle}
.select-native{position:absolute!important;inset:0;width:100%!important;height:100%!important;margin:0;opacity:0;pointer-events:none}
.select-trigger{display:flex;align-items:center;gap:.5rem;text-align:left;font-weight:400;cursor:pointer}
.select-trigger .select-value{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.select-trigger[aria-expanded=true]{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.select-trigger:disabled{opacity:.5;cursor:not-allowed}
.select-menu{position:fixed;z-index:90;display:grid;gap:.1875rem;max-width:calc(100vw - 1rem);max-height:min(20rem,calc(100vh - 1rem));padding:.3125rem;overflow-y:auto;border-radius:var(--radius-lg);background:var(--popover);color:var(--popover-foreground);box-shadow:0 0 0 1px var(--fg-10),var(--shadow-md);outline:none;animation:select-in .14s var(--ease-out)}
.select-menu[hidden]{display:none}
@keyframes select-in{from{opacity:0;transform:translateY(-4px) scale(.985)}to{opacity:1;transform:none}}
.select-option{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:2.25rem;padding:.4375rem .625rem;border-radius:var(--radius-sm);font-size:.875rem;line-height:1.25rem;outline:none;cursor:pointer;user-select:none;transition:background-color .1s,color .1s}
.select-option:hover,.select-option:focus{background:var(--accent);color:var(--accent-foreground)}
.select-option>.truncate{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.select-option .select-check{flex-shrink:0;width:1rem;height:1rem;opacity:0;transition:opacity .1s}
.select-option[aria-selected=true]{font-weight:500}
.select-option[aria-selected=true] .select-check{opacity:1}
.select-option[aria-disabled=true]{opacity:.5;cursor:not-allowed}
.select-group{padding:.5rem .625rem .25rem;color:var(--muted-foreground);font-size:.75rem;font-weight:500}
.select-group:not(:first-child){margin-top:.25rem;border-top:1px solid var(--border);padding-top:.625rem}
@media (prefers-reduced-motion:reduce){.select-menu{animation:none}}
/* Cabecera del menú de usuario enlazada al perfil */
.dropdown-profile.is-link{margin-bottom:.125rem;border-radius:var(--radius-md);transition:background-color .1s}
.dropdown-profile.is-link:hover,.dropdown-profile.is-link:focus-visible{background:var(--accent);outline:none}
.dropdown-profile.is-link>div{flex:1}
.dropdown-profile.is-link>.icon{width:1rem;height:1rem;color:var(--muted-foreground)}
.user-menu .dropdown-label{padding:.5rem .625rem .25rem;font-size:.6875rem;letter-spacing:.06em;text-transform:uppercase}
/* Buscador dentro de la lista (data-search) y lista más ancha que el botón (data-menu-class="is-wide") */
/* Combobox (listas largas): se escribe en el propio campo; la opción activa se marca sin mover el foco y lo que
   coincide con lo escrito va en negrita subrayada (monocromo). */
.select-combo{display:flex;align-items:center;gap:.25rem;cursor:text}
.select-combo:focus-within,.select-combo.is-open{border-color:var(--ring);box-shadow:0 0 0 3px var(--ring-50)}
.select-combo.is-disabled{opacity:.5;cursor:not-allowed}
.select-combo-input{flex:1;min-width:0;height:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-overflow:ellipsis;outline:none}
.select-combo-input::placeholder{color:var(--muted-foreground)}
.select-combo-input:disabled{cursor:not-allowed}
.select-combo-clear{display:grid;flex-shrink:0;place-items:center;width:1.25rem;height:1.25rem;margin-right:-.125rem;border-radius:var(--radius-sm);color:var(--muted-foreground);cursor:pointer;transition:background-color .15s,color .15s}
.select-combo-clear:hover{background:var(--muted);color:var(--foreground)}
.select-combo-clear[hidden]{display:none}
.select-option.is-active{background:var(--accent);color:var(--accent-foreground)}
.select-option mark{background:none;color:inherit;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
.select-empty{padding:.75rem .625rem;color:var(--muted-foreground);font-size:.8125rem;text-align:center}
.select-menu.is-wide{width:min(20rem,calc(100vw - 1rem))}
.select-option .select-meta{flex-shrink:0;margin-left:auto;padding:.0625rem .4375rem;border-radius:var(--radius-sm);background:var(--muted);color:var(--muted-foreground);font-size:.75rem;font-variant-numeric:tabular-nums}
.select-option:has(.select-meta) .select-check{margin-left:0}

/* Etiquetas rectangulares con borde (estados de pedido y tipo): sin punto, con icono */
.badge.is-rect,.badge-state,.badge-status{border-radius:.375rem}
.badge-state{gap:.375rem;height:1.625rem;padding:0 .5625rem;font-weight:600}
.badge-state svg{width:.875rem;height:.875rem}
.badge-state.badge-success,.badge-status.badge-success{border-color:color-mix(in oklab,var(--success) 35%,transparent)}
.badge-state.badge-warning,.badge-status.badge-warning{border-color:color-mix(in oklab,var(--warning) 40%,transparent)}
.badge-state.badge-danger,.badge-status.badge-danger{border-color:color-mix(in oklab,var(--destructive) 35%,transparent)}
.badge-state.badge-info,.badge-status.badge-info{border-color:color-mix(in oklab,var(--info) 35%,transparent)}
.badge-state.badge-muted,.badge-status.badge-muted{border-color:var(--border)}
.badge-status svg{width:.875rem;height:.875rem}
.badge-status.is-live svg{animation:hourglass-turn 2.4s var(--ease-out) infinite}
.badge-state.is-live svg{animation:hourglass-turn 2.4s var(--ease-out) infinite}
@keyframes hourglass-turn{0%,70%{transform:rotate(0)}100%{transform:rotate(180deg)}}
@media (prefers-reduced-motion:reduce){.badge-state.is-live svg{animation:none}}
.badge.is-rect.badge-outline{height:1.625rem;padding:0 .5625rem;font-weight:500}

/* Filtros automáticos (form[data-live-filter]): sin el botón «Filtrar», las celdas de acciones vacías no ocupan
   sitio. Si la respuesta tarda, los resultados se atenúan un poco; lo nuevo entra con un fundido corto. */
[data-live-filter] .field:not(:has(:is(input,select,textarea,a,button):not([hidden]):not([type=hidden]))),
[data-live-filter] :is(.filter-bar-actions,.of-actions):not(:has(:is(a,button):not([hidden]))){display:none}
main :is(.table-wrap,.table-footer,.empty){transition:opacity .2s var(--ease-out)}
main[aria-busy=true] :is(.table-wrap,.table-footer,.empty){opacity:.6}
.live-in{animation:live-in .24s var(--ease-out) both}
@keyframes live-in{from{opacity:0;transform:translateY(4px)}}
@media (prefers-reduced-motion:reduce){.live-in{animation:none}main :is(.table-wrap,.table-footer,.empty){transition:none}}

/* Texto con formato (descripción de los servicios): HTML ya limpio por RichText. Lo usan la tienda, el pedido y el editor. */
.rich-text{overflow-wrap:break-word;white-space:normal}
.rich-text>:first-child{margin-top:0}
.rich-text>:last-child{margin-bottom:0}
.rich-text :is(p,ul,ol,blockquote,pre,table){margin:.75em 0}
.rich-text h2{margin:1.25em 0 .5em;font-size:1.25em;font-weight:600;letter-spacing:-.02em;line-height:1.3}
.rich-text h3{margin:1.125em 0 .5em;font-size:1.0625em;font-weight:600;line-height:1.35}
.rich-text h4{margin:1em 0 .375em;font-size:1em;font-weight:600}
.rich-text ul{list-style:disc;padding-left:1.375em}
.rich-text ol{list-style:decimal;padding-left:1.5em}
.rich-text li{margin:.25em 0}
.rich-text li::marker{color:var(--muted-foreground)}
.rich-text strong{color:var(--foreground);font-weight:600}
.rich-text a{color:var(--foreground);font-weight:500;text-decoration:underline;text-underline-offset:3px;text-decoration-color:color-mix(in oklab,var(--foreground) 35%,transparent);transition:text-decoration-color .15s}
.rich-text a:hover{text-decoration-color:currentColor}
.rich-text blockquote{padding:.125em 0 .125em 1em;border-left:2px solid var(--border);color:var(--muted-foreground)}
.rich-text code{padding:.125em .375em;border-radius:var(--radius-sm);background:var(--muted);font-size:.875em}
.rich-text pre{padding:.875em 1em;overflow-x:auto;border-radius:var(--radius-lg);background:var(--muted-50);box-shadow:inset 0 0 0 1px var(--border);font-family:var(--font-code);font-size:.8125rem;line-height:1.6;white-space:pre}
.rich-text pre code{padding:0;background:none;font-size:inherit}
.rich-text hr{height:1px;margin:1.5em 0;border:0;background:var(--border)}
.rich-text img{display:inline-block;max-width:100%;height:auto;border-radius:var(--radius-md);vertical-align:middle}
.rich-text mark{padding:0 .125em;border-radius:2px;background:var(--muted);color:inherit}
.rich-text table{width:100%;border-collapse:collapse;font-size:.9375em}
.rich-text :is(th,td){padding:.5em .75em;border:1px solid var(--border);text-align:left;vertical-align:top}
.rich-text th{background:var(--muted-50);font-weight:600}
.rich-text .rt-center{text-align:center}
.rich-text .rt-right{text-align:right}
.rich-text .rt-justify{text-align:justify}

/* Página intermedia al volver de otro sitio (shared::continue): pasarela de pago, Google… */
.continue-page{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.25rem;min-height:100dvh;padding:2rem 1rem;text-align:center;color:var(--muted-foreground);font-size:1rem}
.continue-spinner{width:2rem;height:2rem;border:3px solid var(--border);border-top-color:var(--foreground);border-radius:50%;animation:spin .8s linear infinite}
.continue-link{font-size:.8125rem;color:var(--muted-foreground);text-decoration:underline;text-underline-offset:4px}