/* TitanCart — Subscribe Popup (Phase 5 block B, S241)
   Modal styles for assets/js/subscribe-popup.js. Class-scoped (.tc-subpop-*),
   injected into <body>, high z-index so it sits above the storefront nav. */

.tc-subpop-overlay {
    position: fixed;
    inset: 0;
    top: 0; right: 0; bottom: 0; left: 0; /* inset fallback for older engines */
    background: rgba( 10, 10, 10, 0.55 );
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    padding: 20px;
    animation: tc-subpop-fade 0.2s ease;
}

@keyframes tc-subpop-fade { from { opacity: 0; } to { opacity: 1; } }

.tc-subpop-card {
    position: relative;
    background: #ffffff;
    width: 100%;
    max-width: 420px;
    border-radius: 14px;
    padding: 32px 28px 28px;
    box-shadow: 0 20px 60px rgba( 0, 0, 0, 0.35 );
    text-align: center;
    font-family: inherit;
    animation: tc-subpop-pop 0.25s cubic-bezier( 0.18, 0.89, 0.32, 1.28 );
}

@keyframes tc-subpop-pop {
    from { transform: translateY( 12px ) scale( 0.97 ); opacity: 0; }
    to   { transform: none; opacity: 1; }
}

.tc-subpop-close {
    position: absolute;
    top: 10px;
    right: 12px;
    border: none;
    background: transparent;
    font-size: 26px;
    line-height: 1;
    color: #737373;
    cursor: pointer;
    padding: 4px 8px;
}
.tc-subpop-close:hover { color: #0a0a0a; }

.tc-subpop-heading {
    margin: 0 0 8px;
    font-size: 22px;
    font-weight: 700;
    color: #171717;
}

.tc-subpop-text {
    margin: 0 0 20px;
    font-size: 14px;
    line-height: 1.5;
    color: #525252;
}

.tc-subpop-form {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.tc-subpop-input {
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px;
    border: 1px solid #d4d4d4;
    border-radius: 8px;
    font-size: 15px;
    color: #0a0a0a;
}
.tc-subpop-input:focus {
    outline: none;
    border-color: #2563eb;
    box-shadow: 0 0 0 3px rgba( 37, 99, 235, 0.15 );
}

.tc-subpop-btn {
    width: 100%;
    padding: 12px 16px;
    background: #2563eb;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}
.tc-subpop-btn:hover:not( :disabled ) { background: #1d4ed8; }
.tc-subpop-btn:disabled { opacity: 0.6; cursor: default; }

.tc-subpop-msg {
    margin-top: 12px;
    font-size: 13px;
    min-height: 18px;
}
.tc-subpop-msg--error   { color: #dc2626; }
.tc-subpop-msg--success { color: #16a34a; font-weight: 600; }

@media ( max-width: 480px ) {
    .tc-subpop-card { padding: 28px 20px 22px; }
    .tc-subpop-heading { font-size: 20px; }
}
