.geo-ui-dialog {
    width: min(460px, calc(100vw - 28px));
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: 20px;
    color: #12262d;
    background: transparent;
    box-shadow: 0 28px 90px rgba(8, 27, 34, .28);
}
.geo-ui-dialog::backdrop {
    background: rgba(10, 24, 30, .52);
    -webkit-backdrop-filter: blur(5px);
    backdrop-filter: blur(5px);
}
.geo-ui-dialog-shell {
    overflow: hidden;
    border: 1px solid rgba(211, 224, 227, .96);
    border-radius: inherit;
    background: #fff;
}
.geo-ui-dialog-header {
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr) 36px;
    gap: 13px;
    align-items: center;
    padding: 20px 20px 16px;
    border-bottom: 1px solid #e1e8ea;
    background: linear-gradient(180deg, #fff 0%, #fbfdfd 100%);
}
.geo-ui-dialog-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 15px;
    color: #8b5a10;
    background: #fff3d8;
    font-size: 22px;
    font-weight: 900;
}
.geo-ui-dialog[data-variant="danger"] .geo-ui-dialog-icon { color: #a92727; background: #fde8e8; }
.geo-ui-dialog[data-variant="success"] .geo-ui-dialog-icon { color: #0f6b57; background: #e0f4ed; }
.geo-ui-dialog[data-variant="info"] .geo-ui-dialog-icon { color: #176c87; background: #e2f3f8; }
.geo-ui-dialog-heading { min-width: 0; }
.geo-ui-dialog-eyebrow {
    display: block;
    margin-bottom: 3px;
    color: #6a7d84;
    font-size: 9px;
    font-weight: 850;
    letter-spacing: .13em;
}
.geo-ui-dialog h2 {
    margin: 0;
    overflow-wrap: anywhere;
    font-size: 18px;
    line-height: 1.2;
    letter-spacing: -.02em;
}
.geo-ui-dialog-close {
    display: grid;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid #d8e2e4;
    border-radius: 11px;
    color: #50666e;
    background: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.geo-ui-dialog-close:hover { color: #183b42; border-color: #aabec3; background: #f6f9fa; }
.geo-ui-dialog-body { padding: 20px; }
.geo-ui-dialog-message {
    margin: 0;
    color: #263d45;
    font-size: 14px;
    line-height: 1.55;
    white-space: pre-line;
}
.geo-ui-dialog-detail {
    margin: 12px 0 0;
    padding: 11px 12px;
    border: 1px solid #e0e8ea;
    border-radius: 12px;
    color: #63767d;
    background: #f7f9fa;
    font-size: 12px;
    line-height: 1.5;
    white-space: pre-line;
}
.geo-ui-dialog-input-wrap { display: grid; gap: 7px; margin-top: 16px; }
.geo-ui-dialog-input-label { color: #536a72; font-size: 11px; font-weight: 800; }
.geo-ui-dialog-input {
    width: 100%;
    min-height: 46px;
    padding: 10px 13px;
    border: 1px solid #c9d6da;
    border-radius: 12px;
    color: #12262d;
    background: #fff;
    font: inherit;
    font-size: 14px;
    outline: 0;
}
.geo-ui-dialog-input:focus { border-color: #147565; box-shadow: 0 0 0 3px rgba(20, 117, 101, .14); }
.geo-ui-dialog-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    padding: 15px 20px;
    border-top: 1px solid #e1e8ea;
    background: #f7faf9;
}
.geo-ui-dialog-button {
    min-height: 42px;
    padding: 0 17px;
    border: 1px solid #cbd8db;
    border-radius: 11px;
    color: #24454c;
    background: #fff;
    font: inherit;
    font-size: 12px;
    font-weight: 850;
    cursor: pointer;
}
.geo-ui-dialog-button:hover { border-color: #9fb6bb; background: #f8fbfb; }
.geo-ui-dialog-confirm { color: #fff; border-color: #147565; background: #147565; }
.geo-ui-dialog-confirm:hover { border-color: #0f5f53; background: #0f5f53; }
.geo-ui-dialog[data-variant="danger"] .geo-ui-dialog-confirm { border-color: #b53434; background: #b53434; }
.geo-ui-dialog[data-variant="danger"] .geo-ui-dialog-confirm:hover { border-color: #912828; background: #912828; }
.geo-ui-dialog-button:focus-visible,
.geo-ui-dialog-close:focus-visible,
.geo-ui-dialog-input:focus-visible { outline: 3px solid rgba(20, 117, 101, .2); outline-offset: 2px; }
@media (max-width: 560px) {
    .geo-ui-dialog { width: calc(100vw - 18px); border-radius: 17px; }
    .geo-ui-dialog-header { grid-template-columns: 42px minmax(0, 1fr) 34px; padding: 17px 16px 14px; }
    .geo-ui-dialog-icon { width: 42px; height: 42px; border-radius: 13px; }
    .geo-ui-dialog-body { padding: 17px 16px; }
    .geo-ui-dialog-actions { display: grid; grid-template-columns: 1fr 1fr; padding: 13px 16px max(13px, env(safe-area-inset-bottom)); }
    .geo-ui-dialog-actions .geo-ui-dialog-button:only-child { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: no-preference) {
    .geo-ui-dialog[open] { animation: geo-ui-dialog-in .16s ease-out both; }
    .geo-ui-dialog[open]::backdrop { animation: geo-ui-backdrop-in .16s ease-out both; }
    @keyframes geo-ui-dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } }
    @keyframes geo-ui-backdrop-in { from { opacity: 0; } }
}

/* El campo de texto solo pertenece a los diálogos de tipo prompt. La regla
   de arriba le pone display:grid, que pisaba al atributo [hidden] del
   navegador y hacía que el recuadro "Valor" apareciera también en los
   diálogos de confirmación. */
.geo-ui-dialog-input-wrap[hidden] { display: none; }
