/* ---- Wrapper pagina ---- */
.gpin-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 80vh;
    padding: 40px 20px;
}

/* ---- Box PIN ---- */
.gpin-box {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 48px 40px;
    max-width: 420px;
    width: 100%;
    text-align: center;
    box-shadow: 0 4px 24px rgba(0,0,0,.07);
}

.gpin-box h2 { font-size: 22px; margin: 16px 0 8px; color: #111; }
.gpin-box p  { color: #555; font-size: 15px; margin-bottom: 28px; }

.gpin-logo { margin-bottom: 8px; }
.gpin-logo img, .gpin-logo-img { max-height: 56px; max-width: 80%; width: auto; height: auto; display: inline-block; }
.gpin-logo-text { font-size: 20px; font-weight: 700; color: #111; }

/* ---- Form ---- */
.gpin-form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.gpin-name,
.gpin-input {
    width: 100%;
    border: 2px solid #d1d5db;
    border-radius: 8px;
    padding: 12px 16px;
    text-align: center;
    outline: none;
    transition: border-color .2s;
    box-sizing: border-box;
}
.gpin-name  { font-size: 16px; }
.gpin-input { font-size: 18px; letter-spacing: 4px; }
.gpin-name:focus,
.gpin-input:focus { border-color: #2563eb; }

.gpin-btn {
    width: 100%;
    background: #1d4ed8;
    color: #fff;
    border: none;
    border-radius: 8px;
    padding: 12px 20px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background .2s;
}
.gpin-btn:hover    { background: #1e40af; }
.gpin-btn:disabled { opacity: .6; cursor: wait; }

/* ---- Messaggi ---- */
.gpin-msg { margin-top: 14px; font-size: 14px; min-height: 20px; }
.gpin-msg.gpin-ok  { color: #16a34a; }
.gpin-msg.gpin-err { color: #dc2626; }

/* ---- Contenuto protetto ---- */
.gpin-protected-content {
    -webkit-user-select: none;
    user-select: none;
}

@media (max-width: 480px) {
    .gpin-box { padding: 32px 20px; }
}