/*
 * Vitriine On-line — Overrides para o SITE PUBLICO do 6amMart
 * Aplicado em [cliente].vitriine.online e na landing 6amMart
 * Nao toca em main.css / bootstrap / owl — carrega DEPOIS
 */

:root {
    --vt-purple: #6C3CE1;
    --vt-purple-light: #8B5CF6;
    --vt-purple-dark: #5227CC;
    --vt-dark: #121214;
    --vt-gray: #6B7280;
    --vt-gradient: linear-gradient(135deg, #6C3CE1 0%, #8B5CF6 50%, #A78BFA 100%);
}

/* ============================================================
 *  FONTE INTER como padrao no front
 * ============================================================ */
body, input, textarea, select, button, .btn {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

h1, h2, h3, h4, h5, h6, .title {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    letter-spacing: -0.01em;
}

/* ============================================================
 *  BOTOES PRIMARIOS (CTA principal do 6amMart)
 * ============================================================ */
.cmn-btn,
.btn-primary,
.btn--primary,
button.cmn-btn,
a.cmn-btn,
a.btn-primary {
    background: #6C3CE1 !important;
    border-color: #6C3CE1 !important;
    color: #fff !important;
    border-radius: 8px !important;
    padding: 12px 28px !important;
    font-weight: 500 !important;
    transition: all 0.2s ease-out !important;
}
.cmn-btn:hover,
.btn-primary:hover,
a.cmn-btn:hover {
    background: #5227CC !important;
    color: #fff !important;
    transform: translateY(-2px);
    box-shadow: 0 8px 24px rgba(108, 60, 225, 0.3) !important;
}

.cmn-btn-outline,
.btn-outline-primary {
    background: transparent !important;
    border: 2px solid #6C3CE1 !important;
    color: #6C3CE1 !important;
    border-radius: 8px !important;
}
.cmn-btn-outline:hover,
.btn-outline-primary:hover {
    background: #6C3CE1 !important;
    color: #fff !important;
}

/* ============================================================
 *  TEXTO E LINKS
 * ============================================================ */
a:not(.btn):not(.cmn-btn):not(.nav-link) {
    color: #6C3CE1;
}
a:not(.btn):not(.cmn-btn):not(.nav-link):hover {
    color: #5227CC;
}

.text-primary,
.primary-text {
    color: #6C3CE1 !important;
}

/* ============================================================
 *  BADGES E TAGS
 * ============================================================ */
.bg-primary,
.bg-primary-light {
    background-color: #6C3CE1 !important;
    color: #fff !important;
}
.badge-primary {
    background-color: rgba(108, 60, 225, 0.1) !important;
    color: #6C3CE1 !important;
}

/* ============================================================
 *  CARDS / LOJAS / MODULOS (elementos de destaque)
 * ============================================================ */
.card,
.module-item,
.store-item,
.info-box {
    border-radius: 12px !important;
    transition: all 0.25s ease-out;
}
.module-item:hover,
.store-item:hover {
    box-shadow: 0 8px 32px rgba(108, 60, 225, 0.15) !important;
    transform: translateY(-4px);
}

/* ============================================================
 *  BANNER / HERO DA LANDING
 * ============================================================ */
.banner-section {
    background: var(--vt-gradient) !important;
}
.banner-section h1.title,
.banner-section .text {
    color: #fff !important;
}

/* ============================================================
 *  FORM INPUTS
 * ============================================================ */
.form-control:focus,
input:focus,
textarea:focus,
select:focus {
    border-color: #6C3CE1 !important;
    box-shadow: 0 0 0 0.2rem rgba(108, 60, 225, 0.15) !important;
    outline: none !important;
}

/* ============================================================
 *  NEWSLETTER / CTA FORMS
 * ============================================================ */
.newsletter-form input[type="submit"],
.newsletter-form button {
    background: #6C3CE1 !important;
    color: #fff !important;
    border-radius: 8px !important;
}

/* ============================================================
 *  FOOTER
 * ============================================================ */
.footer-section {
    background: #121214 !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
.footer-section h3,
.footer-section h4,
.footer-section .footer-title {
    color: #fff !important;
}
.footer-section a {
    color: rgba(255, 255, 255, 0.7) !important;
    transition: color 0.2s ease-out;
}
.footer-section a:hover {
    color: #fff !important;
}

/* ============================================================
 *  SEÇÕES DE DESTAQUE (como earn_money, why_choose_us, etc)
 * ============================================================ */
.cmn-title,
.section-title h2 {
    color: #121214 !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em !important;
}
.cmn-sub-title,
.section-title p {
    color: #6B7280 !important;
}

/* ============================================================
 *  ICONS/FEATURES COM DESTAQUE VERDE NATIVO 6amMart → ROXO
 * ============================================================ */
.features-item .icon,
.single-feature .icon-box,
.why-choose-icon {
    background: rgba(108, 60, 225, 0.1) !important;
    color: #6C3CE1 !important;
}

/* Cores especificas do 6amMart que precisam ser sobrescritas */
[style*="background-color: #00A95A"],
[style*="background-color: #00C569"],
[style*="background-color: #039D55"] {
    background-color: #6C3CE1 !important;
}
[style*="color: #00A95A"],
[style*="color: #00C569"],
[style*="color: #039D55"] {
    color: #6C3CE1 !important;
}

/* ============================================================
 *  SHAPES/DECORAÇÕES
 * ============================================================ */
.banner-shape-1 path,
.banner-shape-2 path {
    fill: rgba(255, 255, 255, 0.1) !important;
}