/* ========  HEADER STYLES START  ======= */

.profile-wrap,
.header-link-wrap,
.services-wrap{
    position: relative;
    display: inline-block;
}

.header-top-menu-wrap{
    gap: 12px;
    flex-wrap: nowrap;
}

    /* PROFILE BUTTON */
.profile-btn{
    background:#0989ff;
    color:#fff;
    padding:8px 14px;
    border-radius:6px;
    display:flex;
    align-items:center;
    gap:6px;
    cursor:pointer;
    font-size:14px;
    font-weight:500;
    white-space:nowrap;
    transition:0.3s;
}

.profile-btn:hover{
    background:#0877dc;
}

/* PROFILE DROPDOWN */
.profile-dropdown{
    position:absolute;
    top:110%;
    right:0;
    width:230px;
    background:#fff;
    border-radius:12px;
    box-shadow:0 10px 25px rgba(0,0,0,0.12);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:0.3s;
    z-index:999;
    padding:8px 0;
}

.profile-wrap:hover .profile-dropdown{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.profile-dropdown a{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px 16px;
    text-decoration:none;
    color:#333;
    font-size:14px;
    transition:0.2s;
}

.profile-dropdown a:hover{
    background:#f5f7ff;
    color:#0989ff;
}

.profile-title{
    font-size:12px;
    font-weight:600;
    color:#0989ff;
    padding:8px 16px 4px;
}

.divider{
    height:1px;
    background:#eee;
    margin:6px 0;
}

/* DESKTOP TEXT MENUS */
.text-menu-link{
    color:#222;
    font-size:18px;
    font-weight:400;
    text-decoration:none;
    display:flex;
    align-items:center;
    gap:6px;
    white-space:nowrap;
    transition:0.2s;
    cursor:pointer;
    line-height:1;
    padding:0;
    background:transparent;
    border:none;
}

.text-menu-link:hover{
    color:#0989ff;
}

.services-text-link{
    padding-top:2px;
}

/* SERVICES MEGA MENU */
.services-mega-menu{
    position:absolute;
    top:140%;
    left:0;
    width:760px;
    background:#fff;
    border-radius:12px;
    box-shadow:0 10px 30px rgba(0,0,0,0.12);
    opacity:0;
    visibility:hidden;
    transform:translateY(10px);
    transition:0.3s;
    z-index:999;
    padding:18px;
}

.services-wrap:hover .services-mega-menu{
    opacity:1;
    visibility:visible;
    transform:translateY(0);
}

.services-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
}

.service-item{
    display:flex;
    align-items:flex-start;
    gap:12px;
    padding:12px;
    border-radius:10px;
    text-decoration:none;
    transition:0.2s;
    background:#fff;
}

.service-item:hover{
    background:#f5f7ff;
}

.service-icon{
    width:42px;
    height:42px;
    min-width:42px;
    border-radius:10px;
    background:#eef3f8;
    color:#0989ff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:18px;
}

.service-text h6{
    margin:0 0 4px;
    font-size:14px;
    font-weight:600;
    color:#222;
    line-height:1.3;
}

.service-text p{
    margin:0;
    font-size:12px;
    color:#666;
    line-height:1.4;
}

@media (max-width: 1399px){
    .services-mega-menu{
        width:680px;
    }
}

@media (max-width: 1199px){
    .services-mega-menu{
        width:620px;
    }
}

@media (max-width:767px){
    #mobile-category-slider .swiper-slide{
        height:auto !important;
    }
    #mobile-category-slider .mcs-prev,
    #mobile-category-slider .mcs-next{
        display:none !important;
    }
}

.tp-account-dropdown-wrapper:hover .tp-account-dropdown-menu{
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}

@media (max-width: 767px){
    #hide-mobile{
        display:none !important;
    }
}

.tp-header-search-wrapper {
    position: relative;
    border: 2px solid var(--tp-theme-primary);
    margin-left: 10px;
    border-radius: 370px;
}

.tp-category-menu-btn{
    width:190px !important;
    padding:10px 14px !important;
}

.tp-main-menu-content ul li a{
    font-size:13px !important;
    padding:8px 6px !important;
}

/* ========  FAQ STYLES START  ======= */
.faq-btn{
    width:100%;
    background:none;
    border:none;
    text-align:left;
    padding:18px 0;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
    position:relative;
    color:#111;
}

.faq-btn::after{
    content:"+";
    position:absolute;
    right:0;
    font-size:22px;
    color:#0989ff;
    transition:0.3s;
}

.faq-btn.active::after{
    content:"−";
}

.faq-content{
    max-height:0;
    overflow:hidden;
    transition:max-height 0.3s ease;
    font-size:15px;
    color:#555;
    padding-right:30px;
}

.faq-btn.active + .faq-content{
    max-height:200px;
    padding-bottom:18px;
}

.faq-btn:hover{
    color:#0989ff;
}

/* ============================================================
   AUTH PAGE — login_new.blade.php
   ============================================================ */

/* ── Section ── */
.auth-section {
    background: #f4f8fc;
    position: relative;
    overflow: hidden;
}

/* ── Card wrapper ── */
.auth-card {
    background: #ffffff;
    border: 1px solid #e7eef5;
    border-radius: 28px;
    box-shadow: 0 20px 50px rgba(15, 23, 42, .08);
    overflow: hidden;
}

/* ── Left panel ── */
.auth-left-panel {
    height: 100%;
    background: linear-gradient(135deg, #0989ff, #0b6bd3);
    padding: 50px 38px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
}

.auth-left-inner {
    position: relative;
    z-index: 2;
}

/* Badge */
.auth-badge {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 50px;
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .2);
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 18px;
}

/* Title */
.auth-left-title {
    font-size: 38px;
    line-height: 1.2;
    margin: 0 0 14px;
    color: #fff;
    font-weight: 700;
}

/* Description */
.auth-left-desc {
    font-size: 15px;
    line-height: 1.8;
    color: #e8f3ff;
    margin: 0 0 24px;
}

/* Feature cards list */
.auth-feature-list {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.auth-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
    background: rgba(255, 255, 255, .10);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 16px;
    padding: 14px 16px;
}

.auth-feature-icon {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    flex-shrink: 0;
}

.auth-feature-title {
    margin: 0 0 3px;
    font-size: 15px;
    color: #fff;
    font-weight: 600;
}

.auth-feature-subtitle {
    margin: 0;
    font-size: 13px;
    color: #dcecff;
}

/* Decorative blobs */
.auth-blob-1 {
    position: absolute;
    width: 180px;
    height: 180px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    top: -50px;
    right: -50px;
}

.auth-blob-2 {
    position: absolute;
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .08);
    bottom: 20px;
    left: -30px;
}

/* ── Right panel ── */
.auth-right-panel {
    padding: 50px 40px;
}

/* Heading block */
.auth-heading-block {
    text-align: center;
    margin-bottom: 26px;
}

.auth-main-heading {
    font-size: 30px;
    margin: 0 0 10px;
    color: #111827;
    font-weight: 700;
}

.auth-sub-heading {
    margin: 0;
    color: #6b7280;
    font-size: 15px;
}

/* ── Form fields ── */
.auth-field-group {
    margin-bottom: 18px;
}

.auth-label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

.auth-input-wrap {
    position: relative;
}

.auth-input-prefix {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: #6b7280;
    font-weight: 600;
}

.auth-input {
    width: 100%;
    height: 56px;
    border: 1px solid #dbe5ef;
    border-radius: 16px;
    background: #f9fbfe;
    font-size: 16px;
    color: #111827;
    outline: none;
    box-sizing: border-box;
    padding: 0 18px;
}

input[type="password"] {
    font-size: 25px;
    letter-spacing: 3px; /* nicer dot spacing */
}

.auth-input.with-prefix {
    padding-left: 56px;
}

.auth-input.with-toggle {
    padding-right: 50px;
}

.auth-input:focus {
    border-color: #0989ff;
    background: #fff;
}

/* Password toggle icon */
.auth-pw-toggle {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #6b7280;
    font-size: 18px;
    user-select: none;
}

/* ── Primary button ── */
.auth-btn-primary {
    height: 56px;
    width: 100%;
    border: none;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #0989ff, #0b6bd3);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    box-shadow: 0 14px 30px rgba(9, 137, 255, .22);
    cursor: pointer;
}

.auth-btn-primary:disabled {
    opacity: .7;
    cursor: not-allowed;
}

/* ── Secondary / back button ── */
.auth-btn-back {
    flex: 1;
    min-width: 140px;
    height: 54px;
    border: 1px solid #dbe5ef;
    border-radius: 14px;
    background: #fff;
    color: #111827;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
}

/* ── Button row (back + action) ── */
.auth-btn-row {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

/* ── OTP grid ── */
.otp-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 10px;
    margin-bottom: 10px;
}

.otp-input {
    height: 56px;
    text-align: center;
    border: 1px solid #dbe5ef;
    border-radius: 14px;
    background: #f9fbfe;
    font-size: 18px;
    font-weight: 700;
    outline: none;
}

.otp-input:focus {
    border-color: #0989ff;
    background: #fff;
}

/* ── OTP sent info text ── */
.auth-otp-info {
    margin: 0 0 20px;
    color: #6b7280;
    font-size: 14px;
}

.auth-otp-info strong {
    font-weight: 700;
    color: #111827;
}

/* ── Resend link ── */
.auth-resend-wrap {
    text-align: center;
    margin-top: 16px;
}

.auth-resend-link {
    color: #0989ff;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}

.auth-resend-link:hover {
    text-decoration: underline;
}

/* ── Spinner (shown inside buttons while loading) ── */
.auth-spinner {
    display: inline-block;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(255, 255, 255, .45);
    border-top-color: #fff;
    border-radius: 50%;
    animation: authSpin .7s linear infinite;
}

@keyframes authSpin {
    to { transform: rotate(360deg); }
}

/* ========  CONTACT US STYLES START =======*/

.useme-contact-section{
    background:linear-gradient(180deg,#eef4fb 0%, #f5f8fc 100%);
    padding:70px 0 110px;
}

.useme-contact-shell{
    max-width:1180px;
    margin:0 auto;
}

.useme-contact-main{
    display:flex;
    gap:28px;
    align-items:stretch;
}

.useme-contact-left{
    width:68%;
}

.useme-contact-right{
    width:32%;
    display:flex;
    flex-direction:column;
    gap:22px;
}

.useme-contact-card{
    background:#fff;
    border-radius:30px;
    border:1px solid #e5edf7;
    box-shadow:0 18px 45px rgba(32,72,126,0.08);
}

.useme-form-card{
    padding:42px 42px 36px;
    position:relative;
    overflow:hidden;
}

.useme-form-card:before{
    content:"";
    position:absolute;
    top:-80px;
    right:-80px;
    width:220px;
    height:220px;
    background:radial-gradient(circle,rgba(24,135,255,0.10) 0%, rgba(24,135,255,0) 70%);
    border-radius:50%;
    pointer-events:none;
}

.useme-form-card:after{
    content:"";
    position:absolute;
    bottom:-60px;
    left:-60px;
    width:180px;
    height:180px;
    background:radial-gradient(circle,rgba(24,135,255,0.06) 0%, rgba(24,135,255,0) 72%);
    border-radius:50%;
    pointer-events:none;
}

.useme-contact-top-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:8px 14px;
    border-radius:999px;
    background:#edf5ff;
    color:#1787ff;
    font-size:13px;
    font-weight:700;
    margin-bottom:18px;
    position:relative;
    z-index:2;
}

.useme-contact-heading{
    font-size:46px;
    line-height:1.08;
    font-weight:800;
    color:#0f172a;
    letter-spacing:-1px;
    margin:0 0 14px;
    position:relative;
    z-index:2;
}

.useme-contact-desc{
    font-size:15px;
    line-height:1.8;
    color:#64748b;
    margin:0 0 32px;
    max-width:640px;
    position:relative;
    z-index:2;
}

.useme-contact-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px 18px;
    position:relative;
    z-index:2;
}

.useme-contact-field.full{
    grid-column:1 / -1;
}

.useme-contact-field label{
    display:block;
    font-size:14px;
    font-weight:700;
    color:#0f172a;
    margin-bottom:10px;
    padding-left:2px;
}

.useme-contact-field input,
.useme-contact-field textarea{
    width:100%;
    border:1px solid #dbe7f5;
    background:#f3f7fd;
    border-radius:16px;
    font-size:15px;
    color:#0f172a;
    outline:none;
    transition:all .25s ease;
    box-shadow:none;
}

.useme-contact-field input{
    height:60px;
    padding:0 18px;
}

.useme-contact-field textarea{
    height:180px;
    padding:18px;
    resize:none;
}

.useme-contact-field input::placeholder,
.useme-contact-field textarea::placeholder{
    color:#94a3b8;
}

.useme-contact-field input:focus,
.useme-contact-field textarea:focus{
    background:#fff;
    border-color:#1787ff;
    box-shadow:0 0 0 5px rgba(23,135,255,0.08);
}

.useme-contact-bottom{
    margin-top:22px;
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    gap:22px;
    position:relative;
    z-index:2;
}

.useme-contact-check{
    display:flex;
    align-items:flex-start;
    gap:10px;
}

.useme-contact-check input{
    margin-top:4px;
    accent-color:#1787ff;
}

.useme-contact-check label{
    font-size:14px;
    line-height:1.6;
    color:#64748b;
    margin:0;
}

.useme-contact-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:200px;
    height:58px;
    border:none;
    border-radius:16px;
    background:linear-gradient(135deg,#1e90ff 0%, #006be8 100%);
    color:#fff;
    font-size:16px;
    font-weight:700;
    box-shadow:0 16px 32px rgba(0,107,232,0.24);
    transition:all .25s ease;
}

.useme-contact-btn:hover{
    transform:translateY(-2px);
    color:#fff;
}

.useme-side-card{
    padding:24px 22px;
    display:flex;
    align-items:flex-start;
    gap:16px;
    min-height:132px;
}

.useme-side-icon{
    width:62px;
    height:62px;
    min-width:62px;
    border-radius:18px;
    background:linear-gradient(180deg,#eef5ff 0%, #e8f1ff 100%);
    border:1px solid #d8e5f6;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:inset 0 1px 0 rgba(255,255,255,0.8);
}

.useme-side-icon img{
    width:26px;
    height:26px;
    object-fit:contain;
}

.useme-side-content{
    flex:1;
    padding-top:2px;
}

.useme-side-title{
    font-size:18px;
    font-weight:800;
    color:#0f172a;
    margin:0 0 10px;
}

.useme-side-text,
.useme-side-text a{
    font-size:15px;
    line-height:1.8;
    color:#475569;
    text-decoration:none;
    transition:.25s;
}

.useme-side-text a:hover{
    color:#1787ff;
}

.useme-social-row{
    display:flex;
    gap:10px;
    margin-top:14px;
}

.useme-social-row a{
    width:42px;
    height:42px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#f4f8ff;
    border:1px solid #dbe7f6;
    color:#1787ff;
    font-size:15px;
    transition:all .25s ease;
}

.useme-social-row a:hover{
    background:#1787ff;
    border-color:#1787ff;
    color:#fff;
    transform:translateY(-2px);
}

.useme-map-wrap{
    margin-top:34px;
    border-radius:30px;
    overflow:hidden;
    border:1px solid #e5edf7;
    box-shadow:0 18px 45px rgba(32,72,126,0.08);
    background:#fff;
    position:relative;
}

.useme-map-wrap iframe{
    width:100%;
    height:430px;
    border:0;
    display:block;
}

.useme-map-badge{
    position:absolute;
    top:24px;
    left:24px;
    z-index:2;
    background:rgba(255,255,255,0.96);
    border:1px solid #e5edf7;
    box-shadow:0 10px 25px rgba(32,72,126,0.10);
    border-radius:16px;
    padding:14px 16px;
    font-size:14px;
    font-weight:700;
    color:#0f172a;
}

.ajax-response{
    margin-top:12px;
    font-size:14px;
}

@media (max-width: 1199px){
    .useme-contact-heading{
        font-size:40px;
    }
}

@media (max-width: 991px){
    .useme-contact-main{
        flex-direction:column;
    }

    .useme-contact-left,
    .useme-contact-right{
        width:100%;
    }

    .useme-contact-right{
        display:grid;
        grid-template-columns:1fr;
    }

    .useme-form-card{
        padding:34px 24px 30px;
    }

    .useme-contact-heading{
        font-size:34px;
    }
}

@media (max-width: 767px){
    .useme-contact-section{
        padding:40px 0 80px;
    }

    .useme-contact-grid{
        grid-template-columns:1fr;
    }

    .useme-contact-field.full{
        grid-column:auto;
    }

    .useme-contact-heading{
        font-size:28px;
        line-height:1.18;
        letter-spacing:-0.5px;
    }

    .useme-contact-desc{
        font-size:14px;
        line-height:1.7;
        margin-bottom:24px;
    }

    .useme-contact-btn{
        width:100%;
        min-width:100%;
    }

    .useme-side-card{
        min-height:auto;
        padding:20px 18px;
    }

    .useme-side-icon{
        width:56px;
        height:56px;
        min-width:56px;
        border-radius:16px;
    }

    .useme-map-wrap{
        border-radius:24px;
    }

    .useme-map-wrap iframe{
        height:320px;
    }

    .useme-map-badge{
        top:14px;
        left:14px;
        right:14px;
        font-size:13px;
        padding:12px 14px;
    }
}

/* ========  FOOTER STYLES START  ======= */

/* Footer Base */
.useme-footer{
    background:#f3f3f3;
    color:#111;
    font-family:Arial,Helvetica,sans-serif;
}

/* Footer Top Strip */

.useme-footer .footer-top-strip{
    text-align:center;
    padding:20px 15px;
    font-size:14px;
    font-weight:500;
    border-bottom:1px solid #d8d8d8;
    background:#f3f3f3;
}

/* Footer Links Grid */

.useme-footer .footer-links-row{
    display:grid;
    grid-template-columns:repeat(5, minmax(0,1fr));
    gap:30px;
    padding-bottom:30px;
    border-bottom:1px solid #e1e1e1;
}

/* Footer Social Icons */

.useme-footer .footer-social a{
    width:38px;
    height:38px;
    border-radius:50%;
    background:#fff;
    border:1px solid #d6d6d6;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#111;
    text-decoration:none;
    font-size:14px;
    transition:.25s ease;
}

.useme-footer .footer-social a:hover{
    transform:translateY(-2px);
    box-shadow:0 8px 18px rgba(0,0,0,.08);
}

/* Footer Dark Section */
.useme-footer .footer-dark{
    background:#0c1522;
    color:#d6dde6;
    padding:28px 20px 18px;
}

.useme-footer .footer-dark-inner{
    max-width:1200px;
    margin:0 auto;
}

.useme-footer .footer-dark-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:24px;
    margin-bottom:20px;
}

.useme-footer .footer-dark-col:nth-child(1) {
    justify-self: start;   /* left */
}

.useme-footer .footer-dark-col:nth-child(2) {
    justify-self: center;  /* center */
}

.useme-footer .footer-dark-col:nth-child(3) {
    justify-self: end;     /* right */
}

.useme-footer .footer-dark-col a{
    display:block;
    color:#d6dde6;
    text-decoration:none;
    font-size:13px;
    line-height:1.8;
}

.useme-footer .footer-dark-col a:hover{
    text-decoration:underline;
}


@media (max-width:768px){
    .tp-slider-height{
        min-height:180px !important;
        height:auto !important;
    }

    .tp-slider-item{
        background-size:cover !important;
        background-position:center !important;
    }
}

.useme-footer *{
    box-sizing:border-box;
}



.useme-footer .footer-top-strip a{
    color:#111;
    text-decoration:none;
    font-weight:700;
}

.useme-footer .footer-main{
    max-width:1200px;
    margin:0 auto;
    padding:30px 20px 25px;
}

.useme-footer .footer-col h4{
    font-size:15px;
    font-weight:700;
    margin:0 0 14px;
    color:#111;
    letter-spacing:.2px;
}

.useme-footer .footer-col ul{
    list-style:none;
    padding:0;
    margin:0;
}

.useme-footer .footer-col ul li{
    margin-bottom:9px;
    line-height:1.5;
    font-size:14px;
    color:#333;
}

.useme-footer .footer-col ul li a{
    text-decoration:none;
    color:#333;
    transition:.2s ease;
}

.useme-footer .footer-col ul li a:hover{
    color:#000;
    text-decoration:underline;
}

.useme-footer .footer-social{
    display:flex;
    gap:14px;
    flex-wrap:wrap;
    margin-top:6px;
}


.useme-footer .footer-middle{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px;
    flex-wrap:wrap;
    padding:28px 0 10px;
}

.useme-footer .footer-app-box{
    display:flex;
    align-items:center;
    gap:18px;
    flex-wrap:wrap;
}

.useme-footer .footer-qr{
    width:86px;
    height:86px;
    background:#fff;
    border:1px solid #dcdcdc;
    border-radius:6px;
    padding:2px;
    display:flex;
    align-items:center;
    justify-content:center;
}

.useme-footer .footer-qr img{
    width:100%;
    height:100%;
    object-fit:contain;
    display:block;
}

.useme-footer .footer-app-content h5{
    margin:0 0 12px;
    font-size:15px;
    line-height:1.5;
    color:#111;
    font-weight:700;
    max-width:320px;
}

.useme-footer .store-buttons{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
}

.useme-footer .store-buttons a{
    display:inline-block;
    text-decoration:none;
}

.useme-footer .store-buttons img{
    height:42px;
    width:auto;
    display:block;
    border-radius:6px;
}

.useme-footer .footer-brand-box{
    text-align:left;
    min-width:180px;
}

.useme-footer .footer-brand-logo img{
    width:180px;
    max-width:100%;
    display:block;
}

.useme-footer .footer-bottom-note{
    text-align:center;
    font-size:12px;
    line-height:1.8;
    color:#c9d1da;
}

.useme-footer .footer-bottom-note a{
    color:#c9d1da;
    text-decoration:none;
    margin:0 8px;
}

.useme-footer .footer-bottom-note a:hover{
    text-decoration:underline;
}

.tp-theme-settings-open{
    display:none;
}

.tp-product-category-thumb,
.tp-product-category-thumb.fix{
    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
    width:auto !important;
    height:auto !important;
}

.tp-product-category-thumb::before,
.tp-product-category-thumb::after{
    display:none !important;
}

.tp-product-category-thumb img{
    background:transparent !important;
    width:120px;
    height:auto;
    object-fit:contain;
}

@media (max-width: 991px){
    .useme-footer .footer-links-row{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }

    .useme-footer .footer-dark-grid{
        grid-template-columns:repeat(2, minmax(0,1fr));
    }
}

@media (max-width: 767px){
    .useme-footer .footer-top-strip{
        font-size:14px;
        padding:16px 12px;
    }

    .useme-footer .footer-main{
        padding:24px 14px 20px;
    }

    .useme-footer .footer-links-row{
        grid-template-columns:repeat(2, minmax(0,1fr));
        gap:22px 12px;
        padding-bottom:22px;
        text-align:center;
    }

    .useme-footer .footer-col{
        text-align:center;
    }

    .useme-footer .footer-col h4{
        font-size:13px;
        margin-bottom:10px;
    }

    .useme-footer .footer-col ul li{
        font-size:13px;
        margin-bottom:6px;
    }

    .useme-footer .footer-col:nth-child(3),
    .useme-footer .footer-col:nth-child(4),
    .useme-footer .footer-col:nth-child(5){
        grid-column:1 / -1;
    }

    .useme-footer .footer-social{
        justify-content:center;
        align-items:center;
    }

    .useme-footer .footer-middle{
        flex-direction:column;
        align-items:center;
        justify-content:center;
        text-align:center;
        gap:20px;
    }

    .useme-footer .footer-app-box{
        flex-direction:column;
        align-items:center;
        justify-content:center;
        text-align:center;
        width:100%;
    }

    .useme-footer .footer-app-content h5{
        max-width:100%;
        text-align:center;
    }

    .useme-footer .store-buttons{
        width:100%;
        justify-content:center;
    }

    .useme-footer .footer-brand-box{
        width:100%;
        text-align:center;
        min-width:auto;
    }

    .useme-footer .footer-brand-logo img{
        margin:0 auto;
    }

    .useme-footer .footer-dark{
        padding:22px 14px 16px;
    }

    .useme-footer .footer-dark-grid{
        grid-template-columns:1fr 1fr;
        gap:18px 10px;
        text-align:center;
    }

    .useme-footer .footer-dark-col{
        text-align:center;
    }

    .useme-footer .footer-bottom-note{
        text-align:center;
    }
}

@media (max-width: 480px){
    .useme-footer .footer-links-row{
        grid-template-columns:1fr 1fr;
        gap:20px 10px;
    }

    .useme-footer .footer-col h4{
        font-size:12px;
    }

    .useme-footer .footer-col ul li{
        font-size:12px;
        line-height:1.45;
    }

    .useme-footer .footer-social{
        gap:10px;
    }

    .useme-footer .footer-social a{
        width:34px;
        height:34px;
        font-size:14px;
    }

    .useme-footer .footer-qr{
        width:78px;
        height:78px;
    }

    .useme-footer .store-buttons{
        flex-direction:row;
        justify-content:center;
        align-items:center;
        gap:8px;
    }

    .useme-footer .store-buttons img{
        height:36px;
    }

    .useme-footer .footer-dark-grid{
        grid-template-columns:1fr;
    }
}

/* Force single column thumbnails */
#productDetailsNavThumb {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    width: 80px;
}

#productDetailsNavThumb .nav-link {
    width: 80px !important;
    padding: 4px !important;
    margin-bottom: 6px !important;
    border-radius: 6px !important;
}

/* Webkit scrollbar styling */
nav:has(#productDetailsNavThumb)::-webkit-scrollbar {
    width: 4px;
}
nav:has(#productDetailsNavThumb)::-webkit-scrollbar-track {
    background: transparent;
}
nav:has(#productDetailsNavThumb)::-webkit-scrollbar-thumb {
    background: #cccccc;
    border-radius: 4px;
}