/* ============================================================
   FIX MEGA MENU - CIBLAGE CORRECT
============================================================ */

/* Masquer toutes les duplications */
.offcanvas-menu,
#sp-top-bar .sp-dropdown,
.header-modules .sp-dropdown,
div[class*="offcanvas"] .sp-dropdown,
.position-left .sp-dropdown,
.position-debug .sp-dropdown {
    display: none !important;
    visibility: hidden !important;
}

/* Cibler UNIQUEMENT le menu dans header-right ou menu */
.header-right .sp-megamenu-parent > .sp-dropdown,
#sp-menu .sp-megamenu-parent > .sp-dropdown {
    display: none;
    position: absolute !important;
    top: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: white !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.15) !important;
    padding: 24px !important;
    margin-top: 5px !important;
    min-width: 750px !important;
    z-index: 9999 !important;
}

/* Afficher au survol */
.header-right .sp-megamenu-parent:hover > .sp-dropdown,
#sp-menu .sp-megamenu-parent:hover > .sp-dropdown {
    display: block !important;
    visibility: visible !important;
}

/* Bouton CLASSIFIEDS - VISIBLE sur tous les fonds */
.header-right .sp-megamenu-parent > a,
#sp-menu .sp-megamenu-parent > a {
    color: #1f2937 !important; /* Gris foncé pour fond blanc */
    background: rgba(187,0,49,0.05) !important;
    padding: 10px 20px !important;
    border-radius: 6px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
    border: 2px solid transparent !important;
}

.header-right .sp-megamenu-parent > a:hover,
#sp-menu .sp-megamenu-parent > a:hover {
    background: #BB0031 !important;
    color: white !important;
    border-color: #BB0031 !important;
}

/* Grid 3 colonnes */
.header-right .sp-dropdown-inner,
#sp-menu .sp-dropdown-inner {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 12px !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Items avec icônes */
.header-right .sp-dropdown-inner > .sp-menu-item,
#sp-menu .sp-dropdown-inner > .sp-menu-item {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item > a,
#sp-menu .sp-dropdown-inner > .sp-menu-item > a {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 14px !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    border: 1px solid #f3f4f6 !important;
    background: white !important;
    color: #1f2937 !important;
    font-size: 14px !important;
    font-weight: 600 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item > a:hover,
#sp-menu .sp-dropdown-inner > .sp-menu-item > a:hover {
    background: rgba(187,0,49,0.05) !important;
    border-color: #BB0031 !important;
    transform: translateX(3px) !important;
}

/* Icônes FontAwesome */
.header-right .sp-dropdown-inner > .sp-menu-item > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item > a::before {
    content: '';
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 40px !important;
    height: 40px !important;
    border-radius: 8px !important;
    font-family: 'Font Awesome 5 Free', 'FontAwesome' !important;
    font-weight: 900 !important;
    font-size: 18px !important;
    flex-shrink: 0 !important;
}

/* Icônes par catégorie */
.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(1) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(1) > a::before {
    content: '\f1b9' !important; /* Vehicles */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(2) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(2) > a::before {
    content: '\f015' !important; /* Real Estate */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(3) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(3) > a::before {
    content: '\f0b1' !important; /* Jobs */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(4) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(4) > a::before {
    content: '\f3cd' !important; /* Electronics */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(5) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(5) > a::before {
    content: '\f553' !important; /* Fashion */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(6) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(6) > a::before {
    content: '\f4d6' !important; /* Home & Garden */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(7) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(7) > a::before {
    content: '\f11b' !important; /* Hobbies */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(8) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(8) > a::before {
    content: '\f1b0' !important; /* Pets */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(9) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(9) > a::before {
    content: '\f53f' !important; /* Art */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(10) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(10) > a::before {
    content: '\f77c' !important; /* Childcare */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(11) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(11) > a::before {
    content: '\f466' !important; /* Garage Sale */
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:nth-child(12) > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:nth-child(12) > a::before {
    content: '\f521' !important; /* Antique */
    background: rgba(255,41,74,0.08) !important;
    color: #ff294a !important;
}

/* View All Categories */
.header-right .sp-dropdown-inner > .sp-menu-item:last-child,
#sp-menu .sp-dropdown-inner > .sp-menu-item:last-child {
    grid-column: 1 / -1 !important;
    border-top: 1px solid #e5e7eb !important;
    padding-top: 16px !important;
    margin-top: 12px !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:last-child > a,
#sp-menu .sp-dropdown-inner > .sp-menu-item:last-child > a {
    justify-content: center !important;
    color: #BB0031 !important;
    border: none !important;
    background: rgba(187,0,49,0.03) !important;
}

.header-right .sp-dropdown-inner > .sp-menu-item:last-child > a::before,
#sp-menu .sp-dropdown-inner > .sp-menu-item:last-child > a::before {
    content: '\f00a' !important;
    background: rgba(187,0,49,0.08) !important;
    color: #BB0031 !important;
}

/* ══ SSG REGISTER PAGE REDESIGN ══════════════════════════════════════════ */

body.com-comprofiler.view-registers #sp-component {
    background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 50%, #fff7ed 100%) !important;
    padding: 40px 16px !important;
    min-height: 70vh;
}

body.com-comprofiler.view-registers .cbRegistration {
    font-family: sans-serif;
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 8px 40px rgba(0,0,0,.14);
    max-width: 640px;
    margin: 0 auto;
}

/* Hero banner via ::before on the form wrapper */
body.com-comprofiler.view-registers .cbRegistration::before {
    content: '';
    display: block;
    background: linear-gradient(135deg, #fb923c 0%, #ea7318 55%, #ff294a 100%);
    padding: 28px 28px 22px;
    text-align: center;
}

/* Hero text overlay using the page title header */
body.com-comprofiler.view-registers .cb-page-header,
body.com-comprofiler.view-registers .cbRegistrationHeader {
    background: linear-gradient(135deg, #fb923c 0%, #ea7318 55%, #ff294a 100%) !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 28px 28px 22px !important;
    margin: 0 !important;
    text-align: center !important;
}

body.com-comprofiler.view-registers .cb-page-header-title,
body.com-comprofiler.view-registers .cbRegistrationTitle {
    font-family: sans-serif !important;
    font-size: 24px !important;
    font-weight: 700 !important;
    color: #fff !important;
    letter-spacing: .4px !important;
    margin: 0 0 4px !important;
    padding: 0 !important;
    border: none !important;
}

body.com-comprofiler.view-registers .cb-page-header-description,
body.com-comprofiler.view-registers .cbRegistrationIntro {
    font-family: sans-serif !important;
    font-size: 13px !important;
    color: rgba(255,255,255,.85) !important;
    margin: 0 !important;
}

/* Subtitle injected when there's no intro message configured */
body.com-comprofiler.view-registers .cb-page-header::after {
    content: 'Your worldwide marketplace \2014 buy, sell & connect';
    display: block;
    font-family: sans-serif;
    font-size: 13px;
    color: rgba(255,255,255,.85);
    margin-top: 4px;
}

/* Form body padding */
body.com-comprofiler.view-registers .cbRegistrationDiv {
    padding: 24px 28px 16px !important;
}

/* Field rows */
body.com-comprofiler.view-registers .cb_form .form-group,
body.com-comprofiler.view-registers .cb_form .control-group {
    margin-bottom: 14px !important;
}

/* Labels */
body.com-comprofiler.view-registers .cb_form .control-label,
body.com-comprofiler.view-registers .cb_form label {
    font-family: sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: #6b7280 !important;
    text-transform: uppercase !important;
    letter-spacing: .6px !important;
}

/* Inputs */
body.com-comprofiler.view-registers .cb_form .form-control,
body.com-comprofiler.view-registers .cb_form input[type=text],
body.com-comprofiler.view-registers .cb_form input[type=email],
body.com-comprofiler.view-registers .cb_form input[type=password],
body.com-comprofiler.view-registers .cb_form select {
    width: 100% !important;
    box-sizing: border-box !important;
    border: 2px solid #e5e7eb !important;
    border-radius: 10px !important;
    padding: 11px 14px !important;
    font-family: sans-serif !important;
    font-size: 14px !important;
    color: #1e293b !important;
    background: #f8fafc !important;
    transition: border-color .2s, box-shadow .2s !important;
    outline: none !important;
}

body.com-comprofiler.view-registers .cb_form .form-control:focus,
body.com-comprofiler.view-registers .cb_form input[type=text]:focus,
body.com-comprofiler.view-registers .cb_form input[type=email]:focus,
body.com-comprofiler.view-registers .cb_form input[type=password]:focus {
    border-color: #fb923c !important;
    background: #fff !important;
    box-shadow: 0 0 0 3px rgba(251,146,60,.12) !important;
}

/* Submit button */
body.com-comprofiler.view-registers .cbRegistrationSubmit,
body.com-comprofiler.view-registers .cbRegistrationButtons .btn-primary {
    background: linear-gradient(135deg, #fb923c, #ea7318) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 11px !important;
    padding: 13px 20px !important;
    font-family: sans-serif !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    width: 100% !important;
    cursor: pointer !important;
    box-shadow: 0 4px 14px rgba(234,115,24,.3) !important;
    transition: opacity .2s, transform .2s, box-shadow .2s !important;
    margin-top: 8px !important;
}

body.com-comprofiler.view-registers .cbRegistrationSubmit:hover,
body.com-comprofiler.view-registers .cbRegistrationButtons .btn-primary:hover {
    opacity: .9 !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 18px rgba(234,115,24,.4) !important;
}

/* Required field star */
body.com-comprofiler.view-registers .cb_form .required-mark,
body.com-comprofiler.view-registers .cb_form .star {
    color: #fb923c !important;
}

/* Checkbox/radio */
body.com-comprofiler.view-registers .cb_form input[type=checkbox],
body.com-comprofiler.view-registers .cb_form input[type=radio] {
    accent-color: #fb923c !important;
}

/* Footer conclusion */
body.com-comprofiler.view-registers .cbRegistrationConclusion {
    padding: 0 28px 20px !important;
    font-family: sans-serif !important;
    font-size: 13px !important;
    color: #6b7280 !important;
    text-align: center !important;
    background: none !important;
    border: none !important;
}

@media (max-width: 479px) {
    body.com-comprofiler.view-registers .cbRegistrationDiv {
        padding: 18px 16px 8px !important;
    }
}

/* ══ END SSG REGISTER REDESIGN ════════════════════════════════════════════ */

/* Masquer "Powered by Community Builder" sur toutes les pages CB */
.cbPoweredBy {
    display: none !important;
}

/* Responsive */
@media (max-width: 1024px) {
    .header-right .sp-dropdown-inner,
    #sp-menu .sp-dropdown-inner {
        grid-template-columns: repeat(2, 1fr) !important;
    }
    
    .header-right .sp-megamenu-parent > .sp-dropdown,
    #sp-menu .sp-megamenu-parent > .sp-dropdown {
        min-width: 500px !important;
    }
}

@media (max-width: 768px) {
    .header-right .sp-dropdown-inner,
    #sp-menu .sp-dropdown-inner {
        grid-template-columns: 1fr !important;
    }
    
    .header-right .sp-megamenu-parent > .sp-dropdown,
    #sp-menu .sp-megamenu-parent > .sp-dropdown {
        min-width: 90vw !important;
        left: 5vw !important;
        transform: none !important;
    }
}
