/* =============================================================================
   Nivami Child Theme — CSS principale
   Allinea lo stile dello shop al sito www.nivami.it
   ============================================================================= */

@import url("https://fonts.googleapis.com/css2?family=Allura&family=Montserrat:ital,wght@0,400;0,500;0,600;0,700;1,600&display=swap");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css");

:root {
  --nv-green: #004d34;
  --nv-green-dark: #003825;
  --nv-text: #174737;
  --nv-taupe: #b8aea5;
  --nv-bg: #ffffff;
  --nv-soft: #f6f3ef;
}

/* ---------- BASE TIPOGRAFIA ---------- */
html { font-size: 100%; }

html, body, p, a, span, label, li, div, button, input, textarea, select {
  font-family: "Montserrat", sans-serif;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Montserrat", sans-serif;
  font-weight: 700;
  color: var(--nv-green);
  letter-spacing: 0.2px;
}

body, #wrapper, #main {
  background: var(--nv-bg);
  color: var(--nv-text);
}

a {
  color: var(--nv-green);
  transition: color .2s, opacity .2s;
}

a:hover {
  color: var(--nv-green-dark);
  text-decoration: none;
  opacity: 0.9;
}

img { max-width: 100%; height: auto; display: block; }

/* ---------- BOTTONI (stile pill come sito custom) ---------- */
.btn,
.btn-primary,
button.btn-primary,
.btn-secondary,
.add-to-cart,
input[type="submit"] {
  background: var(--nv-green) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 12px 28px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 0.5px;
  text-transform: none !important;
  box-shadow: none !important;
  transition: background .2s;
}

.btn:hover,
.btn-primary:hover,
.btn-secondary:hover,
.add-to-cart:hover {
  background: var(--nv-green-dark) !important;
  color: #fff !important;
}

.btn-light {
  background: #fff !important;
  color: var(--nv-green) !important;
}

.btn-outline-light {
  background: transparent !important;
  border: 1px solid #d4d4d4 !important;
  color: #fff !important;
}

/* ---------- HEADER NIVAMI (markup del nostro header.tpl) ---------- */
.site-header {
  background: #f8f8f8;
  position: sticky;
  top: 0;
  z-index: 1000;
  box-shadow: 0 1px 0 rgba(0,0,0,0.05);
}

.site-header .container.nav-row {
  width: min(1200px, 92vw);
  margin: 0 auto;
  min-height: 96px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.site-header .logo {
  display: inline-flex;
  align-items: center;
  line-height: 1;
}

.site-header .logo img {
  height: 70px;
  width: auto;
  display: block;
}

.site-header .main-nav {
  display: flex;
  gap: 26px;
  font-size: 14px;
  font-weight: 500;
}

.site-header .main-nav a {
  color: var(--nv-text);
  white-space: nowrap;
}

.site-header .main-nav a:hover,
.site-header .main-nav a.active {
  color: var(--nv-green);
}

.site-header .header-tools {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-left: auto;
}

.site-header .header-icon {
  position: relative;
  font-size: 18px;
  color: var(--nv-text);
  padding: 6px 8px;
  display: inline-flex;
  align-items: center;
}

.site-header .header-icon:hover { color: var(--nv-green); }

.site-header .cart-count {
  background: var(--nv-green);
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  padding: 2px 6px;
  font-weight: 700;
  margin-left: 4px;
  min-width: 18px;
  text-align: center;
}

.site-header .btn-login {
  background: var(--nv-green) !important;
  color: #fff !important;
  border-radius: 999px !important;
  padding: 8px 22px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  border: 0 !important;
}

.site-header .btn-login:hover {
  background: var(--nv-green-dark) !important;
  color: #fff !important;
}

.site-header .social {
  display: flex;
  gap: 12px;
}

.site-header .social a {
  font-size: 22px;
  color: var(--nv-text);
}

.site-header .social a:hover { color: var(--nv-green); }

/* nasconde il header originale del tema Classic (se presente) */
body #header > nav.header-nav,
body #header > .header-top:not(.nivami-keep) {
  display: none !important;
}

/* ---------- HERO HOMEPAGE B2B ---------- */
.shop-hero {
  background: var(--nv-soft) !important;
  color: var(--nv-green) !important;
  padding: 80px 24px;
  text-align: center;
  border-radius: 0;
}

.shop-hero .subtitle,
.shop-hero p,
.shop-hero .welcome {
  color: var(--nv-green) !important;
}

.shop-hero .subtitle {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 22px;
}

.shop-hero p {
  font-size: 17px;
  margin-bottom: 22px;
}

.shop-hero .welcome {
  font-style: italic;
  font-size: 18px;
  margin-bottom: 18px;
}

.shop-hero .hero-actions {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 8px;
}

.shop-hero .btn,
.shop-hero .btn-light {
  background: var(--nv-green) !important;
  color: #fff !important;
  font-size: 15px;
  padding: 14px 36px !important;
}

.shop-hero .btn:hover,
.shop-hero .btn-light:hover {
  background: var(--nv-green-dark) !important;
  color: #fff !important;
}

.shop-hero .btn-outline {
  background: transparent !important;
  border: 1px solid var(--nv-green) !important;
  color: var(--nv-green) !important;
  border-radius: 999px !important;
  padding: 14px 36px !important;
  font-weight: 700 !important;
  font-size: 15px !important;
}

.shop-hero .btn-outline:hover {
  background: var(--nv-green) !important;
  color: #fff !important;
}

/* ---------- BREADCRUMB ---------- */
.breadcrumb {
  background: transparent !important;
  padding: 18px 0 !important;
  font-size: 13px;
  margin: 0;
}

.breadcrumb a,
.breadcrumb li span {
  color: var(--nv-text) !important;
}

.breadcrumb a:hover { color: var(--nv-green) !important; }

/* ---------- PRODUCT MINIATURE ---------- */
.product-miniature,
.js-product-miniature {
  background: #fff;
  border: 1px solid #eee;
  border-radius: 12px;
  padding: 14px;
  text-align: center;
  transition: box-shadow .25s, transform .25s;
}

.product-miniature:hover {
  box-shadow: 0 12px 28px rgba(0,0,0,0.08);
  transform: translateY(-3px);
}

.product-miniature .product-thumbnail img,
.product-thumbnail img {
  border-radius: 8px;
}

.product-title a {
  color: var(--nv-text) !important;
  font-weight: 600 !important;
  font-size: 17px !important;
  text-transform: none !important;
}

.product-title a:hover { color: var(--nv-green) !important; }

.product-price-and-shipping .price,
.product-miniature .price,
.regular-price {
  color: var(--nv-green) !important;
  font-weight: 700;
  font-size: 19px;
}

.product-flags li.product-flag,
.product-flag {
  background: var(--nv-green) !important;
  border-radius: 999px !important;
  font-weight: 600;
  padding: 4px 12px !important;
  font-size: 11px;
}

/* ---------- FORM ---------- */
.form-control,
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"],
textarea,
select.form-control {
  border-radius: 8px !important;
  border: 1px solid #bdbdbd !important;
  padding: 12px !important;
  height: auto !important;
  font-size: 15px;
  font-family: "Montserrat", sans-serif;
  box-shadow: none !important;
}

.form-control:focus {
  border-color: var(--nv-green) !important;
  box-shadow: 0 0 0 3px rgba(0,77,52,0.15) !important;
}

label, .label, .form-control-label {
  color: var(--nv-text);
  font-weight: 500;
}

/* ---------- DETTAGLIO PRODOTTO ---------- */
#product .h1,
.product-detail-name {
  color: var(--nv-green) !important;
  font-weight: 700;
  font-size: 32px;
}

.product-prices .current-price,
.product-prices .current-price .price {
  color: var(--nv-green) !important;
  font-size: 32px;
  font-weight: 700;
}

.product-prices .regular-price {
  color: #999 !important;
  text-decoration: line-through;
}

.product-actions .add-to-cart {
  padding: 16px 28px !important;
  font-size: 16px !important;
  width: 100%;
}

.tabs .nav-tabs .nav-link { color: var(--nv-text); }

.tabs .nav-tabs .nav-link.active {
  color: var(--nv-green) !important;
  border-bottom: 3px solid var(--nv-green) !important;
}

/* ---------- CHECKOUT ---------- */
#checkout .step-title h2,
#checkout-personal-information-step h2 { color: var(--nv-green) !important; }

#checkout .step.-current .step-number {
  background: var(--nv-green) !important;
}

/* ---------- FOOTER NIVAMI ---------- */
.site-footer {
  background: var(--nv-soft) !important;
  color: var(--nv-green) !important;
  text-align: center;
  padding: 28px 16px 32px;
  font-size: 15px;
  margin-top: 60px;
  border-top: 1px solid #eae5dd;
}

.site-footer .footer-top {
  line-height: 1.8;
  margin-bottom: 14px;
  color: var(--nv-green);
}

.site-footer a {
  color: var(--nv-green) !important;
}

.site-footer a:hover { color: var(--nv-green-dark) !important; }

.site-footer .footer-bottom {
  display: flex;
  gap: 14px;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 14px;
}

.site-footer .btn-outline-light,
.site-footer .btn.btn-outline-light {
  background: transparent !important;
  border: 1px solid var(--nv-green) !important;
  color: var(--nv-green) !important;
  border-radius: 999px !important;
  padding: 10px 26px !important;
  font-size: 13px !important;
}

.site-footer .btn-outline-light:hover,
.site-footer .btn.btn-outline-light:hover {
  background: var(--nv-green) !important;
  color: #fff !important;
}

/* nasconde il footer di Classic se rimane */
.page-footer {
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
}

.page-footer > * { display: none !important; }

/* ---------- NOTIFICATIONS ---------- */
.alert-success,
#notifications .alert-success {
  background: rgba(0,77,52,0.08) !important;
  border-color: var(--nv-green) !important;
  color: var(--nv-green) !important;
}

.alert-danger {
  background: #fdecea !important;
  border-color: #c0392b !important;
  color: #922b21 !important;
}

/* ---------- PAGE TITLE ---------- */
.page-header h1,
#main .page-header h1 {
  color: var(--nv-green) !important;
  font-weight: 700;
  text-transform: none;
  margin-bottom: 28px;
}

/* ---------- B2B: nasconde "Crea account" su login page ---------- */
.no-account,
#register-form,
.create-account-link,
.no-account-toggle,
a[href*="create_account=1"],
.account-creation-form-block {
  display: none !important;
}

.login-form,
#login-form {
  margin: 0 auto;
  max-width: 480px;
}

.login-form::before {
  content: "Accesso riservato ai clienti B2B autorizzati. Per richiedere le credenziali contatta vendite@nivami.it.";
  display: block;
  padding: 14px 18px;
  background: var(--nv-soft);
  border-left: 4px solid var(--nv-green);
  margin-bottom: 22px;
  color: var(--nv-text);
  font-size: 14px;
  line-height: 1.6;
  border-radius: 6px;
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1100px) {
  .site-header .container.nav-row {
    flex-wrap: wrap;
    min-height: auto;
    padding: 14px 0;
    gap: 12px;
  }
  .site-header .main-nav {
    order: 3;
    width: 100%;
    justify-content: center;
    flex-wrap: wrap;
    gap: 14px;
  }
  .site-header .header-tools { order: 2; }
  .site-header .social { order: 2; }
}

@media (max-width: 640px) {
  .site-header .logo img { height: 54px; }
  .site-header .main-nav { font-size: 13px; gap: 10px; }
  .shop-hero { padding: 60px 18px; }
}

/* ============================================================
   GUEST MODE — nascondi prezzi + modal al checkout
   ============================================================ */

/* Nasconde prezzi ovunque per utenti non loggati */
body.nv-guest .product-price-and-shipping,
body.nv-guest .product-prices,
body.nv-guest .product-miniature .price,
body.nv-guest .product-miniature .regular-price,
body.nv-guest .product-line-info .price,
body.nv-guest .product-line-info .regular-price,
body.nv-guest .cart-subtotals,
body.nv-guest .cart-total,
body.nv-guest .cart-summary-totals,
body.nv-guest .cart-summary-line,
body.nv-guest #cart-subtotal-products,
body.nv-guest #cart-subtotal-shipping,
body.nv-guest .cart-detailed-totals,
body.nv-guest .product-price,
body.nv-guest .price,
body.nv-guest .regular-price,
body.nv-guest .discount,
body.nv-guest .discount-percentage,
body.nv-guest .product-discount,
body.nv-guest .current-price,
body.nv-guest .tax-shipping-delivery-label {
  display: none !important;
}

/* Messaggio "Accedi per il prezzo" nella product card */
body.nv-guest .product-miniature .product-description::after {
  content: "Accedi per vedere il prezzo";
  display: block;
  color: var(--nv-green);
  font-style: italic;
  font-size: 13px;
  font-weight: 500;
  margin-top: 8px;
}

/* Messaggio nel dettaglio prodotto */
body.nv-guest .product-actions::before {
  content: "Accedi con le tue credenziali o contattaci per il listino dedicato.";
  display: block;
  background: var(--nv-soft);
  color: var(--nv-green);
  padding: 14px 18px;
  border-left: 4px solid var(--nv-green);
  border-radius: 6px;
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 18px;
}

/* Nasconde le flags "in saldo" o "prezzo scontato" per guest */
body.nv-guest .product-flag.discount,
body.nv-guest .product-flag.on-sale {
  display: none !important;
}

/* ---------- MODAL "Accedi per acquistare" ---------- */
.nv-modal {
  position: fixed;
  inset: 0;
  background: rgba(0, 77, 52, 0.55);
  z-index: 10000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  animation: nv-fade-in 0.2s ease;
}

.nv-modal.is-open {
  display: flex;
}

.nv-modal-content {
  background: var(--nv-soft);
  padding: 44px 34px 34px;
  border-radius: 12px;
  max-width: 520px;
  width: 100%;
  text-align: center;
  position: relative;
  border-left: 4px solid var(--nv-green);
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  animation: nv-pop-in 0.25s ease;
}

.nv-modal-content p {
  color: var(--nv-green) !important;
  font-size: 17px;
  line-height: 1.6;
  margin: 0;
}

.nv-modal-content a {
  color: var(--nv-green) !important;
  text-decoration: underline;
  font-weight: 700;
}

.nv-modal-content a:hover {
  color: var(--nv-green-dark) !important;
  opacity: 0.9;
}

.nv-modal-close {
  position: absolute;
  top: 6px;
  right: 10px;
  background: transparent;
  border: 0;
  font-size: 30px;
  line-height: 1;
  color: var(--nv-green);
  cursor: pointer;
  padding: 6px 12px;
  font-weight: 300;
}

.nv-modal-close:hover {
  color: var(--nv-green-dark);
}

@keyframes nv-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes nv-pop-in {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}
