/* Envidiagnostico: presentation only. Shared by v2, register and public pages. */
*, *::before, *::after { box-sizing: border-box; }
html, body { min-width: 0; max-width: 100%; }
body.app-shell { overflow-x: visible; }
img, video, canvas, svg { max-width: 100%; }
iframe { max-width: 100%; }
:where(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), select, textarea) {
    min-width: 0; max-width: 100%;
}
:where(button, .button, .btn-primary, .btn-secondary, .btn-danger, .action-link) {
    max-width: 100%; white-space: normal; overflow-wrap: anywhere;
}
:where(fieldset, form, .card, .table-card, .form-group, .filters-form, .form-grid, .filters-grid,
       .dashboard-grid, .settings-grid, .dashboard-content-grid, .detail-item, .metric-card,
       .main-container, .content, .header-left, .header-right, .page-header > *, .page-actions,
       .site-header > *, .brand, .brand > span, .survey-card, .response, .results-page, .cda) {
    min-width: 0;
}
:where(p, h1, h2, h3, h4, label, legend, blockquote, .alert, .detail-item, .message-bubble,
       .error-column, .table-badge, .badge, .consent-evidence) { overflow-wrap: anywhere; }
:where(pre, code) { white-space: pre-wrap; overflow-wrap: anywhere; }
.app-shell .main-container { min-width: 0; }
.app-shell .sidebar { position: fixed; height: 100dvh; min-height: 0; }
.app-shell .content { width: 100%; max-width: 100%; }
.app-shell .page-actions { justify-content: flex-start; flex-wrap: wrap; gap: 8px; }
.app-shell :where(.page-header, .header, .header-right, .table-header, .table-actions,
 .filters-actions, .form-actions, .stage-switch, .global-handoff-alert-main, .user-box, .pagination) {
    min-width: 0; max-width: 100%; flex-wrap: wrap;
}
.app-shell :where(.table-actions, .filters-actions, .form-actions) { gap: 8px; }
.app-shell .settings-form > :where(.btn-primary, .btn-secondary, button[type="submit"]) {
    justify-self: start; width: auto;
}
.app-shell :where(.form-grid, .settings-grid, .dashboard-content-grid) > * { min-width: 0; }
.app-shell :where(input, select, textarea) { max-width: 100%; }
.app-shell .responsive-menu-toggle { display: none; }
.responsive-table-container { min-width: 0; max-width: 100%; container-name: records; container-type: inline-size; }
.responsive-table { width: 100%; }
.site-header { max-width: 100%; }
.site-header nav, .site-footer { flex-wrap: wrap; }
.cda :where(section, nav, form) { min-width: 0; max-width: 100%; }
.cda nav { flex-wrap: wrap; gap: 12px; }
.cda input[type="file"] { width: 100%; }

@media (max-width: 1200px) {
    .app-shell .filters-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .app-shell .reminder-batch-form { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .app-shell .reminder-batch-form > button { justify-self: start; }
}
@media (max-width: 1000px) {
    .app-shell .sidebar {
        position: static; width: 100%; height: auto; min-height: 0;
        padding: 12px 16px; gap: 10px; border-right: 0; border-bottom: 1px solid var(--border);
    }
    .app-shell .main-container { margin-left: 0; width: 100%; }
    .app-shell .sidebar :where(.sidebar-subtitle, .sidebar-section-label, .sidebar-footer-note) { display: none; }
    .app-shell .sidebar .menu { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
    .app-shell .sidebar .menu a { white-space: normal; min-width: 0; overflow-wrap: anywhere; }
    .app-shell .sidebar.has-responsive-menu:not(.responsive-menu-open) .menu { display: none; }
    .app-shell .responsive-menu-toggle {
        display: inline-flex; align-items: center; justify-content: center; align-self: flex-start;
        border: 1px solid var(--border); border-radius: 8px; padding: 9px 14px;
        min-height: 40px; background: var(--surface); color: var(--text); font: inherit; cursor: pointer;
    }
    .app-shell .responsive-menu-toggle:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
    .app-shell .header { position: static; gap: 12px; padding: 16px; }
    .app-shell .content { padding: 16px; }
    .app-shell .footer { padding: 14px 16px; }
    .app-shell .header-left h1 { font-size: 1.2rem; }
    .app-shell .header-left p { font-size: .78rem; }
    .app-shell .header-right, .app-shell .user-box { flex-direction: row; align-items: center; }
    .app-shell .global-handoff-alert { padding: 0 16px 12px; }
    .app-shell .global-handoff-alert-main { gap: 10px; padding: 12px; }
    .app-shell :where(.settings-grid, .dashboard-content-grid, .vencidos-top-row) { grid-template-columns: minmax(0, 1fr); }
    .site-header { height: auto; min-height: 80px; padding: 16px 20px; flex-wrap: wrap; gap: 14px; }
    .site-header nav { gap: 14px; }
    .admin-link { padding-left: 0; border-left: 0; }
}
@media (max-width: 640px) {
    .app-shell .content { padding: 12px; }
    .app-shell .card { padding: 16px; }
    .app-shell .table-card { padding: 0; }
    .app-shell .page-header { align-items: flex-start; gap: 12px; }
    .app-shell .page-header h2 { font-size: 1.35rem; }
    .app-shell .page-actions { flex-direction: row; align-items: center; justify-content: flex-start; }
    .app-shell .page-actions :where(a, button) { flex: 0 1 auto; }
    .app-shell :where(.form-grid, .filters-grid, .settings-grid, .reminder-filters, .reminder-batch-form,
      .configuration-guide-summary, .configuration-field-statuses, .price-grid) { grid-template-columns: minmax(0, 1fr); }
    .app-shell :where(.dashboard-grid, .recordatorio-metrics-2, .recordatorio-metrics-3,
      .recordatorio-metrics-4, .reminder-summary) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .app-shell .metric-card { padding: 13px; }
    .app-shell .metric-card h3 { font-size: 1.45rem; }
    .app-shell .sidebar .menu { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .app-shell .header { align-items: flex-start; }
    .app-shell .header-left p { display: none; }
    .app-shell :where(.table-actions, .filters-actions, .form-actions) { flex-direction: row; align-items: center; flex-wrap: wrap; }
    .app-shell .global-handoff-alert-main strong { white-space: normal; }
    .app-shell .reminder-ready, .app-shell .reminder-batch-count { white-space: normal; }
    .app-shell .filters-actions { justify-content: flex-start; }
    .site-header { padding: 14px 16px; gap: 12px; }
    .brand { gap: 10px; }
    .brand img { width: 58px; height: 52px; flex: 0 0 auto; }
    .brand > span { font-size: 14px; }
    .site-header nav { width: 100%; gap: 10px 16px; font-size: 12px; }
    .site-footer { gap: 12px; padding: 20px 16px; }
    :where(.survey-layout, .results-page, .privacy-layout) { padding-left: 16px; padding-right: 16px; max-width: 100%; }
    :where(.input-grid, .stats-grid, .distribution-grid, .answer-grid) { grid-template-columns: minmax(0, 1fr); }
    :where(.results-heading, .response-top, .publication-row, .response-header) { flex-wrap: wrap; gap: 12px; }
    .button { white-space: normal; gap: 10px; }
    .cda { margin: 20px auto; padding: 0 12px; }
    .cda section { padding: 16px; }
    .cda form { align-items: stretch; }
    .cda form > label { width: 100%; }
}
@media (max-width: 360px) {
    .app-shell .sidebar .menu { grid-template-columns: minmax(0, 1fr); }
    .brand > span { font-size: 12px; }
}

/* CARD_RULES: generated for narrow viewports and narrow table containers. */

/* Compact lists retain native table rows and headers. */
.responsive-table-container { overflow-x: visible; }
table.responsive-table { display: table; width: 100% !important; min-width: 0 !important; max-width: 100%; table-layout: fixed; border-collapse: collapse; }
table.responsive-table :where(th, td) { min-width: 0 !important; width: auto !important; max-width: 100%; padding: 8px 6px !important; white-space: normal !important; overflow-wrap: anywhere; word-break: normal; font-size: .78rem; vertical-align: middle; }
table.responsive-table [data-column="id"] { display: none !important; }
table.responsive-table .compact-empty-column { display: none !important; }
table.responsive-table :where(.table-actions, .form-actions, .publication-row) { display: flex; flex-wrap: wrap; gap: 4px; min-width: 0; }
table.responsive-table :where(form, .inline-form, input, select, textarea) { min-width: 0 !important; max-width: 100%; }
table.responsive-table :where(button, .btn-primary, .btn-secondary, .btn-danger, .action-link) { padding: 6px !important; font-size: inherit; min-width: 0; max-width: 100%; white-space: normal; line-height: 1.3; }
table.responsive-table td :where(p, small, .table-badge, .badge) { font-size: inherit; }
table.responsive-table td :where(pre, code) { white-space: pre-wrap; }
@media (max-width: 640px) {
 table.responsive-table :where(th, td) { padding: 7px 3px !important; font-size: .68rem; line-height: 1.3; letter-spacing: 0; }
 table.responsive-table th { text-transform: none; }
 table.responsive-table :where(button, .btn-primary, .btn-secondary, .btn-danger, .action-link) { padding: 6px 3px !important; }
}