/*
Theme Name:   DI LUPO SHOP
Theme URI:    https://www.dlpartsofsystems.com/
Description:  Tema figlio di Storefront per lo shop B2B di Di Lupo Sistemi: grafica coordinata con diluposistemi.it, registrazione per ditte, modalita' catalogo con richiesta di preventivo, dati di conformita' dei prodotti.
Author:       Matteo Di Lupo
Author URI:   https://www.diluposistemi.it/
Template:     storefront
Version:      1.0.0
Text Domain:  dlparts
*/

/* ---------------------------------------------------------------
   Colori e caratteri: gli stessi di diluposistemi.it
   --------------------------------------------------------------- */
:root {
  --navy: #0f2257;
  --navy-2: #172f73;
  --navy-ink: #0a173d;
  --accent: #f2a516;
  --accent-ink: #3b2600;
  --bg: #f5f6f9;
  --surface: #ffffff;
  --text: #1b2333;
  --muted: #5b6577;
  --line: #dfe3ea;
  --radius: 10px;
  --shadow: 0 1px 2px rgba(15, 34, 87, .06), 0 8px 24px rgba(15, 34, 87, .08);
}

body {
  background: var(--bg);
  color: var(--text);
  font-family: "Barlow", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 17px;
}
h1, h2, h3, h4, .site-title, .product_title, .woocommerce-loop-product__title, .entry-title {
  font-family: "Barlow Condensed", "Barlow", sans-serif;
  color: var(--navy-ink);
  letter-spacing: .01em;
}
a { color: var(--navy-2); }
a:hover, a:focus { color: var(--navy); }

/* ---------------------------------------------------------------
   Barra superiore con contatti
   --------------------------------------------------------------- */
.dlp-topbar { background: var(--navy-ink); color: #c7cfe3; font-size: .85rem; }
.dlp-topbar .col-full { display: flex; justify-content: space-between; align-items: center; gap: 12px; min-height: 36px; flex-wrap: wrap; }
.dlp-topbar a { color: #fff; text-decoration: none; }
.dlp-topbar .dlp-b2b { color: var(--accent); font-weight: 600; letter-spacing: .04em; }

/* ---------------------------------------------------------------
   Testata
   --------------------------------------------------------------- */
.site-header {
  background: var(--navy) !important;
  border-bottom: 0;
  padding-top: 1.2em;
  color: #e3e8f5;
}
.site-header .site-branding { margin-bottom: 1em; }
.dlp-brand { display: flex; align-items: center; gap: 14px; text-decoration: none; }
.dlp-brand img { height: 62px; width: auto; }
.dlp-brand-text { border-left: 1px solid rgba(255,255,255,.25); padding-left: 14px; }
.dlp-brand-text strong { display: block; font-family: "Barlow Condensed", sans-serif; font-size: 1.9rem; line-height: 1; color: #fff; letter-spacing: .03em; }
.dlp-brand-text small { display: block; font-size: .78rem; color: #aab5d3; letter-spacing: .06em; text-transform: uppercase; margin-top: 4px; }
.dlp-year { font-family: "Barlow", sans-serif; font-size: .5em; font-weight: 600; color: var(--accent); margin-left: .35em; vertical-align: super; }

.site-header .site-search .widget_product_search input[type=search] { background: rgba(255,255,255,.95); border-radius: 6px; }

/* Menu */
.main-navigation ul li a, .main-navigation ul.menu > li > a { color: #e3e8f5 !important; font-weight: 500; }
.main-navigation ul li a:hover, .main-navigation ul li.current-menu-item > a { color: #fff !important; }
.main-navigation ul.menu ul, .main-navigation ul.nav-menu ul { background: var(--navy-2); }
.storefront-primary-navigation { background: var(--navy) !important; }
.site-header-cart .cart-contents, .site-header-cart .cart-contents .amount { color: #e3e8f5 !important; }
button.menu-toggle { color: #fff !important; border-color: rgba(255,255,255,.4) !important; background: transparent !important; }
button.menu-toggle::before, button.menu-toggle::after, button.menu-toggle span::before { background-color: #fff !important; }
.handheld-navigation { background: var(--navy-2); }

@media (max-width: 767px) {
  .dlp-brand img { height: 48px; }
  .dlp-brand-text strong { font-size: 1.5rem; }
  .dlp-brand-text small { display: none; }
}

/* ---------------------------------------------------------------
   Pulsanti
   --------------------------------------------------------------- */
button, input[type=button], input[type=reset], input[type=submit], .button, .added_to_cart, .widget a.button {
  background-color: var(--navy-2) !important;
  border-color: var(--navy-2) !important;
  color: #fff !important;
  border-radius: 6px;
  font-weight: 600;
}
button:hover, input[type=submit]:hover, .button:hover { background-color: var(--navy) !important; }
button.alt, input[type=button].alt, input[type=submit].alt, .button.alt, .dlp-btn-accent {
  background-color: var(--accent) !important;
  border-color: var(--accent) !important;
  color: var(--accent-ink) !important;
}
button.alt:hover, .button.alt:hover, .dlp-btn-accent:hover { background-color: #ffb933 !important; }

/* ---------------------------------------------------------------
   Prodotti
   --------------------------------------------------------------- */
ul.products li.product {
  background: var(--surface);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 0 0 18px;
  overflow: hidden;
}
ul.products li.product img { margin-bottom: 12px; border-radius: 0; }
ul.products li.product .woocommerce-loop-product__title { font-size: 1.1rem; padding: 0 12px; }
ul.products li.product .price { color: var(--navy-ink); font-weight: 600; }
.price .woocommerce-price-suffix, .dlp-iva { color: var(--muted); font-size: .8em; font-weight: 400; }
ul.products li.product .dlp-sku { display: block; color: var(--muted); font-size: .8rem; margin-bottom: 4px; }
ul.products li.product .button { margin: 0 12px; }
.single-product div.product .product_title { font-size: 2.2rem; }
.single-product div.product p.price { color: var(--navy-ink); font-size: 1.6rem; }
.woocommerce-tabs ul.tabs li.active a { color: var(--navy-2); }

.dlp-avviso {
  background: #fff8e6; border-left: 4px solid var(--accent); padding: 12px 16px;
  border-radius: 6px; color: #5b4300; font-size: .92rem; margin: 0 0 1.2em;
}
.dlp-conformita { width: 100%; border-collapse: collapse; }
.dlp-conformita th { width: 32%; text-align: left; color: var(--muted); font-weight: 500; }
.dlp-conformita th, .dlp-conformita td { padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; }

/* Etichette categoria */
.dlp-badge { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; padding: 2px 9px; border-radius: 99px; background: #e4e9f7; color: var(--navy-2); }
.dlp-badge.rohs-no { background: #fde4e1; color: #a1281b; }

/* ---------------------------------------------------------------
   Richiesta di preventivo
   --------------------------------------------------------------- */
.dlp-preventivo {
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 22px 24px; margin: 1.5em 0;
}
.dlp-preventivo h3 { margin-top: 0; }
.dlp-preventivo .dlp-campi { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; }
.dlp-preventivo .dlp-campi .largo { grid-column: 1 / -1; }
.dlp-preventivo label { display: block; font-size: .88rem; color: var(--muted); margin-bottom: 3px; }
.dlp-preventivo input[type=text], .dlp-preventivo input[type=email], .dlp-preventivo input[type=tel],
.dlp-preventivo input[type=number], .dlp-preventivo textarea { width: 100%; }
.dlp-preventivo .dlp-privacy { font-size: .85rem; color: var(--muted); }
.dlp-preventivo .dlp-hp { position: absolute; left: -9999px; }
@media (max-width: 600px) { .dlp-preventivo .dlp-campi { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------
   Pagina iniziale dello shop
   --------------------------------------------------------------- */
.dlp-hero {
  background: linear-gradient(120deg, var(--navy-ink) 0%, var(--navy) 55%, var(--navy-2) 100%);
  color: #c7cfe3; border-radius: var(--radius); padding: 48px 40px; margin-bottom: 2.5em;
}
.dlp-hero h1 { color: #fff; font-size: clamp(2rem, 4vw, 3rem); margin-bottom: .3em; }
.dlp-hero h1 em { font-style: normal; color: var(--accent); }
.dlp-hero p { font-size: 1.1rem; max-width: 60ch; }
.dlp-hero .dlp-azioni { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 1.4em; }
.dlp-hero .button { padding: .8em 1.4em; }
.dlp-punti { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 0 0 2.5em; }
.dlp-punto { background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; }
.dlp-punto b { display: block; font-family: "Barlow Condensed", sans-serif; font-size: 1.25rem; color: var(--navy-ink); }
.dlp-punto span { color: var(--muted); font-size: .92rem; }
@media (max-width: 860px) { .dlp-punti { grid-template-columns: 1fr 1fr; } .dlp-hero { padding: 32px 22px; } }
.page-template-template-fullwidth-php .entry-header, .home .entry-header { display: none; }

/* ---------------------------------------------------------------
   Piede pagina
   --------------------------------------------------------------- */
.site-footer { background: var(--navy-ink) !important; color: #8f9bbb !important; }
.site-footer a { color: #c7cfe3 !important; }
.site-footer a:hover { color: #fff !important; }
.site-footer h2.widget-title, .site-footer .widget-title { color: #fff !important; }
.dlp-footer { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 32px; padding: 8px 0 20px; font-size: .92rem; }
.dlp-footer h4 { color: #fff; font-size: 1rem; margin-bottom: .6em; }
.dlp-footer ul { list-style: none; margin: 0; }
.dlp-footer img { height: 56px; width: auto; margin-bottom: 12px; }
.dlp-legal { border-top: 1px solid rgba(255,255,255,.1); padding-top: 14px; font-size: .82rem; }
@media (max-width: 760px) { .dlp-footer { grid-template-columns: 1fr; } }
.storefront-handheld-footer-bar { display: none; }

/* Storefront limita le immagini della testata: forziamo la misura del logo */
.site-header .site-branding .dlp-brand img { height: 62px !important; width: auto !important; max-width: none !important; }
.dlp-footer img { height: 56px !important; width: auto !important; }
@media (max-width: 767px) {
  .site-header .site-branding .dlp-brand img { height: 48px !important; }
}
