/* Kanamusic — components.min.css : méga-menu, pied de page, boutons, back-to-top */

/* ---------- Méga-menu (barre catégories, fond noir) ---------- */
.kana-nav{background:#1a1a1a;position:relative}
.nav-primary{list-style:none;display:flex;flex-wrap:nowrap;justify-content:center;margin:0;padding:0}
.nav-primary li{position:relative}
.nav-primary a{display:block;color:#fff;font-family:var(--kana-font);line-height:44px;text-decoration:none}
.nav-primary > li > a.level0{padding:0 13px;text-transform:uppercase;font-weight:700;font-size:.8rem;letter-spacing:.01em;white-space:nowrap}
.nav-primary > li > a.level0:hover,.nav-primary > li:hover > a.level0{background:var(--kana-primary);color:#fff}

/* Sous-menus (#444) */
.nav-primary ul{list-style:none;margin:0;padding:0}
.nav-primary li > ul{position:absolute;top:100%;left:0;min-width:240px;background:#444;border:1px solid #333;box-shadow:0 8px 22px rgba(0,0,0,.3);opacity:0;visibility:hidden;transform:translateY(6px);transition:.18s ease;z-index:120}
.nav-primary li:hover > ul{opacity:1;visibility:visible;transform:translateY(0)}
.nav-primary li li{position:relative;border-bottom:1px solid #555}
.nav-primary li li:last-child{border-bottom:0}
.nav-primary li li > a{padding:0 16px;line-height:34px;font-size:.8rem;white-space:nowrap;color:#eee;text-transform:none;font-weight:500}
.nav-primary li li > a:hover{color:#fff;background:var(--kana-primary)}
.nav-primary li li > ul{top:0;left:100%}
/* Les 2 dernières catégories ouvrent leurs sous-menus vers la gauche (évite le débordement à droite) */
.nav-primary > li:nth-last-child(-n+2) > ul{left:auto;right:0}
.nav-primary > li:nth-last-child(-n+2) li li > ul{left:auto;right:100%}
.nav-primary li li.parent > a::after{content:"";float:right;margin-top:14px;border:4px solid transparent;border-left-color:currentColor}

.kana-nav-toggle{display:none;background:#1a1a1a;color:#fff;border:0;padding:12px 16px;width:100%;text-align:left;font-family:var(--kana-font);font-weight:700;text-transform:uppercase;cursor:pointer}

/* ---------- Recherche dans la bannière (connecté) ---------- */
/* Superposée en bas-droite de la bannière, comme l'ancien site (sous le numéro de tél). */
.kana-banner{position:relative}
.kana-logo picture{display:block}
.kana-logo img{height:auto}
/* Recherche : sa propre ligne sous le menu et la barre langue/compte, alignée à droite */
.kana-banner-search{display:flex;justify-content:flex-end;margin:8px 15px}
.kana-banner-search form{display:flex;width:100%;max-width:280px}
.kana-banner-search input[type=search]{flex:1;min-width:0;border:1px solid #b9b9b9;border-right:0;background:#fff;padding:6px 10px;font-family:inherit;font-size:.88rem;color:#333;border-radius:0}
.kana-banner-search input[type=search]::placeholder{color:#8a8a8a}
.kana-banner-search button{background:#e7e7e7;color:#444;border:1px solid #b9b9b9;border-left:0;padding:0 11px;cursor:pointer;border-radius:0}
.kana-banner-search button:hover{background:#d8d8d8}

/* ---------- Boutons (gris foncé, comme l'original) ---------- */
.btn-kana,.woocommerce a.button,.woocommerce button.button,.woocommerce .button,.woocommerce #respond input#submit{
  background:#555;color:#fff;border:0;border-radius:2px;padding:11px 24px;font-family:var(--kana-font);font-weight:600;text-transform:uppercase;font-size:.8rem;letter-spacing:.02em;display:inline-block;cursor:pointer;transition:background .2s ease}
.btn-kana:hover,.woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover,.woocommerce #respond input#submit:hover{background:#3f3f3f;color:#fff}
/* Boutons « alt » (Valider la commande, Passer la commande) — même gris que le thème */
.woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button.alt,.woocommerce #place_order,.woocommerce .checkout-button{background:#555;color:#fff}
.woocommerce a.button.alt:hover,.woocommerce button.button.alt:hover,.woocommerce input.button.alt:hover,.woocommerce #place_order:hover,.woocommerce .checkout-button:hover{background:var(--kana-primary);color:#fff}

/* ---------- Pied de page ---------- */
.footer-container{padding:24px 30px 30px}
.footer{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--kana-border);padding-top:20px}
.footer .col-right{order:2}
.footer .col-right .footer-callout{max-width:100%}
.footer .col-main{order:1;color:var(--kana-nav-link);font-size:.85rem}
.footer .col-main p{margin:0 0 4px}
.footer .col-main a{color:var(--kana-nav-link)}
.footer .col-main a:hover{color:var(--kana-primary)}
.footer .col-main strong{color:var(--kana-secondary)}
.footer-callout-text{color:var(--kana-secondary);font-weight:700;font-size:1.1rem}

/* ---------- Carrousel de bannières (page de connexion) ---------- */
.kana-hero-carousel{margin-bottom:28px}
.kana-hero-carousel img{border-radius:4px}
.kana-required-note{color:var(--kana-sale);font-size:.8rem;text-align:right;margin:0 0 6px}
/* Bannière pleine largeur (connexion + contact) : déborde le padding de .kana-main (30px / 15px) */
.kana-main > .kana-hero-carousel{margin:-24px -30px 28px;width:auto;border-radius:0;overflow:hidden}
.kana-main > .kana-hero-carousel img{border-radius:0}
@media(max-width:991px){.kana-main > .kana-hero-carousel{margin:-16px -15px 24px}}

/* ---------- Page Contact ---------- */
.kana-contact{text-align:center}
.kana-contact-title{text-transform:uppercase;color:var(--kana-secondary);font-size:1.5rem;margin:8px 0 26px}
.kana-contact-form{max-width:560px;margin:0 auto;text-align:left}
.kana-contact-form .gfield_label{font-weight:600;color:var(--kana-nav-link);font-size:.9rem}
.kana-contact-form .gfield_required{color:var(--kana-sale)}
.kana-contact-form input[type=text],.kana-contact-form input[type=email],.kana-contact-form input[type=tel],.kana-contact-form textarea{width:100%;border:1px solid var(--kana-border);padding:9px 12px;border-radius:3px;font-family:inherit;font-size:.95rem;background:#fff}
.kana-contact-form textarea{min-height:120px;resize:vertical}
.kana-contact-form .gform_footer{text-align:right;padding-top:8px}
.kana-contact-form .gform_button,.kana-contact-form input[type=submit],.kana-contact-form button[type=submit]{background:#555!important;color:#fff!important;border:0!important;padding:11px 28px!important;text-transform:uppercase;font-weight:600;font-size:.8rem;letter-spacing:.02em;border-radius:2px!important;cursor:pointer;transition:background .2s ease;box-shadow:none!important}
.kana-contact-form .gform_button:hover,.kana-contact-form input[type=submit]:hover,.kana-contact-form button[type=submit]:hover{background:#3f3f3f!important}
.kana-contact-form .gform_confirmation_message{background:#eafaf1;border:1px solid #b7e4c7;color:#1e7e46;padding:16px 18px;border-radius:3px}

/* ---------- Back to top ---------- */
.kana-back-to-top{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;border:0;background:var(--kana-primary);color:#fff;font-size:1rem;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .3s ease,transform .3s ease,background .2s ease;z-index:200;box-shadow:0 4px 14px rgba(0,0,0,.25)}
.kana-back-to-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}
.kana-back-to-top:hover{background:var(--kana-accent)}

/* ---------- Responsive : menu accordéon ---------- */
@media(max-width:991px){
  .kana-nav-toggle{display:block}
  .nav-primary{display:none;flex-direction:column}
  .kana-nav.is-open .nav-primary{display:flex}
  .nav-primary > li > a.level0{padding:0 16px;border-bottom:1px solid var(--kana-border)}
  .nav-primary li > ul{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;border-left:3px solid var(--kana-light);min-width:0}
  .nav-primary li li > ul{left:0}
  .footer{flex-direction:column;text-align:center}
  .footer .col-right,.footer .col-main{order:0}
}
