:root{
    --bg:#05080f;
    --panel: rgba(12,18,28,.62);
    --panel2: rgba(12,18,28,.42);
    --stroke: rgba(255,255,255,.10);
    --stroke2: rgba(255,255,255,.14);

    --text: rgba(255,255,255,.96);
    --muted: rgba(255,255,255,.70);

    --accent:#63ff7c;
    --accent2:#18d96e;

    --shadow: rgba(0,0,0,.55);
    --glow: rgba(99,255,124,.22);
}

/* ===== Background ===== */
.tenant-landing{
    min-height: 100vh;
    padding: 44px 0;
    color: var(--text);
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(900px 500px at 70% 22%, rgba(99,255,124,.14), transparent 65%),
        radial-gradient(800px 520px at 18% 75%, rgba(99,255,124,.08), transparent 68%),
        linear-gradient(180deg, rgba(0,0,0,.74), rgba(0,0,0,.86)),
        url('{{ $heroBg }}');
    background-size: cover;
    background-position: center;
}

/* subtle premium grain */
.tenant-landing::before{
    content:"";
    position:absolute; inset:0;
    background:
        radial-gradient(700px 260px at 10% 8%, rgba(255,255,255,.05), transparent 60%),
        radial-gradient(800px 280px at 90% 12%, rgba(255,255,255,.04), transparent 60%);
    opacity:.65;
    pointer-events:none;
}

.tenant-landing > .container{ position:relative; z-index:2; }

/* ===== Brand Header (Professional) ===== */
.brand-top{
    display:flex;
    align-items:center;
    padding: 12px 14px;
    width: fit-content;
    box-shadow: 0 18px 70px rgba(0,0,0,.25);
}

.brand-top img{
    height: 42px;
    width:auto;
    object-fit: contain;
    filter: drop-shadow(0 10px 24px rgba(0,0,0,.55));
}

.brand-text .big{
    font-size: 16px;
    font-weight: 900;
    letter-spacing: .2px;
    line-height: 1.1;
}
.brand-text .small{
    font-size: 12px;
    font-weight: 700;
    color: rgba(255,255,255,.72);
}

/* ===== Hero Title ===== */
.hero-title{
    margin: 18px 0 14px;
    font-weight: 950;
    letter-spacing: -0.8px;
    line-height: 1.02;
    font-size: clamp(40px, 4.2vw, 64px);
    text-shadow: 0 26px 90px rgba(0,0,0,.55);
}

/* ===== Badge (premium chip style) ===== */
.revshare-row{ margin: 18px 0 18px; }

.upto-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding: 16px 22px;
    border-radius: 16px;

    color: #07140c;
    font-weight: 950;
    font-size: 30px;
    letter-spacing: -0.4px;
    font-style: italic;

    background:
        linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,0)),
        linear-gradient(90deg, var(--accent2), var(--accent));
    box-shadow:
        0 18px 70px rgba(99,255,124,.16),
        0 0 0 1px rgba(99,255,124,.25),
        0 30px 110px rgba(0,0,0,.35);
    position:relative;
    overflow:hidden;
}

/* subtle shine sweep */
.upto-badge::after{
    content:"";
    position:absolute;
    top:-60%;
    left:-50%;
    width:70%;
    height:220%;
    transform: rotate(20deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), transparent);
    opacity:.25;
}

/* ===== Contact lines (clean, aligned, no underline mess) ===== */
.contact-line{
    display:flex;
    align-items:center;
    gap:10px;
    margin-top: 12px;
    text-decoration:none;

    padding: 10px 12px;
    border-radius: 14px;
    width: fit-content;

    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)), var(--panel2);
    border: 1px solid var(--stroke);
    backdrop-filter: blur(12px);
    box-shadow: 0 14px 48px rgba(0,0,0,.22);

    transition: transform .15s ease, border-color .15s ease;
}
.contact-line:hover{
    transform: translateY(-1px);
    border-color: rgba(99,255,124,.20);
}

.contact-line span:first-child{
    color: rgba(255,255,255,.62);
    font-weight: 900;
    letter-spacing:.2px;
}
.contact-line span:last-child{
    color: rgba(255,255,255,.90);
    font-weight: 800;
    letter-spacing:.2px;
}

/* ===== Feature cards (remove “emoji toy” feel) ===== */
.feature-grid{
    margin-top: 26px;
    display:grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.feature-card{
    background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)),
        rgba(10,16,24,.52);
    border: 1px solid rgba(255,255,255,.10);
    border-radius: 18px;
    padding: 16px 14px;
    min-height: 104px;

    backdrop-filter: blur(14px);
    box-shadow: 0 18px 70px rgba(0,0,0,.22);
    transition: transform .15s ease, border-color .15s ease;
}
.feature-card:hover{
    transform: translateY(-2px);
    border-color: rgba(99,255,124,.18);
}

/* icon becomes small neon dot */
.feature-card .icon{
    width: 38px; height: 38px;
    border-radius: 12px;
    display:grid; place-items:center;

    color: var(--accent);
    font-size: 16px;

    background: rgba(99,255,124,.10);
    border: 1px solid rgba(99,255,124,.20);
    box-shadow: 0 0 0 4px rgba(99,255,124,.05);
    margin-bottom: 10px;
}

.feature-card .title{
    font-weight: 900;
    font-size: 13px;
    margin:0;
    letter-spacing:.1px;
}
.feature-card .desc{
    margin: 4px 0 0;
    color: rgba(255,255,255,.72);
    font-size: 12px;
    line-height: 1.25;
}

/* ===== Right side auth ===== */
.top-actions{
    display:flex;
    justify-content:flex-end;
    align-items:center;
    margin-bottom: 12px;
}

.auth-wrap{
    max-width: 520px;
    margin-left: auto;
}

.auth-tabs{
    display:flex;
    gap: 22px;
    margin: 0 0 14px;
    padding-left: 8px;
}

.auth-tabs .tab{
    cursor:pointer;
    text-decoration:none;
    font-weight: 950;
    letter-spacing:.55px;
    color: rgba(255,255,255,.72);
    padding-bottom: 8px;
    border-bottom: 2px solid transparent;
    transition: color .15s ease, border-color .15s ease;
}
.auth-tabs .tab.active{
    color:#fff;
    border-bottom-color: var(--accent);
}

.auth-form{
    background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)),
        rgba(8,12,18,.58);
    border: 1px solid rgba(99,255,124,.14);
    border-radius: 22px;
    padding: 18px;
    backdrop-filter: blur(16px);
    box-shadow: 0 30px 110px rgba(0,0,0,.45);
}

/* Inputs */
.field-label{
    color: rgba(255,255,255,.72);
    font-size: 12px;
    margin: 0 0 6px 4px;
    font-weight: 900;
}
.form-control, .form-select{
    background: rgba(12,18,28,.62) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
    color: #fff !important;
    border-radius: 14px !important;
    padding: 13px 14px !important;
    box-shadow: none !important;
}
.form-control::placeholder{ color: rgba(255,255,255,.42); }
.form-control:focus, .form-select:focus{
    border-color: rgba(99,255,124,.44) !important;
    box-shadow: 0 0 0 .22rem rgba(99,255,124,.14) !important;
}

/* Button */
.btn-accent{
    background:
        linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,0)),
        linear-gradient(90deg, var(--accent2), var(--accent));
    border:none;
    border-radius: 999px;
    padding: 12px 18px;
    font-weight: 950;
    letter-spacing:.3px;
    color: #06130b;
    box-shadow: 0 16px 60px rgba(99,255,124,.16);
}
.btn-accent:hover{ filter: brightness(1.06); }

.muted-link{
    color: rgba(255,255,255,.70);
    font-size: 12px;
}
.muted-link:hover{ color:#fff; }

.terms{
    color: rgba(255,255,255,.72);
    font-size: 12px;
}
.terms a{
    color: rgba(255,255,255,.92);
    text-decoration: underline;
    text-decoration-color: rgba(99,255,124,.40);
    text-underline-offset: 3px;
}

/* Responsive */
@media (max-width: 991.98px){
    .feature-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .auth-wrap{ max-width: 100%; margin: 26px auto 0; }
    .top-actions{ justify-content:space-between; }
}
@media (max-width: 575.98px){
    .feature-grid{ grid-template-columns: 1fr; }
}

.auth-wrap{
    max-width: 520px;
    margin-left: auto;
    min-height: 700px;
}

.auth-form{
    transition: opacity .15s ease, transform .15s ease;
}

#loginTab{
    margin-top: 0;
}

.auth-wrap{ min-height: 700px; }
@media (max-width: 1399px){ .auth-wrap{ min-height: 860px; } }
@media (max-width: 991px){ .auth-wrap{ min-height: auto; } }

/* Password icon wrapper */
.pwd-wrap{
    position: relative;
}

.pwd-wrap .form-control{
    padding-right: 48px !important;
}

/* Eye icon button */
.pwd-toggle{
    position: absolute;
    top: 50%;
    right: 12px;
    transform: translateY(-50%);

    background: transparent;
    border: none;
    padding: 0;
    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;
}

/* Icon style */
.eye-icon{
    width: 18px;
    height: 18px;
    color: rgba(255,255,255,.55);
    transition: color .2s ease, transform .15s ease;
}

.pwd-toggle:hover .eye-icon{
    color: rgba(99,255,124,.9);
    transform: scale(1.05);
}

/* Active state glow */
.pwd-toggle.active .eye-icon{
    color: var(--accent);
}

/* ===== Footer (premium) ===== */
.tenant-footer{
    margin-top: 34px;
    padding: 18px 0 26px;
    position: relative;
    z-index: 2;
}

.footer-inner{
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;

    padding: 14px 16px;
    border-radius: 18px;

    background:
        linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,0)),
        rgba(8,12,18,.55);

    border: 1px solid rgba(255,255,255,.10);
    backdrop-filter: blur(14px);
    box-shadow: 0 18px 70px rgba(0,0,0,.22);
}

/* left */
.footer-left{
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 220px;
}
.footer-logo{
    height: 30px;
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 10px 24px rgba(0,0,0,.45));
}
.footer-meta .footer-title{
    font-weight: 950;
    letter-spacing: .2px;
    font-size: 13px;
    color: rgba(255,255,255,.92);
    line-height: 1.1;
}
.footer-meta .footer-sub{
    font-weight: 800;
    font-size: 11px;
    color: rgba(255,255,255,.62);
}

/* middle links */
.footer-links{
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
}
.footer-links a{
    text-decoration: none;
    font-weight: 900;
    font-size: 12px;
    color: rgba(255,255,255,.68);
    padding: 8px 10px;
    border-radius: 12px;
    border: 1px solid transparent;
    transition: color .15s ease, border-color .15s ease, transform .15s ease;
}
.footer-links a:hover{
    color: #fff;
    border-color: rgba(99,255,124,.22);
    transform: translateY(-1px);
}

/* right chips */
.footer-right{
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}
.footer-chip{
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 8px 12px;
    border-radius: 14px;

    background: rgba(12,18,28,.45);
    border: 1px solid rgba(255,255,255,.10);
    box-shadow: 0 10px 40px rgba(0,0,0,.18);

    white-space: nowrap;
}
.footer-chip .k{
    font-weight: 950;
    font-size: 11px;
    color: rgba(255,255,255,.60);
}
.footer-chip .v{
    font-weight: 900;
    font-size: 11px;
    color: rgba(255,255,255,.90);
}

/* bottom row */
.footer-bottom{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 0 4px;

    color: rgba(255,255,255,.55);
    font-size: 12px;
    font-weight: 800;
}

.footer-bottom .powered span{
    color: var(--accent);
    font-weight: 950;
    text-shadow: 0 0 18px rgba(99,255,124,.20);
}

/* responsive */
@media (max-width: 991.98px){
    .footer-inner{
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    .footer-left{
        justify-content: center;
    }
    .footer-links{
        justify-content: center;
    }
    .footer-right{
        justify-content: center;
    }
    .footer-bottom{
        flex-direction: column;
        text-align: center;
    }
}

/* ===== Sticky Footer Fix (no HTML change) ===== */

/* Make the whole landing page a flex column */
.tenant-landing{
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Make the main container take remaining height */
.tenant-landing > .container{
    flex: 1 0 auto;
    display: flex;
    flex-direction: column;
}

/* Keep your current row behavior */
.tenant-landing > .container > .row{
    flex: 1 0 auto;
}

/* Push footer to bottom always */
.tenant-footer{
    margin-top: auto;      /* ✅ this pins footer */
    flex: 0 0 auto;
    padding-bottom: 26px;
}

/* On very small screens allow natural scroll */
@media (max-width: 991.98px){
    .tenant-landing{
        display: block;
        min-height: auto;
    }
    .tenant-footer{
        margin-top: 34px;
    }
}

/* Main box */
.select2-container--default .select2-selection--single {
    background-color: #0b1623 !important;   /* match your input bg */
    border: 1px solid #1f2f3d !important;
    color: #fff !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    border-radius: 12px !important;
}

/* Text */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #cbd5e1 !important;
    line-height: 44px !important;
}

/* Arrow */
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #94a3b8 transparent transparent transparent !important;
}

/* Dropdown */
.select2-dropdown {
    background-color: #0f1e2e !important;
    border: 1px solid #1f2f3d !important;
    color: #fff !important;
}

/* Dropdown items */
.select2-results__option {
    background-color: #0f1e2e !important;
    color: #cbd5e1 !important;
}

/* Hover */
.select2-results__option--highlighted {
    background-color: #1e293b !important;
    color: #fff !important;
}

/* Search input inside dropdown */
.select2-search__field {
    background-color: #0b1623 !important;
    color: #fff !important;
    border: 1px solid #1f2f3d !important;
}

.select2-container--default .select2-selection--single:focus,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: #22c55e !important;
    box-shadow: 0 0 0 2px rgba(34,197,94,.2) !important;
}

.success-title{
    margin-bottom: 2px !important;
    font-size: 16px;
    font-weight: 700;
    text-align: justify;
}

.success-footer{
    font-size: 12px;
    font-family: sans-serif;
    color: #d0d0d0;
}