/* ============================================
   🍎 DIALAB - Apple-Style Design System v2
   ============================================ */

/* === Font: San Francisco (Apple's font stack) === */
body {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Helvetica Neue", "Segoe UI", Roboto, Arial, sans-serif !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    color: #1D1D1F !important;
    background: #FFFFFF !important;
}

/* === Navbar Apple-style - Odoo specific === */
#top.o_header_standard,
header#top,
header.o_header_standard,
.o_top_fixed_element {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 9999 !important;
    background: rgba(255, 255, 255, 0.8) !important;
    backdrop-filter: saturate(180%) blur(20px) !important;
    -webkit-backdrop-filter: saturate(180%) blur(20px) !important;
    border-bottom: none !important;
    box-shadow: none !important;
    height: 48px !important;
    min-height: 48px !important;
}

/* Navbar inner nav */
header#top nav.navbar,
header.o_header_standard nav.navbar,
#top nav.navbar {
    background: transparent !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 0 !important;
    box-shadow: none !important;
    border-bottom: none !important;
}

/* Navbar container */
header#top .container,
#top .o_main_nav {
    max-width: 980px !important;
    margin: 0 auto !important;
    padding: 0 22px !important;
    height: 48px !important;
    display: flex !important;
    align-items: center !important;
}

/* Page body needs padding-top for fixed navbar */
#wrap {
    padding-top: 48px !important;
}

/* Logo */
.navbar-brand.logo {
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1D1D1F !important;
    letter-spacing: -0.5px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
}

.navbar-brand.logo img {
    max-height: 32px !important;
    width: auto !important;
}

/* Nav links - direct children of top_menu */
#top_menu > .nav-item > .nav-link,
ul#top_menu > li > a {
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #1D1D1F !important;
    letter-spacing: 0.01em !important;
    padding: 0 18px !important;
    line-height: 48px !important;
    transition: color 0.2s ease !important;
    background: transparent !important;
    border: none !important;
}

#top_menu > .nav-item > .nav-link:hover,
ul#top_menu > li > a:hover {
    color: #A08B77 !important;
}

/* Hide the generic +1 555 phone number in navbar */
header a[href*="tel"] {
    display: none !important;
}

/* Style the "CONTÁCTANOS" button in navbar */
#top_menu a[href*="contactus"],
a[href*="contactus"] {
    background: #A08B77 !important;
    color: #FFFFFF !important;
    border-radius: 980px !important;
    padding: 6px 14px !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    border: none !important;
    margin-left: 8px !important;
}

#top_menu a[href*="contactus"]:hover,
a[href*="contactus"]:hover {
    background: #8C7763 !important;
    color: #FFFFFF !important;
}

/* === Hero Section Apple-style === */
#wrap > div:first-child,
#wrap > section:first-child,
.s_cover,
.s_banner {
    text-align: center !important;
    padding: 88px 0 60px !important;
    background: #FFFFFF !important;
}

#wrap h1:first-of-type,
.page-title {
    font-size: 54px !important;
    font-weight: 700 !important;
    color: #1D1D1F !important;
    letter-spacing: -1.5px !important;
    line-height: 1.1 !important;
    margin-bottom: 12px !important;
}

h2 {
    font-size: 40px !important;
    font-weight: 700 !important;
    color: #1D1D1F !important;
    letter-spacing: -0.8px !important;
    line-height: 1.15 !important;
}

.subtitle,
.lead,
p.lead {
    font-size: 22px !important;
    font-weight: 400 !important;
    color: #86868B !important;
    line-height: 1.4 !important;
    margin-bottom: 24px !important;
}

/* === Apple-style Buttons === */
.btn-primary,
a.btn-primary,
button.btn-primary {
    background: #A08B77 !important;
    border: none !important;
    color: #FFFFFF !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    padding: 12px 22px !important;
    border-radius: 980px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    display: inline-block !important;
    line-height: 1.2 !important;
}

.btn-primary:hover {
    background: #8C7763 !important;
}

.btn-secondary,
a.btn-secondary {
    background: transparent !important;
    border: 1px solid #A08B77 !important;
    color: #A08B77 !important;
    font-size: 17px !important;
    font-weight: 400 !important;
    padding: 11px 21px !important;
    border-radius: 980px !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
}

.btn-secondary:hover {
    background: rgba(160, 139, 119, 0.08) !important;
}

/* === Apple-style Cards === */
.card,
.s_features .col-lg-3,
.s_features .col-lg-4,
.o_website_sale .oe_product .oe_product_cart {
    border: none !important;
    border-radius: 18px !important;
    background: #F5F5F7 !important;
    box-shadow: none !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
}

.card:hover,
.s_features .col-lg-3:hover,
.s_features .col-lg-4:hover,
.o_website_sale .oe_product .oe_product_cart:hover {
    transform: scale(1.02) !important;
    background: #EFEFF1 !important;
}

/* Product grid spacing */
.oe_product {
    padding: 12px !important;
}

/* === Section styling === */
section, 
.o_website_sale_products,
.oe_structure {
    padding: 60px 0 !important;
}

section:nth-child(even),
.oe_structure:nth-child(even) {
    background: #F5F5F7 !important;
}

section:nth-child(odd),
.oe_structure:nth-child(odd) {
    background: #FFFFFF !important;
}

/* Section titles */
section h2 {
    position: relative !important;
    padding-bottom: 0 !important;
    margin-bottom: 32px !important;
}

section h2::after {
    display: none !important;
}

/* === Footer Apple-style === */
footer,
.o_footer {
    background: #F5F5F7 !important;
    color: #86868B !important;
    font-size: 12px !important;
    padding: 0 !important;
    border-top: 1px solid #D2D2D7 !important;
}

footer a,
.o_footer a {
    color: #424245 !important;
    text-decoration: none !important;
}

footer a:hover,
.o_footer a:hover {
    color: #A08B77 !important;
}

/* === Typography improvements === */
p {
    font-size: 17px !important;
    line-height: 1.5 !important;
    color: #1D1D1F !important;
}

/* === Remove generic social media icons === */
.fa-facebook, .fa-twitter, .fa-linkedin, .fa-instagram, .fa-youtube,
.social-media, .o_facebook, .o_twitter, .o_linkedin, .o_instagram {
    display: none !important;
}

/* === Product page refinements === */
.oe_price, .product_price {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1D1D1F !important;
}

/* === Mobile responsive === */
@media (max-width: 768px) {
    h1, .page-title { font-size: 36px !important; }
    h2 { font-size: 28px !important; }
    .subtitle, .lead, p.lead { font-size: 18px !important; }
    #top .o_main_nav { padding: 0 16px !important; }
    section { padding: 40px 0 !important; }
}
