/* ==========================================================================
   Peixoto Mais — identidade visual
   Laranja #FF5D00 (primária) · Verde #B0D235 (apoio)
   Header/Footer: fundo BRANCO com fonte escura (substitui o azul do demo)
   ========================================================================== */

/* ---------- TOP BAR: laranja (igual ao site atual) ---------- */
.page-header { background: #f2f2f2 !important; color: #282828 !important; }
.panel.wrapper,
.header.panel,
.cdz-header-top,
.header-top-container,
.hd-top,
.header-top,
.header-account-panel {
    background-color: #FF5D00 !important;
}
.panel.wrapper, .panel.wrapper a, .panel.wrapper .i-text, .panel.wrapper .greet,
.header.panel, .header.panel a, .header.panel .i-text,
.cdz-header-top, .cdz-header-top a,
.header-top-container, .header-top-container a,
.hd-top, .hd-top a, .header-top, .header-top a {
    color: #ffffff !important;
}
.panel.wrapper a:hover, .header.panel a:hover,
.cdz-header-top a:hover, .header-top-container a:hover, .hd-top a:hover { color: #ffe4d3 !important; }

/* ---------- MIOLO (logo + busca): claro ---------- */
.header.content {
    background: #f2f2f2 !important;
    color: #282828 !important;
}
.header.content a, .header.content .i-text, .header.content .hd-icon-links a { color: #454545 !important; }
.header.content a:hover, .header.content .hd-icon-links a:hover { color: #FF5D00 !important; }

/* ---------- BARRA DO MENU: PRETA, texto/ícones brancos, hover laranja ---------- */
.header-bottom,
.cdz-navigation,
.cdz-horizontal-menu,
.cdz-horizontal-menu .groupmenu,
.page-header .sticky-menu.active {
    background-color: #000000 !important;
    border-color: #1c1c1c !important;
    box-shadow: none;
}
.cdz-horizontal-menu > .groupmenu > li.groupmenu-item > a,
.cdz-horizontal-menu > .groupmenu > li.level0 > a.menu-link,
.cdz-horizontal-menu > .groupmenu > li.level0 > a,
.cdz-horizontal-menu > .groupmenu > li > a,
.cdz-horizontal-menu > .groupmenu > li > a .cdz-nav-title,
.cdz-horizontal-menu > .groupmenu > li > a span,
.cdz-horizontal-menu > .groupmenu > li > a i {
    color: #ffffff !important;
    background: transparent !important;
    border-color: #1c1c1c !important;
}
.cdz-horizontal-menu > .groupmenu > li.groupmenu-item:hover > a,
.cdz-horizontal-menu > .groupmenu > li.level0:hover > a.menu-link,
.cdz-horizontal-menu > .groupmenu > li.level0:hover > a,
.cdz-horizontal-menu > .groupmenu > li > a:hover {
    background-color: #FF5D00 !important;
    color: #ffffff !important;
}
.cdz-horizontal-menu > .groupmenu > li.groupmenu-item:hover > a span,
.cdz-horizontal-menu > .groupmenu > li > a:hover span,
.cdz-horizontal-menu > .groupmenu > li > a:hover i { color: #ffffff !important; }

/* Dropdowns permanecem claros */
.groupmenu-drop { background-color: #ffffff !important; }
.groupmenu-drop a { color: #282828 !important; }
.cdz-menu:not(.cdz-toggle-menu) .groupmenu-drop a:hover,
.cdz-menu.cdz-toggle-menu .item.level-top > .menu-link:hover,
.cdz-menu.cdz-toggle-menu .groupmenu-drop li.item a:hover { color: #FF5D00 !important; }
.dropdown-menustyle02 .groupdrop-link li a:hover:before { background-color: #FF5D00 !important; }
.dmlb, .dmlb-new { color: #FF5D00 !important; }

/* Botão de busca: laranja */
.header-search .actions .search[class] { background: #FF5D00 !important; }

/* ---------- FOOTER: azul -> branco ---------- */
.page-footer { background: #ffffff !important; }
.page-footer .footer-bottom {
    background-color: #ffffff !important;
    color: #777777 !important;
    border-top: 1px solid #e6e6e6;
}
.page-footer .footer-bottom a { color: #555555 !important; }
.page-footer .footer-bottom a:hover { color: #FF5D00 !important; }
.page-footer .footer-middle { color: #555555; }
.page-footer .footer-middle a { color: #555555 !important; }
.page-footer .footer-middle .h5 { color: #FF5D00 !important; }
.page-footer .footer-middle a:hover,
.page-footer .footer-middle a:focus,
.page-footer .hover-link01 a:hover { color: #FF5D00 !important; }
.page-footer .hover-link01 a:after { background-color: #FF5D00 !important; }
.page-footer .ft-ic-list .i-ic { border-color: #FF5D00 !important; color: #FF5D00 !important; }
.page-footer .footer-social .i-link { color: #FF5D00 !important; }
.page-footer .footer-social .i-link:hover {
    background-color: #FF5D00 !important;
    color: #ffffff !important;
    border-color: #FF5D00 !important;
}

/* ---------- CTAs / preços / selos (marca) ---------- */
.action.primary,
button.action.primary,
.action.tocart,
.actions-toolbar .action.primary,
.block-minicart .actions .action.primary,
.checkout-methods-items .action.primary,
.cdz-btn-primary,
.btn-primary {
    background-color: #FF5D00 !important;
    border-color: #FF5D00 !important;
    color: #fff !important;
}
.action.primary:hover,
.action.tocart:hover,
button.action.primary:hover,
.cdz-btn-primary:hover,
.btn-primary:hover {
    background-color: #e65400 !important;
    border-color: #e65400 !important;
    color: #fff !important;
}
.product-item .price-box .price,
.product-info-price .price-wrapper .price,
.price-box .price { color: #FF5D00 !important; }
.old-price .price { color: #9b9b9b !important; }
.product-label span,
.cdz-product-label,
.cdz-label span,
.onsale,
.label.sale,
.sale-label { background-color: #FF5D00 !important; color: #fff !important; }

/* ==========================================================================
   HOME — seções
   ========================================================================== */
.px-section-title { text-align:center; margin:0 0 6px; color:#282828; font-size:26px; font-weight:700; }
.px-section-sub { text-align:center; color:#777; margin:0 0 22px; }
.px-btn { display:inline-block; background:#FF5D00; color:#fff !important; font-weight:700; padding:11px 26px; border-radius:24px; text-decoration:none !important; margin:0 4px; }
.px-btn:hover { background:#e65400; }
.px-btn-ghost { background:#fff; color:#FF5D00 !important; border:2px solid #FF5D00; padding:9px 24px; }
.px-btn-ghost:hover { background:#fff7f2; }

/* 1. Slideshow */
.px-slideshow { position:relative; overflow:hidden; border-radius:10px; margin:0 0 22px; background:#fafafa; }
.px-slides { display:flex; transition:transform .6s ease; }
.px-slide { min-width:100%; display:block; }
.px-slide img { width:100%; height:auto; display:block; }
.px-slideshow .px-nav { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,.9); border:0; width:42px; height:42px; border-radius:50%; cursor:pointer; font-size:22px; line-height:1; color:#282828; box-shadow:0 2px 8px rgba(0,0,0,.15); }
.px-slideshow .px-prev { left:12px; } .px-slideshow .px-next { right:12px; }
.px-slideshow .px-nav:hover { background:#FF5D00; color:#fff; }
.px-dots { position:absolute; bottom:12px; left:0; right:0; text-align:center; }
.px-dots button { width:10px; height:10px; border-radius:50%; border:0; margin:0 4px; padding:0; cursor:pointer; background:rgba(255,255,255,.7); box-shadow:0 1px 3px rgba(0,0,0,.3); }
.px-dots button.is-active { background:#FF5D00; width:24px; border-radius:5px; }

/* 2. USPs */
.px-usps { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 34px; }
.px-usp { flex:1 1 220px; display:flex; align-items:center; gap:12px; border:1px solid #eee; border-radius:10px; padding:14px 16px; background:#fff; }
.px-usp-i { font-size:26px; line-height:1; }
.px-usp strong { display:block; color:#282828; font-size:15px; }
.px-usp small { color:#777; font-size:12px; }

/* 3. Como funciona */
.px-how { background:#fff7f2; border:1px solid #ffe2d1; border-radius:12px; padding:28px 20px; margin:0 0 38px; }
.px-steps { display:flex; flex-wrap:wrap; gap:16px; }
.px-step { flex:1 1 240px; background:#fff; border:1px solid #ffe2d1; border-radius:10px; padding:20px; text-align:center; }
.px-step-n { width:40px; height:40px; border-radius:50%; background:#FF5D00; color:#fff; font-weight:700; font-size:18px; line-height:40px; margin:0 auto 10px; }
.px-step strong { display:block; color:#282828; margin-bottom:6px; }
.px-step p { color:#777; font-size:13px; margin:0; }

/* 4. Categorias */
.px-cats { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:0 0 40px; }
.px-cats a { flex:0 1 150px; text-align:center; text-decoration:none !important; color:#282828 !important; border:1px solid #eee; border-radius:10px; padding:16px 8px; background:#fff; transition:.2s; }
.px-cats a:hover { border-color:#FF5D00; box-shadow:0 4px 12px rgba(255,93,0,.15); transform:translateY(-2px); }
.px-cats img { height:56px; width:auto; margin-bottom:8px; }
.px-cats span { display:block; font-size:13px; font-weight:600; }

/* 5/7. Faixa de seção + vitrine */
.px-band { display:flex; align-items:center; gap:14px; border-bottom:2px solid #FF5D00; padding:0 0 10px; margin:34px 0 18px; }
.px-band-ic { height:38px; width:auto; flex-shrink:0; }
.px-band h2 { margin:0; font-size:21px; color:#282828; font-weight:700; }
.px-band p { margin:0; color:#888; font-size:13px; }
.px-band-link { margin-left:auto; color:#FF5D00 !important; font-weight:700; text-decoration:none !important; white-space:nowrap; }
.px-showcase { margin:0 0 12px; }
.px-showcase .product-item { border:1px solid #f0f0f0; border-radius:8px; padding:10px; transition:.2s; }
.px-showcase .product-item:hover { border-color:#FF5D00; box-shadow:0 4px 14px rgba(0,0,0,.08); }

/* 6. Círculos */
.px-circles { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; margin:0 0 40px; }
.px-circles a { flex:0 1 160px; }
.px-circles img { width:100%; height:auto; border-radius:50%; transition:.25s; }
.px-circles a:hover img { transform:scale(1.05); box-shadow:0 6px 18px rgba(0,0,0,.15); }

/* 8. Sobre */
.px-about { background:#f7f7f7; border-radius:12px; padding:30px 24px; text-align:center; margin:36px 0 22px; }
.px-about h3 { margin:0 0 10px; color:#282828; }
.px-about p { color:#666; max-width:780px; margin:0 auto 16px; }

/* 9. Confiança */
.px-trust { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 10px; }
.px-trust div { flex:1 1 200px; text-align:center; border:1px solid #eee; border-radius:10px; padding:14px; }
.px-trust strong { display:block; color:#FF5D00; font-size:14px; }
.px-trust small { color:#888; font-size:12px; }

@media (max-width:767px) {
    .px-section-title { font-size:21px; }
    .px-band h2 { font-size:17px; }
    .px-cats a { flex:0 1 calc(50% - 6px); }
    .px-circles a { flex:0 1 calc(33% - 8px); }
}