/* Tower Tools: the login screen (wp-login.php, the original WordPress login; works with or without the BuddyBoss template): the picture of the academy on the left,
   the form and the useful links on the right, in the colours of the site (navy #17212b, beige #ccb7a6). */
:root{--lg-w:min(42vw,calc(100vh * .62))}
body.login{background:#0f1720!important;color:#e6e1d8;font-family:'Asap',Arial,sans-serif}
/* the left side: the picture of the academy (our own element, the template of BuddyBoss is switched off); its width follows the height of the screen, so that the picture is not cut */
body.login .login-split{display:none!important}
.ttt-lg-pic{position:fixed;left:0;top:0;bottom:0;width:var(--lg-w);z-index:0;background:#17212b var(--ttt-splash) center bottom/cover no-repeat}
.ttt-lg-pic:before{content:"";position:absolute;left:0;right:0;bottom:0;height:8%;z-index:1;background:linear-gradient(to top,#6a2024 0,#6a2024 65%,rgba(106,32,36,0) 100%)}   /* hides the text painted on the splash (2.0 NOV26); the own text of the settings lies over it */
.ttt-lg-pic-t{position:absolute;left:12px;right:12px;bottom:2.6%;z-index:2;text-align:center;color:rgba(255,255,255,.62);font:700 clamp(13px,1.4vw,20px)/1.2 'Asap',Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase}
.ttt-lg-pic:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,32,0) 75%,rgba(15,23,32,.55))}
/* the right side: the panel, the content in the middle of the height (when it is taller than the screen, the panel scrolls) */
body.login #login{display:flex!important;flex-direction:column;position:fixed!important;left:var(--lg-w)!important;right:0!important;top:0!important;bottom:0!important;transform:none!important;width:auto!important;max-width:none!important;margin:0!important;padding:28px clamp(22px,5vw,90px)!important;box-sizing:border-box!important;overflow:auto;background:radial-gradient(circle at 85% 0,#223344 0,#141d27 58%,#0f1720 100%)!important;scrollbar-width:thin;z-index:1}
body.login #login:before,body.login #login:after{content:"";flex:1 1 0;min-height:0}
body.login #login>*{flex:none;width:100%;max-width:470px;align-self:center;margin-left:0!important;margin-right:0!important;box-sizing:border-box}
body.login #login h1,body.login .login-heading,body.login .language-switcher{display:none!important}
.ttt-lg-head h2{margin:0 0 8px;font:700 38px/1.05 'Asap Condensed','Asap',Arial,sans-serif;color:#f3efe9;letter-spacing:.01em}
.ttt-lg-head h2 b{color:#ccb7a6;font-weight:700}
.ttt-lg-head p{margin:0 0 22px;color:#b9c0cc;font-size:15px;line-height:1.5}
.ttt-lg-badge{display:inline-block;margin:0 0 14px;padding:5px 13px;border-radius:999px;background:rgba(204,183,166,.16);color:#ccb7a6;font:700 11px/1.4 'Asap',Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase}
/* the form */
body.login #loginform,body.login #lostpasswordform,body.login #resetpassform,body.login #registerform{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;margin:0!important;overflow:visible!important}
body.login #loginform>p,body.login #loginform .user-pass-wrap{position:static!important;left:auto!important;margin-left:0!important;margin-right:0!important;width:auto!important}
body.login #loginform input[type=text],body.login #loginform input[type=password],body.login #loginform input[type=email],body.login #lostpasswordform input[type=text],body.login #resetpassform input[type=password],body.login #registerform input[type=text],body.login #registerform input[type=email]{background:rgba(255,255,255,.06)!important;border:1px solid rgba(255,255,255,.16)!important;border-radius:14px!important;color:#f3efe9!important;height:50px!important;font-size:16px!important;box-shadow:none!important;transition:border-color .15s,background .15s}
body.login #loginform input::placeholder,body.login #lostpasswordform input::placeholder{color:#8c97a6!important}
body.login #loginform input:focus,body.login #lostpasswordform input:focus,body.login #resetpassform input:focus,body.login #registerform input:focus{border-color:#ccb7a6!important;background:rgba(255,255,255,.1)!important;outline:0!important;box-shadow:0 0 0 3px rgba(204,183,166,.18)!important}
body.login input:-webkit-autofill{-webkit-box-shadow:0 0 0 100px #1f2c3a inset!important;-webkit-text-fill-color:#f3efe9!important}
body.login #loginform label,body.login .forgetmenot label{color:#b9c0cc!important}
body.login .wp-hide-pw,body.login .wp-hide-pw .dashicons{color:#9aa6b4!important;background:transparent!important}
body.login .forgetmenot span.checkbox{background:transparent!important;border:1px solid rgba(255,255,255,.4)!important;border-radius:6px!important}
body.login .lostmenot a,body.login #nav a,body.login #backtoblog a{color:#ccb7a6!important;font-size:13px!important}
body.login .lostmenot a:hover,body.login #nav a:hover{color:#f3efe9!important}
body.login #wp-submit{height:54px!important;border:0!important;border-radius:14px!important;background:linear-gradient(135deg,#d6c2b2 0%,#ccb7a6 45%,#b69c88 100%)!important;color:#1d2a35!important;font:800 14px 'Asap',Arial,sans-serif!important;letter-spacing:.08em;text-transform:uppercase!important;box-shadow:0 10px 26px rgba(0,0,0,.35);transition:transform .12s,filter .15s}
body.login #wp-submit:hover{filter:brightness(1.07);transform:translateY(-1px)}
body.login #wp-submit:active{transform:scale(.98)}
body.login #loginform .forgetmenot{float:none!important;margin:12px 0 4px!important}
body.login #loginform p.submit{float:none!important;margin:16px 0 0!important}
body.login #wp-submit{float:none!important;width:100%!important}
body.login #nav,body.login #backtoblog{text-align:center;margin:14px 0 0!important;padding:0!important}
body.login #loginform label{font-size:13px!important;margin-bottom:6px!important}
body.login .user-pass-wrap,body.login #loginform>p:first-of-type{margin-bottom:14px!important}
body.login #login_error,body.login .message,body.login .success{border-radius:12px!important;background:rgba(255,255,255,.07)!important;color:#f3efe9!important;border-left:4px solid #ccb7a6!important;box-shadow:none!important;margin-bottom:16px!important}
body.login #login_error{border-left-color:#e0533d!important}
body.login #login_error a,body.login .message a{color:#ccb7a6!important}
/* the useful links and information (below the form) */
.ttt-lg-extra{margin-top:26px}
.ttt-lg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ttt-lg-card{display:block;padding:14px 15px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);color:#d7dde6;text-decoration:none!important;font-size:13px;line-height:1.45;transition:border-color .15s,background .15s,transform .12s}
a.ttt-lg-card:hover{border-color:#ccb7a6;background:rgba(204,183,166,.1);transform:translateY(-1px)}
.ttt-lg-card b{display:flex;align-items:center;gap:8px;margin:0 0 4px;color:#f3efe9;font-size:14px}
.ttt-lg-card b svg{width:18px;height:18px;flex:none;fill:none;stroke:#ccb7a6;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.ttt-lg-card small{display:block;color:#9aa6b4;font-size:12px;margin-top:3px}
.ttt-lg-wide{grid-column:1/-1}
.ttt-lg-new{margin:12px 0 0;padding:14px 16px;border-radius:14px;background:linear-gradient(135deg,rgba(204,183,166,.2),rgba(204,183,166,.06));border:1px solid rgba(204,183,166,.3);color:#e6e1d8;font-size:13px;line-height:1.5}
.ttt-lg-new b{display:block;color:#ccb7a6;font:700 12px/1.3 'Asap',Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;margin:0 0 6px}
.ttt-lg-new ul{margin:0;padding-left:18px}
.ttt-lg-new li{margin:2px 0}
.ttt-lg-links{margin:16px 0 0;text-align:center;color:#8c97a6;font-size:12px}
.ttt-lg-links a{color:#ccb7a6!important;text-decoration:none!important;margin:0 6px}
.ttt-lg-links a:hover{color:#f3efe9!important}
body.login .privacy-policy-page-link{text-align:center;margin-top:18px!important}
body.login .privacy-policy-page-link a{color:#ccb7a6!important}
/* the screens of a phone and a small window: the form on the whole screen, a strip of the picture at the top */
@media(max-width:900px){
 .ttt-lg-pic{display:none}
 body.login #login{display:block!important;left:0!important;padding:24px 20px 22px!important}
 body.login #login:after{display:none}
 body.login #login>*{max-width:none;margin-left:auto!important;margin-right:auto!important}
 .ttt-lg-head{text-align:center}
 .ttt-lg-head h2{font-size:32px}
 .ttt-lg-grid{grid-template-columns:1fr}
}
@media(max-width:900px) and (min-height:600px){body.login #login:before{display:block;flex:none;height:150px;margin:-24px -20px 18px;background:var(--ttt-splash) center 30%/cover no-repeat;-webkit-mask-image:linear-gradient(#000 60%,transparent);mask-image:linear-gradient(#000 60%,transparent)}}
@media(max-width:900px) and (max-height:599px){body.login #login:before{display:none}}
/* a lower screen: the box of news and the small lines go away, so that the panel fits and stays in the middle */
@media(min-width:901px) and (max-height:1000px){.ttt-lg-new,.ttt-lg-card small{display:none}.ttt-lg-extra{margin-top:20px}.ttt-lg-head p{margin-bottom:16px}}
/* hovers: no blue of WordPress */
body.login a:hover,body.login a:focus,body.login a:active{color:#f3efe9!important}
body.login a.ttt-lg-card:hover,body.login a.ttt-lg-card:focus{color:#e6e1d8!important}
body.login a.ttt-lg-card:hover b{color:#fff}
body.login .ttt-lg-links a:hover,body.login #nav a:hover,body.login #backtoblog a:hover,body.login .privacy-policy-page-link a:hover{color:#f3efe9!important}
/* the windows with the Terms of Service and the Privacy Policy: dark, with a black shadow */
.mfp-bg{background:#030507!important;opacity:.86!important}
.login-popup,.login-popup.bb-modal,.mfp-content .bb-modal{background:#17212b!important;color:#d7dde6!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:18px!important;box-shadow:0 30px 90px rgba(0,0,0,.9),0 0 0 1px rgba(0,0,0,.6)!important}
.login-popup h1,.login-popup h2,.login-popup h3,.login-popup strong,.login-popup b{color:#f3efe9!important}
.login-popup p,.login-popup li,.login-popup span{color:#c9d0da!important}
.login-popup a{color:#ccb7a6!important}
.login-popup a:hover{color:#f3efe9!important}
.login-popup .mfp-close,.mfp-close{color:#ccb7a6!important;opacity:.9}
.login-popup .mfp-close:hover{color:#f3efe9!important}