.hotspot-login-container{--hotspot-primary:var(--soft-blue-dark,#4a7ba7);--hotspot-primary-dark:var(--soft-blue,#6b9bd1);--hotspot-bg:var(--white,#fff);--hotspot-bg-light:var(--white,#fff);--hotspot-bg-card:var(--gray-50,#fafafa);--hotspot-text:var(--gray-900,#212121);--hotspot-text-muted:var(--gray-600,#757575);--hotspot-border:var(--gray-200,#eee);--hotspot-error:var(--accent-coral,#ff8a80);--hotspot-success:var(--accent-teal,#4db6ac);background:var(--hotspot-bg-card,var(--hotspot-bg,var(--white)));width:100%;max-width:600px;color:var(--hotspot-text,var(--gray-900));z-index:20;border-radius:8px;flex-direction:column;align-items:center;margin:0 auto;padding:32px 24px;scroll-margin-top:0;scroll-padding-top:0;display:flex;position:relative;overflow:visible}@media (min-width:769px){.hotspot-login-container{flex-direction:column;align-items:center;max-width:600px;min-height:auto;margin:40px auto;padding:40px;display:flex}}@media (max-width:768px){.hotspot-login-container{height:688px;min-height:100vh;padding:89px 9px 50vh}.form-group{margin-bottom:24px}.form-group input:focus,.form-group textarea:focus,.form-group select:focus{z-index:10;scroll-margin-top:25vh;scroll-margin-bottom:40vh;position:relative}.form-group input:focus~*,.form-group textarea:focus~*,.form-group select:focus~*{margin-top:0}:is(.form-group:has(input:focus),.form-group:has(textarea:focus),.form-group:has(select:focus)){scroll-margin-top:20vh;scroll-margin-bottom:35vh}}.hotspot-login-container input:focus,.hotspot-login-container textarea:focus,.hotspot-login-container select:focus{scroll-margin-top:0;scroll-padding-top:0}.header{text-align:center;box-sizing:border-box;z-index:1;isolation:isolate;flex-direction:column;justify-content:flex-start;align-items:center;width:100%;min-height:120px;margin-bottom:42px;padding:0;display:flex;position:relative}.header h1{color:var(--hotspot-primary,var(--soft-blue-dark));margin-bottom:8px;font-size:24px;font-weight:600}.header p{color:var(--hotspot-text-muted,var(--gray-600));font-size:14px}.interface-name{background:var(--hotspot-primary,var(--soft-blue-light));border-radius:var(--radius-sm);color:var(--hotspot-bg,var(--white));margin-top:-4px;padding:6px 12px;font-size:13px;font-weight:500;display:inline-block}.wifi-connect-text{text-align:center;color:var(--hotspot-text-muted,var(--gray-600));margin-top:0;margin-bottom:0;font-size:18px;font-weight:400}@media (max-width:768px){.wifi-connect-text{font-size:20px}}.interface-name-bold{color:var(--hotspot-primary,var(--soft-blue-dark));font-style:italic;font-weight:700}.form-group{z-index:0;margin-bottom:20px;position:relative}.form-row{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:20px;display:grid}.form-row .form-group{margin-bottom:0}.form-group label{color:var(--hotspot-text,var(--gray-700));margin-bottom:8px;font-size:14px;font-weight:500;display:block}.form-group input,.form-group select{background:var(--hotspot-bg-card,var(--white));border:1px solid var(--hotspot-border,var(--gray-300));border-radius:var(--radius-sm);width:100%;color:var(--hotspot-text,var(--gray-900));z-index:0;box-sizing:border-box;padding:12px 16px;font-size:15px;transition:all .2s;position:relative}.form-group input[readonly],.form-group select[readonly],.form-group textarea[readonly]{cursor:default;opacity:.8}.form-group input[disabled]:focus,.form-group input[readonly]:focus,.form-group select[disabled]:focus,.form-group textarea[disabled]:focus,.form-group input[tabindex="-1"]:focus,.form-group select[tabindex="-1"]:focus,.form-group textarea[tabindex="-1"]:focus{box-shadow:none!important;caret-color:#0000!important;outline:none!important}.form-group input:focus,.form-group select:focus{border-color:var(--hotspot-primary,var(--soft-blue));outline:none;box-shadow:0 0 0 3px #6b9dd11a}.form-group input:disabled,.form-group select:disabled{background-color:var(--gray-100);pointer-events:auto;cursor:not-allowed;opacity:.6}.form-group input::placeholder{color:var(--hotspot-text-muted,#666)}.optional-badge{color:var(--text-muted);margin-left:6px;font-size:11px;font-weight:400;display:inline-block}.btn{background:var(--hotspot-primary,var(--soft-blue-dark));width:100%;color:var(--hotspot-bg,white);border-radius:var(--radius-sm);cursor:pointer;border:none;margin-top:8px;padding:14px;font-size:16px;font-weight:600;transition:all .2s}.btn:hover{background:var(--hotspot-primary-dark,var(--soft-blue));box-shadow:var(--shadow-medium);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.error-message{letter-spacing:-.01em;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:12px;max-width:600px;margin:24px auto;padding:20px 24px;font-size:15px;font-weight:500;line-height:1.5;display:none;position:relative;overflow:hidden;box-shadow:0 1px 3px #0000000d,0 4px 12px #dc262614;color:#7f1d1d!important;background:#fef2f2!important;border:1px solid #fecdd3!important}.error-message:before{content:"";opacity:.6;background:linear-gradient(90deg,#fca5a5,#f87171,#fca5a5) 0 0/200% 100%;height:3px;animation:3s infinite shimmer;position:absolute;top:0;left:0;right:0}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.error-message.show{flex-direction:column;align-items:center;gap:12px;animation:.3s ease-out slideIn;display:flex}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.error-message .user-friendly-error{text-align:left;align-items:center;gap:12px;width:100%;font-weight:600;display:flex}.error-message .error-icon{color:#dc2626;opacity:.9;flex-shrink:0;width:22px;height:22px}.error-message .technical-error{color:#94a3b8;opacity:.7;border-top:1px solid #dc26261a;width:100%;margin-top:8px;padding-top:12px;font-family:Monaco,Menlo,Courier New,monospace;font-size:12px}.loading{text-align:center;color:var(--text-muted);padding:20px;display:none}.loading.show{display:block}.loading-message{text-align:center;color:var(--hotspot-text-muted,var(--gray-600,#757575));margin:16px 0;padding:16px 20px;font-size:14px}.loading-text{color:var(--hotspot-text-muted,var(--gray-600,#757575));margin:0;font-weight:400}.hotspot-loading-screen{background:var(--hotspot-bg,#fff);z-index:9999;justify-content:center;align-items:center;animation:.3s ease-in fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hotspot-loading-content{flex-direction:column;align-items:center;gap:32px;display:flex}.hotspot-loading-logo{justify-content:center;align-items:center;width:200px;height:80px;display:flex;position:relative}.hotspot-loading-logo-img{object-fit:contain;width:auto;max-width:200px;height:auto;max-height:80px;animation:2s ease-in-out infinite logoPulse}.hotspot-loading-flag{justify-content:center;align-items:center;animation:2s ease-in-out infinite logoPulse;display:flex}@keyframes logoPulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.9;transform:scale(1.05)}}.hotspot-loading-spinner{width:60px;height:60px;position:relative}.hotspot-spinner-ring{border:4px solid #4a7ba733;border-top-color:var(--hotspot-primary,#4a7ba7);border-radius:50%;width:60px;height:60px;animation:1s linear infinite spin;position:absolute}@keyframes spin{to{transform:rotate(360deg)}}.hotspot-page-enter{animation:.5s ease-out pageSlideIn}@keyframes pageSlideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.form-container{opacity:0;z-index:0;clear:both;isolation:isolate;border-top:none;width:100%;max-width:100%;margin:0 auto;padding-top:0;transition:opacity .3s ease-in-out;display:none;position:relative}.form-container.active{opacity:1;display:block}.form-type-tabs{margin-bottom:24px}.tabs-container{background:var(--hotspot-bg-light,var(--gray-50,#f5f5f5));border-radius:12px;gap:6px;padding:6px;display:flex;overflow:hidden}.tab-button{border:1px solid var(--hotspot-border,var(--gray-200,#e5e5e5));color:var(--hotspot-text-muted,var(--gray-600));cursor:pointer;white-space:nowrap;text-align:center;background:#ffffff80;border-radius:8px;flex:1;justify-content:center;align-items:center;min-height:44px;padding:12px 16px;font-size:14px;font-weight:500;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.tab-button:before{content:"";background:var(--hotspot-primary,var(--soft-blue-dark));opacity:0;z-index:0;border-radius:8px;transition:all .3s cubic-bezier(.4,0,.2,1);position:absolute;inset:0;transform:scale(.95)}.tab-button:hover:not(:disabled):before{opacity:.08;transform:scale(1)}.tab-button:hover:not(:disabled){color:var(--hotspot-text,var(--gray-700));border-color:var(--hotspot-primary,var(--soft-blue-dark));background:#fffc}.tab-button.active{color:var(--hotspot-primary,var(--soft-blue-dark));background:var(--hotspot-bg,var(--white));border-color:var(--hotspot-primary,var(--soft-blue-dark));border-width:2px;font-weight:600;box-shadow:0 2px 8px #0000001a}.tab-button.active:before{opacity:0}.tab-button:disabled{opacity:.5;cursor:not-allowed}@media (max-width:768px){.tabs-container{gap:4px;padding:4px}.tab-button{min-height:44px;padding:10px 8px;font-size:13px}}.form-type-selector{margin-bottom:24px}.form-type-selector select{width:100%}.hidden{display:none!important}.required-badge{color:var(--error);margin-left:6px;font-size:11px;font-weight:400;display:inline-block}.checkbox-group{background:var(--hotspot-bg-card,var(--gray-50));border-radius:var(--radius-sm);border:1px solid var(--hotspot-border,var(--gray-200));margin:20px 0;padding:16px}.checkbox-group label{cursor:pointer;color:var(--hotspot-text,var(--text));align-items:flex-start;margin-bottom:0;font-size:14px;display:flex}.checkbox-group input[type=checkbox]{cursor:pointer;flex-shrink:0;width:18px;height:18px;margin-top:2px;margin-right:10px}.logo-container{text-align:center;box-sizing:border-box;z-index:1;isolation:isolate;flex-shrink:0;justify-content:center;align-items:center;width:100%;max-width:328px;height:80px;min-height:80px;margin-top:0;margin-bottom:16px;padding:0;display:flex;position:relative;overflow:hidden}.logo-img{object-fit:contain;vertical-align:middle;z-index:1;will-change:auto;flex-shrink:0;width:auto;max-width:200px;height:auto;max-height:80px;margin:0 auto;display:block;position:relative}.logo-img-fallback{max-width:120px;max-height:48px}@media (max-width:768px){.logo-container{height:80px;min-height:80px;margin-top:0;margin-bottom:16px;padding-top:0}.logo-img{width:auto;max-width:200px;height:auto;max-height:80px}.logo-img-fallback{max-width:100px;max-height:40px}.hotspot-login-container,.wifi-connect-text{margin-top:0}}@media (min-width:481px) and (max-width:1024px){.hotspot-login-container{max-width:500px;padding:40px}.header h1{font-size:28px}.form-group input,.form-group select{padding:14px 18px;font-size:16px}.btn{padding:16px;font-size:17px}}@media (max-width:480px){.hotspot-login-container{border-radius:var(--radius-md);padding:24px}.header h1{font-size:20px}.form-row{grid-template-columns:1fr;gap:16px}}.boot-screen-overlay{background:var(--hotspot-bg,var(--white));z-index:9999;justify-content:center;align-items:center;padding:0;display:flex;position:fixed;inset:0}.boot-screen-content{background:var(--hotspot-bg,var(--white));width:100%;height:100%;color:var(--hotspot-text,var(--gray-900));flex-direction:column;display:flex}.boot-screen-header{border-bottom:1px solid var(--hotspot-border,var(--gray-200));text-align:center;padding:24px}.boot-screen-title{color:var(--hotspot-text,var(--gray-900));margin:0;font-size:24px;font-weight:600}.boot-screen-body{color:var(--hotspot-text,var(--gray-700));flex:1;padding:24px;line-height:1.6;overflow-y:auto}.boot-screen-text{max-width:800px;margin:0 auto}.boot-screen-footer{border-top:1px solid var(--hotspot-border,var(--gray-200));text-align:center;background:var(--hotspot-bg-card,var(--gray-50));padding:24px}.btn-large{min-height:48px;padding:14px 32px;font-size:16px;font-weight:600}@media (max-width:768px){.boot-screen-header,.boot-screen-body,.boot-screen-footer{padding:20px 16px}.boot-screen-title{font-size:20px}.btn-large{width:100%;min-height:44px}}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.modal-overlay.show{display:flex}.modal-content{background:var(--hotspot-bg-card,var(--white));border-radius:var(--radius-md);width:100%;max-width:600px;max-height:80vh;box-shadow:var(--shadow-large);position:relative;overflow-y:auto}.modal-header{border-bottom:1px solid var(--gray-200);justify-content:space-between;align-items:center;padding:20px 24px;display:flex}.modal-header h3{color:var(--hotspot-text,var(--gray-900));margin:0;font-size:20px;font-weight:600}.modal-close{color:var(--gray-600);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:32px;height:32px;padding:0;font-size:28px;transition:all .2s;display:flex}.modal-close:hover{background:var(--gray-100);color:var(--gray-900)}.modal-body{color:var(--hotspot-text,var(--gray-700));white-space:pre-wrap;padding:24px;line-height:1.6}.disclaimer-icon{opacity:.7;margin-left:8px;font-size:16px;transition:opacity .2s;display:inline-block}.disclaimer-icon:hover{opacity:1}.connecting-overlay,.connecting-content,.connecting-spinner,.connecting-text{display:none}
:root{--hotspot-primary:var(--soft-blue-dark,#4a7ba7);--hotspot-primary-dark:var(--soft-blue,#6b9bd1);--hotspot-bg:var(--white,#fff);--hotspot-bg-light:var(--gray-50,#fafafa);--hotspot-bg-card:var(--white,#fff);--hotspot-text:var(--gray-900,#212121);--hotspot-text-muted:var(--gray-600,#757575);--hotspot-border:var(--gray-200,#eee);--hotspot-error:var(--accent-coral,#ff8a80);--hotspot-success:var(--accent-teal,#4db6ac)}[data-theme=dark],body[data-theme=dark],body[data-theme=dark] .hotspot-login-container{--hotspot-primary:#00c9a7;--hotspot-primary-dark:#00a085;--hotspot-bg:#0f0f0f;--hotspot-bg-light:#1a1a1a;--hotspot-bg-card:#232323;--hotspot-text:#fff;--hotspot-text-muted:#ccc;--hotspot-border:#333;--hotspot-error:#e74c3c;--hotspot-success:#2ecc71}[data-theme=light],body[data-theme=light],body[data-theme=light] .hotspot-login-container{--hotspot-primary:var(--soft-blue-dark,#4a7ba7);--hotspot-primary-dark:var(--soft-blue,#6b9bd1);--hotspot-bg:var(--white,#fff);--hotspot-bg-light:var(--gray-50,#fafafa);--hotspot-bg-card:var(--white,#fff);--hotspot-text:var(--gray-900,#212121);--hotspot-text-muted:var(--gray-600,#757575);--hotspot-border:var(--gray-200,#eee);--hotspot-error:var(--accent-coral,#ff8a80);--hotspot-success:var(--accent-teal,#4db6ac)}[data-theme=pastel],body[data-theme=pastel],body[data-theme=pastel] .hotspot-login-container{--hotspot-primary:#a8d8ea;--hotspot-primary-dark:#7fb3c8;--hotspot-bg:#fff5f5;--hotspot-bg-light:#fff;--hotspot-bg-card:#fff;--hotspot-text:#5a5a5a;--hotspot-text-muted:#8b8b8b;--hotspot-border:#e8d5d5;--hotspot-error:#ff8b94;--hotspot-success:#c7ceea}[data-theme=ocean],body[data-theme=ocean],body[data-theme=ocean] .hotspot-login-container{--hotspot-primary:#4a90e2;--hotspot-primary-dark:#357abd;--hotspot-bg:#0a1929;--hotspot-bg-light:#132f4c;--hotspot-bg-card:#1e3a5f;--hotspot-text:#e3f2fd;--hotspot-text-muted:#90caf9;--hotspot-border:#1e3a5f;--hotspot-error:#ef5350;--hotspot-success:#66bb6a}[data-theme=forest],body[data-theme=forest],body[data-theme=forest] .hotspot-login-container{--hotspot-primary:#2e7d32;--hotspot-primary-dark:#1b5e20;--hotspot-bg:#1a1f1a;--hotspot-bg-light:#2d3e2d;--hotspot-bg-card:#3d4e3d;--hotspot-text:#e8f5e9;--hotspot-text-muted:#a5d6a7;--hotspot-border:#3d4e3d;--hotspot-error:#e57373;--hotspot-success:#81c784}[data-theme=sunset],body[data-theme=sunset],body[data-theme=sunset] .hotspot-login-container{--hotspot-primary:#ff6b35;--hotspot-primary-dark:#e55a2b;--hotspot-bg:#2a1810;--hotspot-bg-light:#3d2418;--hotspot-bg-card:#4d2e1f;--hotspot-text:#fff3e0;--hotspot-text-muted:#ffcc80;--hotspot-border:#4d2e1f;--hotspot-error:#ff5252;--hotspot-success:#ffb74d}[data-theme=purple],body[data-theme=purple],body[data-theme=purple] .hotspot-login-container{--hotspot-primary:#9c27b0;--hotspot-primary-dark:#7b1fa2;--hotspot-bg:#1a0d1f;--hotspot-bg-light:#2d1b33;--hotspot-bg-card:#3d2747;--hotspot-text:#f3e5f5;--hotspot-text-muted:#ce93d8;--hotspot-border:#3d2747;--hotspot-error:#e91e63;--hotspot-success:#ab47bc}[data-theme=minimal],body[data-theme=minimal],body[data-theme=minimal] .hotspot-login-container{--hotspot-primary:#424242;--hotspot-primary-dark:#212121;--hotspot-bg:#fafafa;--hotspot-bg-light:#fff;--hotspot-bg-card:#fff;--hotspot-text:#212121;--hotspot-text-muted:#757575;--hotspot-border:#e0e0e0;--hotspot-error:#d32f2f;--hotspot-success:#388e3c}[data-theme=neon],body[data-theme=neon],body[data-theme=neon] .hotspot-login-container{--hotspot-primary:#0f8;--hotspot-primary-dark:#00cc6f;--hotspot-bg:#0a0a0a;--hotspot-bg-light:#1a1a1a;--hotspot-bg-card:#252525;--hotspot-text:#fff;--hotspot-text-muted:#b0b0b0;--hotspot-border:#333;--hotspot-error:#ff0080;--hotspot-success:#0f8}[data-theme=warm],body[data-theme=warm],body[data-theme=warm] .hotspot-login-container{--hotspot-primary:#d4a574;--hotspot-primary-dark:#b8936a;--hotspot-bg:#f5f1eb;--hotspot-bg-light:#fff;--hotspot-bg-card:#fff;--hotspot-text:#5c4a37;--hotspot-text-muted:#8b7355;--hotspot-border:#e8ddd4;--hotspot-error:#c97d60;--hotspot-success:#a67c52}
