/* =========================
   GLASS LOGIN PANEL
   ========================= */

.mod-login {
    width: 100%;
    max-width: 420px;

    margin: 80px auto !important;
    padding: 40px;

    text-align: center;

    background: rgba(255,255,255,.12);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    border: 1px solid rgba(255,255,255,.25);
    border-radius: 0px;

    box-shadow:
        0 10px 35px rgba(0,0,0,.25),
        inset 0 1px 1px rgba(255,255,255,.25);
}

/* Make every form element centered */
.mod-login form,
.mod-login fieldset,
.mod-login .login-fields,
.mod-login .control-group {
    width: 100%;
    text-align: center;
}

/* Inputs */
.mod-login input {
    display: block;
    width: 100%;
    box-sizing: border-box;

    padding: 12px 14px;
    margin: 0 auto 15px;

    border: 1px solid rgba(255,255,255,.25);
    border-radius: 8px;

    background: rgba(255,255,255,.88);
}

/* Button */
.mod-login button {
    display: inline-block !important;
    width: auto !important;

    padding: 10px 40px;
    margin: 10px auto 0;

    border: none;
    border-radius: 8px;

    background: #265370;
    color: #fff;

    cursor: pointer;
}
/* =========================
   HIDE EVERYTHING EXTRA
   ========================= */

/* icons + wrappers */
.mod-login .input-group-text,
.mod-login i,
.mod-login svg,
.mod-login .form-text,
.mod-login .mod-login__remember,
.mod-login .mod-login__links,
.mod-login .login-description {
    display: none !important;
}

/* forgot links */
.mod-login a[href*="remind"],
.mod-login a[href*="reset"],
.mod-login a[href*="password"],
.mod-login a[href*="username"] {
    display: none !important;
}

/* passkey / webauthn */
.mod-login .com-users-login__webauthn,
.mod-login .webauthn-login-button,
.mod-login button[type="button"][data-webauthn],
.mod-login [id*="webauthn"],
.mod-login [class*="webauthn"] {
    display: none !important;
}

/* password eye / toggle button */
.mod-login .password-toggle,
.mod-login .input-password-toggle,
.mod-login .field-password-toggle,
.mod-login [class*="toggle-password"],
.mod-login [class*="password-toggle"],
.mod-login button[class*="toggle"] {
    display: none !important;
}










/* BACKGROUND ONLY FOR THIS ONE PAGE */

.my-home-bg {
    min-height: 100vh;
    min-height: 100dvh;

    background: url('/images/login-bg.jpg') no-repeat center center !important;
    background-size: cover !important;
}




/* =========================
   RESPONSIVE WIDTH (OPTION 2)
   ========================= */

/* Default (mobile & tablet) */
.mod-login {
    width: 90%;
    max-width: 420px;
    margin: 90px auto;
}

/* Desktop: left + vertically centered + wider */
@media (min-width: 992px) {
    .mod-login {
        position: absolute; /* or use fixed if preferred */
        top: 50%;
        left: 80px;

        transform: translateY(-50%);

        margin: 0;
        text-align: left;

        width: 100%;
        max-width: 400px; /* 👈 wider fields */
    }
}

/*startup Tiles*/

.tile-container {
    display:flex;
    flex-wrap:wrap;
    gap:20px;
    justify-content:center;
}

.tile {
    width:200px;
    height:200px;

    border-radius:2px;
    display:flex;
    align-items:center;
    justify-content:center;

    font-size:28px;
    font-weight:bold;
    color:#000;
    text-decoration:none;

    font-family:"Bauhaus 93","Arial Rounded MT Bold",sans-serif;

    box-shadow:
        rgba(14,30,37,0.12) 0px 5px 10px 0px,
        rgba(14,30,37,0.32) 0px 5px 32px 0px;

    transition:
        box-shadow 0.25s ease,
        border-radius 0.25s ease,
        transform 0.25s ease;
}

.tile:hover {
    box-shadow:5px 10px 50px rgba(0,0,0,0.6);
    border-radius:0px 20px 0px 20px;
    transform:translateY(-5px);
}


/* TABLET */
@media (max-width: 900px) {

    .tile {
        width:160px;
        height:160px;
        font-size:24px;
    }

}


/* MOBILE */
@media (max-width: 600px) {

    .tile-container {
        gap:12px;
    }

    .tile {
        width:42vw;
        height:42vw;
        font-size:20px;
    }

}



body.login-page {
    background: url("https://proj.work.gd/images/login-bg.png") center center / cover no-repeat fixed !important;
}