/* ========================================================================== 
   QrGate - Tema global sobre ZK Iceblue
   Compatible con ZK EE 10.0.0
   ========================================================================== */

:root {
    --qg-primary: #176b55;
    --qg-primary-600: #125c49;
    --qg-primary-700: #0e4d3c;
    --qg-primary-800: #0a3d30;
    --qg-accent: #33c58e;
    --qg-accent-soft: #dff7ed;

    --qg-success: #16845f;
    --qg-success-soft: #e8f8f1;
    --qg-warning: #b7791f;
    --qg-warning-soft: #fff7df;
    --qg-danger: #c43d4b;
    --qg-danger-soft: #fff0f2;
    --qg-info: #2476a8;
    --qg-info-soft: #edf7fc;

    --qg-bg: #f3f7f5;
    --qg-surface: #ffffff;
    --qg-surface-soft: #f8fbfa;
    --qg-border: #dce7e2;
    --qg-border-strong: #c7d8d1;
    --qg-text: #17241f;
    --qg-text-secondary: #52635c;
    --qg-text-muted: #788780;
    --qg-disabled: #a7b3ae;

    --qg-radius-sm: 7px;
    --qg-radius-md: 11px;
    --qg-radius-lg: 16px;
    --qg-radius-xl: 22px;

    --qg-shadow-sm: 0 2px 8px rgba(16, 50, 39, 0.07);
    --qg-shadow-md: 0 10px 28px rgba(16, 50, 39, 0.11);
    --qg-shadow-lg: 0 22px 55px rgba(11, 45, 35, 0.16);
    --qg-focus: 0 0 0 3px rgba(51, 197, 142, 0.20);

    --qg-header-height: 62px;
    --qg-sidebar-width: 252px;
    --qg-font: Inter, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --qg-transition: 160ms ease;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body,
.z-page {
    width: 100%;
    min-height: 100%;
    margin: 0;
}

html {
    color-scheme: light;
    background: var(--qg-bg);
    -webkit-text-size-adjust: 100%;
}

body,
.z-page,
.z-window,
.z-popup,
.z-menupopup,
.z-combobox-popup {
    color: var(--qg-text);
    font-family: var(--qg-font);
    font-size: 14px;
}

body {
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--qg-bg);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

a {
    color: var(--qg-primary);
    text-decoration: none;
    transition: color var(--qg-transition);
}

a:hover {
    color: var(--qg-primary-700);
}

::selection {
    color: #fff;
    background: var(--qg-primary);
}

/* Scrollbars */
* {
    scrollbar-color: #b8ccc4 transparent;
    scrollbar-width: thin;
}

*::-webkit-scrollbar {
    width: 9px;
    height: 9px;
}

*::-webkit-scrollbar-thumb {
    border: 2px solid transparent;
    border-radius: 999px;
    background: #b8ccc4;
    background-clip: padding-box;
}

*::-webkit-scrollbar-thumb:hover {
    background: #94afa4;
    background-clip: padding-box;
}

/* --------------------------------------------------------------------------
   Utilidades QrGate
   -------------------------------------------------------------------------- */

.qg-page {
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--qg-bg);
}

.qg-content {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 24px;
}

.qg-page-title {
    margin: 0;
    color: var(--qg-text);
    font-size: clamp(1.35rem, 2vw, 1.8rem);
    font-weight: 750;
    letter-spacing: -0.025em;
    line-height: 1.2;
}

.qg-page-subtitle {
    margin: 6px 0 0;
    color: var(--qg-text-muted);
    font-size: 0.92rem;
    line-height: 1.5;
}

.qg-section-title {
    margin: 0 0 14px;
    color: var(--qg-text);
    font-size: 1.08rem;
    font-weight: 700;
}

.qg-card {
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-lg);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-sm);
}

.qg-card-header {
    padding: 18px 20px;
    border-bottom: 1px solid var(--qg-border);
}

.qg-card-body {
    padding: 20px;
}

.qg-card-footer {
    padding: 15px 20px;
    border-top: 1px solid var(--qg-border);
    background: var(--qg-surface-soft);
}

.qg-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 18px;
}

.qg-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.qg-divider {
    height: 1px;
    margin: 18px 0;
    border: 0;
    background: var(--qg-border);
}

.qg-text-muted {
    color: var(--qg-text-muted) !important;
}

.qg-text-success {
    color: var(--qg-success) !important;
}

.qg-text-danger {
    color: var(--qg-danger) !important;
}

/* --------------------------------------------------------------------------
   Encabezado y menú principal
   -------------------------------------------------------------------------- */

.qg-app-header {
    position: sticky;
    z-index: 100;
    top: 0;
    display: flex;
    align-items: center;
    min-height: var(--qg-header-height);
    padding: 0 20px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.10);
    color: #fff;
    background: linear-gradient(110deg, var(--qg-primary-800), var(--qg-primary));
    box-shadow: 0 5px 18px rgba(9, 51, 39, 0.16);
}

.qg-brand {
    display: flex;
    align-items: center;
    gap: 11px;
    color: #fff;
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: -0.035em;
}

.qg-sidebar {
    width: var(--qg-sidebar-width);
    min-height: calc(100vh - var(--qg-header-height));
    min-height: calc(100dvh - var(--qg-header-height));
    padding: 16px 12px;
    border-right: 1px solid var(--qg-border);
    background: var(--qg-surface);
}

.qg-sidebar .z-button,
.qg-menu-item {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    min-height: 43px;
    margin: 3px 0;
    padding: 0 13px;
    border: 0;
    border-radius: 10px;
    color: var(--qg-text-secondary);
    background: transparent;
    box-shadow: none;
    font-weight: 600;
    text-align: left;
}

.qg-sidebar .z-button:hover,
.qg-menu-item:hover {
    color: var(--qg-primary-700);
    background: var(--qg-accent-soft);
}

.qg-sidebar .z-button.qg-menu-active,
.qg-menu-item.qg-menu-active {
    color: #fff;
    background: linear-gradient(135deg, var(--qg-primary), var(--qg-primary-700));
    box-shadow: 0 7px 16px rgba(23, 107, 85, 0.21);
}

/* Menubar Iceblue */
.z-menubar {
    padding: 4px;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
}

.z-menu-content,
.z-menuitem-content {
    padding: 9px 12px;
    border-radius: 8px;
    color: var(--qg-text-secondary);
    font-weight: 600;
}

.z-menu-hover > .z-menu-content,
.z-menuitem-hover > .z-menuitem-content,
.z-menu-content:hover,
.z-menuitem-content:hover {
    color: var(--qg-primary-700);
    background: var(--qg-accent-soft);
}

.z-menupopup {
    padding: 6px;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-md);
}

/* --------------------------------------------------------------------------
   Botones ZK
   -------------------------------------------------------------------------- */

.z-button {
    min-height: 38px;
    padding: 8px 15px;
    border: 1px solid var(--qg-border-strong);
    border-radius: var(--qg-radius-sm);
    outline: none;
    color: var(--qg-text-secondary);
    background: var(--qg-surface);
    box-shadow: 0 1px 2px rgba(16, 50, 39, 0.05);
    font-family: var(--qg-font);
    font-size: 0.9rem;
    font-weight: 650;
    line-height: 1.2;
    text-shadow: none;
    transition: border-color var(--qg-transition), color var(--qg-transition),
                background var(--qg-transition), box-shadow var(--qg-transition),
                transform var(--qg-transition);
}

.z-button:hover {
    border-color: #9abbb0;
    color: var(--qg-primary-700);
    background: var(--qg-surface-soft);
    box-shadow: var(--qg-shadow-sm);
}

.z-button:focus,
.z-button:focus-visible {
    border-color: var(--qg-accent);
    box-shadow: var(--qg-focus);
}

.z-button:active {
    box-shadow: none;
    transform: translateY(1px);
}

.z-button[disabled],
.z-button.z-button-disabled {
    border-color: var(--qg-border);
    color: var(--qg-disabled);
    background: #eef2f0;
    box-shadow: none;
    cursor: not-allowed;
    opacity: 0.72;
}

.qg-btn-primary.z-button,
.z-button.qg-btn-primary {
    border-color: var(--qg-primary);
    color: #fff;
    background: linear-gradient(135deg, var(--qg-primary), var(--qg-primary-700));
    box-shadow: 0 7px 16px rgba(23, 107, 85, 0.22);
}

.qg-btn-primary.z-button:hover,
.z-button.qg-btn-primary:hover {
    border-color: var(--qg-primary-700);
    color: #fff;
    background: linear-gradient(135deg, var(--qg-primary-600), var(--qg-primary-800));
}

.qg-btn-danger.z-button,
.z-button.qg-btn-danger {
    border-color: var(--qg-danger);
    color: #fff;
    background: var(--qg-danger);
}

.qg-btn-success.z-button,
.z-button.qg-btn-success {
    border-color: var(--qg-success);
    color: #fff;
    background: var(--qg-success);
}

.qg-btn-ghost.z-button,
.z-button.qg-btn-ghost {
    border-color: transparent;
    color: var(--qg-primary);
    background: transparent;
    box-shadow: none;
}

.qg-btn-icon.z-button,
.z-button.qg-btn-icon {
    display: inline-grid;
    width: 40px;
    min-width: 40px;
    height: 40px;
    min-height: 40px;
    padding: 0;
    place-items: center;
}

/* --------------------------------------------------------------------------
   Campos de formulario
   -------------------------------------------------------------------------- */

.z-textbox,
.z-decimalbox,
.z-doublebox,
.z-intbox,
.z-longbox,
.z-datebox-input,
.z-timebox-input,
.z-combobox-input,
.z-bandbox-input,
.z-spinner-input,
.z-doublespinner-input {
    min-height: 40px;
    padding: 8px 11px;
    border: 1px solid var(--qg-border-strong);
    border-radius: var(--qg-radius-sm);
    outline: none;
    color: var(--qg-text);
    background: var(--qg-surface);
    font-family: var(--qg-font);
    font-size: 0.92rem;
    box-shadow: none;
    transition: border-color var(--qg-transition), box-shadow var(--qg-transition),
                background var(--qg-transition);
}

.z-textbox:hover,
.z-decimalbox:hover,
.z-doublebox:hover,
.z-intbox:hover,
.z-longbox:hover,
.z-datebox-input:hover,
.z-timebox-input:hover,
.z-combobox-input:hover,
.z-bandbox-input:hover {
    border-color: #9ebcb1;
}

.z-textbox:focus,
.z-decimalbox:focus,
.z-doublebox:focus,
.z-intbox:focus,
.z-longbox:focus,
.z-datebox-input:focus,
.z-timebox-input:focus,
.z-combobox-input:focus,
.z-bandbox-input:focus,
.z-spinner-input:focus,
.z-doublespinner-input:focus {
    border-color: var(--qg-accent);
    background: #fff;
    box-shadow: var(--qg-focus);
}

.z-textbox[disabled],
.z-textbox[readonly],
.z-combobox-input[disabled],
.z-datebox-input[disabled] {
    color: var(--qg-text-muted);
    background: #eef3f1;
}

.z-textbox::placeholder,
.z-combobox-input::placeholder {
    color: #9ba9a3;
}

.z-combobox-button,
.z-bandbox-button,
.z-datebox-button,
.z-timebox-button,
.z-spinner-button,
.z-doublespinner-button {
    border-color: var(--qg-border-strong);
    color: var(--qg-primary);
    background: var(--qg-surface-soft);
}

.z-combobox-button:hover,
.z-bandbox-button:hover,
.z-datebox-button:hover,
.z-timebox-button:hover {
    color: #fff;
    background: var(--qg-primary);
}

.z-combobox-popup,
.z-bandbox-popup,
.z-datebox-popup {
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-md);
}

.z-comboitem {
    padding: 9px 11px;
    border-radius: 7px;
    color: var(--qg-text-secondary);
}

.z-comboitem:hover,
.z-comboitem-selected {
    color: var(--qg-primary-700);
    background: var(--qg-accent-soft);
}

.z-label {
    color: inherit;
    font-family: var(--qg-font);
}

.qg-form-label,
.qg-form-label.z-label {
    display: inline-block;
    margin-bottom: 6px;
    color: var(--qg-text-secondary);
    font-size: 0.84rem;
    font-weight: 700;
}

.z-checkbox-content,
.z-radio-content {
    color: var(--qg-text-secondary);
    font-family: var(--qg-font);
}

.z-checkbox-switch-on > .z-checkbox-mold,
.z-checkbox-switch-on .z-checkbox-mold {
    border-color: var(--qg-primary);
    background: var(--qg-primary);
}

/* Validación */
.z-errorbox {
    border: 1px solid #f1aeb6;
    border-radius: var(--qg-radius-md);
    color: var(--qg-danger);
    background: var(--qg-danger-soft);
    box-shadow: var(--qg-shadow-md);
}

.z-errorbox-content {
    color: var(--qg-danger);
    font-family: var(--qg-font);
    font-weight: 600;
}

/* --------------------------------------------------------------------------
   Grid, Listbox y Tree
   -------------------------------------------------------------------------- */

.z-grid,
.z-listbox,
.z-tree {
    overflow: hidden;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-sm);
}

.z-grid-header,
.z-listbox-header,
.z-tree-header {
    border-bottom: 1px solid var(--qg-border);
    background: #edf4f1;
}

.z-column,
.z-listheader,
.z-treecol {
    min-height: 42px;
    border-color: var(--qg-border);
    background: #edf4f1;
}

.z-column-content,
.z-listheader-content,
.z-treecol-content {
    padding: 11px 12px;
    color: #344840;
    font-family: var(--qg-font);
    font-size: 0.78rem;
    font-weight: 750;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}

.z-row,
.z-listitem,
.z-treeitem {
    border-color: var(--qg-border);
    background: var(--qg-surface);
    transition: background var(--qg-transition);
}

.z-row:nth-child(even),
.z-listitem:nth-child(even),
.z-treeitem:nth-child(even) {
    background: #fbfdfc;
}

.z-row:hover,
.z-listitem:hover,
.z-treeitem:hover {
    background: #eef8f4;
}

.z-listitem-selected,
.z-row-selected,
.z-treeitem-selected {
    color: var(--qg-primary-700);
    background: var(--qg-accent-soft) !important;
}

.z-cell,
.z-listcell,
.z-treecell {
    border-color: var(--qg-border);
}

.z-cell-content,
.z-listcell-content,
.z-treecell-content {
    padding: 11px 12px;
    color: var(--qg-text-secondary);
    font-family: var(--qg-font);
    line-height: 1.4;
}

.z-grid-emptybody td,
.z-listbox-emptybody td {
    padding: 34px 16px;
    color: var(--qg-text-muted);
    text-align: center;
}

.z-grid-paging-bottom,
.z-listbox-paging-bottom {
    border-top: 1px solid var(--qg-border);
    background: var(--qg-surface-soft);
}

/* Paging */
.z-paging {
    padding: 9px 11px;
    border: 0;
    background: transparent;
}

.z-paging-button {
    border: 1px solid transparent;
    border-radius: 7px;
    color: var(--qg-text-secondary);
    background: transparent;
}

.z-paging-button:hover {
    border-color: var(--qg-border);
    color: var(--qg-primary);
    background: var(--qg-surface);
}

.z-paging-selected {
    color: #fff;
    background: var(--qg-primary);
}

/* --------------------------------------------------------------------------
   Window, Panel, Groupbox y Popup
   -------------------------------------------------------------------------- */

.z-window {
    overflow: hidden;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-lg);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-lg);
}

.z-window-header {
    min-height: 49px;
    padding: 15px 18px;
    border-bottom: 1px solid var(--qg-border);
    color: var(--qg-text);
    background: var(--qg-surface);
    font-family: var(--qg-font);
    font-size: 1rem;
    font-weight: 750;
}

.z-window-content {
    padding: 20px;
    background: var(--qg-surface);
}

.z-window-close,
.z-window-maximize,
.z-window-minimize {
    border-radius: 7px;
    color: var(--qg-text-muted);
}

.z-window-close:hover,
.z-window-maximize:hover,
.z-window-minimize:hover {
    color: var(--qg-primary);
    background: var(--qg-accent-soft);
}

.z-modal-mask {
    background: rgba(7, 29, 22, 0.48);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}

.z-panel,
.z-groupbox {
    overflow: hidden;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-sm);
}

.z-panel-head,
.z-groupbox-header {
    border-bottom: 1px solid var(--qg-border);
    background: var(--qg-surface-soft);
}

.z-panel-header,
.z-groupbox-title-content {
    padding: 12px 15px;
    color: var(--qg-text);
    font-family: var(--qg-font);
    font-weight: 700;
}

.z-panelchildren,
.z-groupbox-content {
    padding: 16px;
    border: 0;
    background: var(--qg-surface);
}

.z-popup {
    overflow: hidden;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-md);
}

.z-popup-content {
    padding: 12px;
}

/* --------------------------------------------------------------------------
   Tabs y Accordion
   -------------------------------------------------------------------------- */

.z-tabbox {
    border-color: var(--qg-border);
}

.z-tabs {
    border-bottom: 1px solid var(--qg-border);
    background: transparent;
}

.z-tab {
    border: 0;
    background: transparent;
}

.z-tab-content {
    padding: 11px 15px;
    border-bottom: 3px solid transparent;
    color: var(--qg-text-muted);
    font-family: var(--qg-font);
    font-weight: 650;
}

.z-tab:hover .z-tab-content {
    color: var(--qg-primary);
    background: var(--qg-accent-soft);
}

.z-tab-selected .z-tab-content {
    border-bottom-color: var(--qg-primary);
    color: var(--qg-primary-700);
    background: transparent;
}

.z-tabpanels,
.z-tabpanel {
    border-color: var(--qg-border);
    background: var(--qg-surface);
}

.z-tabpanel {
    padding: 18px;
}

/* --------------------------------------------------------------------------
   Calendario
   -------------------------------------------------------------------------- */

.z-calendar {
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-md);
}

.z-calendar-header {
    color: var(--qg-text);
    background: var(--qg-surface-soft);
}

.z-calendar-title {
    font-weight: 700;
}

.z-calendar-cell {
    border-radius: 7px;
    color: var(--qg-text-secondary);
}

.z-calendar-cell:hover {
    color: var(--qg-primary-700);
    background: var(--qg-accent-soft);
}

.z-calendar-selected {
    color: #fff !important;
    background: var(--qg-primary) !important;
}

.z-calendar-today {
    color: var(--qg-primary);
    font-weight: 800;
}

/* --------------------------------------------------------------------------
   Mensajes, badges y estados
   -------------------------------------------------------------------------- */

.qg-alert {
    padding: 12px 14px;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    font-size: 0.9rem;
    line-height: 1.45;
}

.qg-alert-success {
    border-color: #bce6d5;
    color: #0d6849;
    background: var(--qg-success-soft);
}

.qg-alert-warning {
    border-color: #f0d79d;
    color: #82520d;
    background: var(--qg-warning-soft);
}

.qg-alert-danger {
    border-color: #f2bdc3;
    color: #9c2634;
    background: var(--qg-danger-soft);
}

.qg-alert-info {
    border-color: #bcddee;
    color: #165b82;
    background: var(--qg-info-soft);
}

.qg-badge {
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 3px 9px;
    border-radius: 999px;
    color: var(--qg-text-secondary);
    background: #eaf0ed;
    font-size: 0.73rem;
    font-weight: 750;
    letter-spacing: 0.02em;
}

.qg-badge-success {
    color: #0d6849;
    background: var(--qg-success-soft);
}

.qg-badge-warning {
    color: #82520d;
    background: var(--qg-warning-soft);
}

.qg-badge-danger {
    color: #9c2634;
    background: var(--qg-danger-soft);
}

.qg-badge-info {
    color: #165b82;
    background: var(--qg-info-soft);
}

.z-notification {
    overflow: hidden;
    border: 1px solid var(--qg-border);
    border-radius: var(--qg-radius-md);
    color: var(--qg-text);
    background: var(--qg-surface);
    box-shadow: var(--qg-shadow-md);
}

.z-notification-content {
    padding: 13px 15px;
    font-family: var(--qg-font);
    line-height: 1.45;
}

/* Resultado principal de garita */
.qg-access-result {
    display: grid;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 24px;
    color: #fff;
    place-items: center;
    text-align: center;
}

.qg-access-authorized {
    background: linear-gradient(145deg, #087443, #16a66c);
}

.qg-access-denied {
    background: linear-gradient(145deg, #9d2634, #d84a58);
}

/* --------------------------------------------------------------------------
   Busy / Loading
   -------------------------------------------------------------------------- */

.z-loading {
    padding: 14px 17px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: var(--qg-radius-md);
    color: #fff;
    background: rgba(10, 61, 48, 0.94);
    box-shadow: var(--qg-shadow-md);
    backdrop-filter: blur(8px);
}

.z-loading-indicator {
    color: #fff;
    font-family: var(--qg-font);
    font-weight: 650;
}

.z-apply-loading-indicator {
    color: var(--qg-primary);
}

/* --------------------------------------------------------------------------
   Responsive: laptop, tablet y móvil/PWA
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
    :root {
        --qg-sidebar-width: 220px;
    }

    .qg-content {
        padding: 20px;
    }
}

@media (max-width: 767px) {
    :root {
        --qg-header-height: 56px;
    }

    body,
    .z-page {
        font-size: 14px;
    }

    .qg-content {
        padding: 14px;
    }

    .qg-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .qg-toolbar-actions {
        width: 100%;
    }

    .qg-toolbar-actions > .z-button {
        flex: 1 1 auto;
    }

    .qg-sidebar {
        position: fixed;
        z-index: 500;
        top: var(--qg-header-height);
        bottom: 0;
        left: 0;
        width: min(86vw, 300px);
        box-shadow: var(--qg-shadow-lg);
    }

    .qg-card-header,
    .qg-card-body,
    .qg-card-footer {
        padding-right: 15px;
        padding-left: 15px;
    }

    .z-window {
        max-width: calc(100vw - 20px) !important;
        border-radius: var(--qg-radius-md);
    }

    .z-window-content {
        padding: 15px;
    }

    .z-button {
        min-height: 43px;
    }

    .z-textbox,
    .z-decimalbox,
    .z-doublebox,
    .z-intbox,
    .z-longbox,
    .z-datebox-input,
    .z-timebox-input,
    .z-combobox-input,
    .z-bandbox-input,
    .z-spinner-input,
    .z-doublespinner-input {
        min-height: 44px;
        font-size: 16px;
    }

    .z-column-content,
    .z-listheader-content,
    .z-treecol-content,
    .z-cell-content,
    .z-listcell-content,
    .z-treecell-content {
        padding-right: 9px;
        padding-left: 9px;
    }

    .qg-mobile-full {
        width: 100% !important;
    }

    .qg-mobile-hidden {
        display: none !important;
    }
}

@media (max-width: 480px) {
    .qg-content {
        padding: 11px;
    }

    .qg-card {
        border-radius: var(--qg-radius-md);
    }

    .qg-page-title {
        font-size: 1.35rem;
    }

    .qg-access-result {
        padding: max(18px, env(safe-area-inset-top))
                 max(14px, env(safe-area-inset-right))
                 max(18px, env(safe-area-inset-bottom))
                 max(14px, env(safe-area-inset-left));
    }
}

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

@media print {
    .qg-app-header,
    .qg-sidebar,
    .qg-no-print,
    .z-button {
        display: none !important;
    }

    body,
    .z-page,
    .qg-page,
    .qg-content {
        padding: 0;
        color: #000;
        background: #fff;
    }

    .qg-card,
    .z-grid,
    .z-listbox {
        border-color: #bbb;
        box-shadow: none;
    }
}


.qg-access-title {
    display: block;
    width: 100%;
    box-sizing: border-box;
    color: #fff;
    font-size: clamp(28px, 9vw, 42px);
    font-weight: 800;
    line-height: 1.15;
    text-align: center;
    white-space: nowrap;
}