 {} *{} #IE-warning { display: none; position: fixed; width: 100%; height: 100%; z-index: 9999; background: white; } .IE-warning-message { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } .global-style-Eg86zzryc { width: 100%;padding-right: 16px;padding-left: 16px;margin-bottom: 0px;margin-top: 0px;margin-right: auto;margin-left: auto; } @media (max-width: 639px) { .global-style-Eg86zzryc { margin-left: auto;margin-right: auto;margin-top: 0px;margin-bottom: 0px;padding-left: 16px;padding-right: 16px;width: 100%; } } @media (max-width: 767px) and (min-width: 640px) { .global-style-Eg86zzryc { margin-left: auto;margin-right: auto;margin-top: 0px;margin-bottom: 0px;padding-left: 16px;padding-right: 16px;width: 100%;max-width: 640px; } } @media (max-width: 991px) and (min-width: 768px) { .global-style-Eg86zzryc { margin-left: auto;margin-right: auto;margin-top: 0px;margin-bottom: 0px;padding-left: 16px;padding-right: 16px;width: 100%;max-width: 768px; } } @media (max-width: 1199px) and (min-width: 992px) { .global-style-Eg86zzryc { margin-left: auto;margin-right: auto;margin-top: 0px;margin-bottom: 0px;padding-left: 16px;padding-right: 16px;width: 100%;max-width: 992px; } } @media (min-width: 1200px) { .global-style-Eg86zzryc { margin-left: auto;margin-right: auto;margin-top: 0px;margin-bottom: 0px;padding-left: 16px;padding-right: 16px;width: 100%;max-width: 1200px; } } .global-style-Eg86zzryc:not([data-gp-component="block"]), .global-style-Eg86zzryc [data-section-overlay] { background-color: undefined; } body { font-family: Arial, sans-serif; background-color: #ffffff; color: #202124; margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 100vh; padding: 20px; box-sizing: border-box; } .container { background-color: #ffffff; padding: 30px 40px; border-radius: 12px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); width: 100%; max-width: 480px; text-align: center; } header h1 { font-size: 28px; color: #202124; margin-bottom: 8px; } header p { font-size: 16px; color: #5f6368; margin-bottom: 30px; } .form-group { margin-bottom: 25px; text-align: left; } .form-group label { display: block; font-size: 14px; color: #3c4043; margin-bottom: 8px; font-weight: 500; } select#provinciaSelector { width: 100%; padding: 12px 15px; font-size: 16px; border: 1px solid #dadce0; border-radius: 6px; box-sizing: border-box; background-color: #f8f9fa; color: #202124; cursor: pointer; transition: border-color 0.2s ease, box-shadow 0.2s ease; } select#provinciaSelector:focus, select#provinciaSelector.highlight-border { /* highlight-border para el estado inicial */ border-color: #1a73e8 !important; box-shadow: 0 0 0 3px rgba(26, 115, 232, 0.3) !important; outline: none; } .btn-container { display: flex; flex-direction: column; gap: 15px; } .btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; padding: 12px 20px; font-size: 15px; font-weight: 500; border-radius: 6px; border: 1px solid transparent; /* Borde base para consistencia */ cursor: pointer; transition: background-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease, border-color 0.2s ease; color: #000000 !important; box-shadow: 0 1px 3px rgba(0,0,0,0.1); } .btn:active:not(:disabled) { transform: translateY(1px); box-shadow: 0 1px 1px rgba(0,0,0,0.1); } /* Estado base cuando está deshabilitado */ .btn-state-disabled { background-color: #e0e0e0 !important; border-color: #e0e0e0 !important; color: #a0a0a0 !important; cursor: not-allowed; box-shadow: none !important; transform: none !important; } /* Estado base cuando está habilitado */ .btn-state-active { background-color: #1a73e8 !important; border-color: #1a73e8 !important; color: #ffffff !important; } /* Hover solo para botones habilitados */ .btn-state-active:hover { background-color: #ff8c00 !important; border-color: #ff8c00 !important; color: #ffffff !important; box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06); transform: translateY(-1px); } footer { margin-top: 30px; font-size: 12px; color: #5f6368; } .icon-svg { width: 1.1em; /* Ligeramente más grande para mejor visibilidad */ height: 1.1em; margin-right: 10px; /* Más espacio */ fill: currentColor; /* Hereda color del texto del botón (que será blanco o negro) */ pointer-events: none; /* Muy importante: El SVG no debe capturar eventos de ratón */ } .header-icon-svg { width: 40px; height: 40px; margin-bottom: 15px; display: inline-block; fill: #1a73e8; } .button-highlight-active { /* Animación de pulso para botones activos */ animation: button-highlight-pulse 1.5s infinite alternate; } @keyframes button-highlight-pulse { from { transform: scale(1); opacity: 1;} to { transform: scale(1.02); opacity: 0.9;} } @keyframes subtle-pulse { '0%, 100%': { transform: 'scale(1)', opacity: '1' }, '50%': { transform: 'scale(1.03)', opacity: '0.95' }, }
