/* TotalChat: Mediterranean portal / editorial glass aesthetic */
:root { --tc-ink:#102846; --tc-deep:#163f68; --tc-blue:#2478ae; --tc-cyan:#b9e2e5; --tc-paper:#f3f4ef; --tc-sand:#d9c49c; }
html, body { min-height:100%; }
body { background:#79b7d2; font-family:Tahoma,'Segoe UI',sans-serif; }
#login_wrap.totalchat_login { position:relative; isolation:isolate; width:100%; min-height:100dvh; overflow:hidden; color:var(--tc-ink); background:linear-gradient(180deg,#74acc8 0%,#c9e4e7 45%,#78c5cf 46%,#dce3d5 60%,#d0c49e 100%); }
.tc_sky,.tc_portal { pointer-events:none; position:absolute; inset:0; overflow:hidden; }
.tc_sky:before { content:""; position:absolute; inset:0; opacity:.55; background:radial-gradient(ellipse at 18% 18%,rgba(255,255,255,.62) 0 5%,transparent 21%),radial-gradient(ellipse at 79% 13%,rgba(247,252,246,.65) 0 3%,transparent 18%),linear-gradient(125deg,rgba(30,85,130,.2),transparent 38%,rgba(255,255,255,.25) 62%,rgba(22,80,123,.15)); }
.tc_cloud { position:absolute; width:42vw; height:10vw; min-width:360px; border-radius:50%; background:rgba(237,245,239,.4); filter:blur(16px); }
.tc_cloud_one { top:7%; left:-8%; } .tc_cloud_two { top:23%; right:-14%; opacity:.7; }
.tc_horizon { position:absolute; top:45%; width:100%; border-top:2px solid rgba(245,255,246,.5); }
.tc_water { position:absolute; top:46%; width:100%; height:17%; background:repeating-linear-gradient(176deg,rgba(209,249,242,.4) 0 3px,rgba(34,131,164,.2) 4px 6px,transparent 8px 13px); opacity:.65; }
.tc_boardwalk { position:absolute; inset:auto -5% 0; height:40%; transform:perspective(400px) rotateX(54deg); transform-origin:bottom; background:repeating-linear-gradient(90deg,rgba(111,83,44,.33) 0 2px,transparent 2px 12%),linear-gradient(90deg,#caaa68,#e0cf9f 42%,#bd9c61); opacity:.78; }
.tc_portal { z-index:0; opacity:.32; }
.tc_portal:before,.tc_portal:after { content:""; position:absolute; top:6%; bottom:28%; width:16%; border:1px solid rgba(239,249,243,.8); background:rgba(230,243,239,.18); border-radius:14px; box-shadow:inset 0 0 0 9px rgba(244,252,249,.12); }
.tc_portal:before { left:8%; } .tc_portal:after { right:8%; }
.tc_portal_head { position:absolute; top:9%; left:12%; right:12%; height:6%; background:rgba(239,248,242,.65); border-radius:9px; }
.tc_portal_head span { display:inline-block; width:8px; height:8px; margin:11px 3px; border-radius:50%; background:#35637e; }
.tc_portal_line { position:relative; width:18%; height:12px; margin:18% 0 0 75%; border-radius:5px; background:rgba(239,248,242,.75); }
.tc_portal_line.short { margin-top:20%; margin-left:9%; width:14%; } .tc_portal_line.faint { opacity:.5; }
#intro_top { position:relative; z-index:2; min-height:calc(100dvh - 88px); width:100%; padding:34px 15px 18px; }
#login_all { position:relative; width:408px; max-width:100%; margin:0 auto; border:1px solid rgba(240,250,249,.85); border-radius:16px; overflow:hidden; background:rgba(241,247,244,.86); box-shadow:0 24px 50px rgba(20,58,90,.28),0 3px 8px rgba(15,48,75,.2); animation:tc-arrive .8s cubic-bezier(.2,.85,.32,1) both; backdrop-filter:blur(11px); }
.tc_window-bar { height:33px; padding:9px 13px; display:flex; align-items:center; justify-content:space-between; color:rgba(11,52,83,.64); background:rgba(205,226,226,.7); border-bottom:1px solid rgba(56,106,136,.2); direction:ltr; }
.tc_status { display:flex; gap:4px; } .tc_status i { width:7px; height:7px; border-radius:50%; background:#78a6b3; } .tc_status i:first-child { background:#315f7c; }
.tc_window-copy { font:500 9px monospace; letter-spacing:.1em; }
.tc_card_inner { padding:22px 38px 25px; }
.tc_logo_halo { display:inline-flex; align-items:center; justify-content:center; min-width:112px; min-height:58px; }
#login_logo { display:block; max-width:190px; max-height:74px; height:auto; filter:drop-shadow(0 2px 1px rgba(255,255,255,.75)); }
.tc_brand { margin-bottom:8px; }
.tc_eyebrow { margin:0 0 3px; color:#286d91; font-size:12px; font-weight:800; letter-spacing:.075em; }
.tc_heading { margin:0; color:#123957; font-size:28px; line-height:1.14; font-weight:800; }
.tc_welcome { margin:8px auto 0; max-width:270px; color:#4a6876; font-size:16px; line-height:1.35; }
.tc_presence { width:max-content; max-width:100%; margin:18px auto 15px; padding:5px 11px; border-radius:4px; direction:rtl; color:#4e717e; font-size:12px; background:rgba(181,220,218,.48); }
.tc_presence_dot { display:inline-block; width:7px; height:7px; margin-left:6px; border-radius:50%; background:#2e9e96; box-shadow:0 0 0 3px rgba(46,158,150,.12); animation:tc-pulse 2s infinite; }
.tc_actions button { float:none; width:100%; min-height:46px; margin:0 0 9px; border:0; border-radius:5px; font:700 16px Tahoma,'Segoe UI',sans-serif; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.tc_actions button i { margin-left:8px; font-size:13px; }
.tc_actions .intro_login_btn { color:#f8faf5; background:linear-gradient(180deg,#236e9d,#17547f); box-shadow:inset 0 1px rgba(255,255,255,.3),0 4px 0 #103f62,0 8px 14px rgba(19,68,99,.22); }
.tc_actions .intro_guest_btn { color:#2a5a72; background:rgba(255,255,250,.7); border:1px solid rgba(44,101,127,.32); box-shadow:0 3px 0 rgba(50,105,129,.18); }
.tc_actions button:hover { transform:translateY(-2px); } .tc_actions .intro_login_btn:hover { background:#1b638e; box-shadow:inset 0 1px rgba(255,255,255,.3),0 5px 0 #103f62,0 11px 16px rgba(19,68,99,.22); }
.tc_actions .intro_guest_btn:hover { background:#fffef6; }
.tc_registration { margin-top:17px; padding-top:15px; border-top:1px solid rgba(51,103,126,.2); color:#6a7f87; }
.tc_registration p { margin:0; } .tc_register { display:inline-block; margin-top:3px!important; color:#1e668e; cursor:pointer; } .tc_register i { margin-right:6px; font-size:11px; transition:transform .18s ease; } .tc_register:hover i { transform:translateX(-4px); }
#intro_lang { position:absolute; top:8px; inset-inline-end:10px; width:31px; height:22px; border:1px solid rgba(37,91,118,.24); border-radius:3px; overflow:hidden; background:rgba(255,255,255,.45); transition:transform .18s ease; }
#intro_lang:hover { transform:translateY(-1px); } .intro_lang { max-width:21px; max-height:14px; vertical-align:middle; }
.tc_footer_stage { position:relative; z-index:3; min-height:88px; padding:13px 20px 16px; color:rgba(15,61,85,.7); text-align:center; }
.tc_footer_rule { width:130px; height:1px; margin:0 auto 9px; background:rgba(240,249,238,.7); }.tc_footer_note { margin-bottom:7px; font:500 9px monospace; letter-spacing:.12em; }
.tc_footer_stage .page_footer { background:transparent!important; color:inherit!important; }
@keyframes tc-arrive { from { opacity:0; transform:translateY(22px) scale(.97); } to { opacity:1; transform:translateY(0) scale(1); } }
@keyframes tc-pulse { 0%,100% { transform:scale(1); opacity:1; } 50% { transform:scale(.72); opacity:.56; } }
@media (max-width:520px) { #intro_top { min-height:calc(100dvh - 76px); padding:19px 12px 10px; vertical-align:middle; } #login_all { width:100%; } .tc_card_inner { padding:19px 24px 22px; } .tc_heading { font-size:25px; } .tc_portal:before { left:-9%; }.tc_portal:after { right:-9%; }.tc_footer_stage { min-height:76px; } }
@media (max-height:650px) and (min-width:521px) { #intro_top { padding:12px; } .tc_card_inner { padding-top:13px; padding-bottom:14px; }.tc_presence { margin:10px auto; }.tc_registration { margin-top:10px; padding-top:8px; } }