/*
Theme Name: mobilservice-child
Template: generatepress
Version: 1.0
Text Domain: mobilservice-child
*/


:root{
  --ms-blue:#051265;     /* Brand dark blue */
  --ms-az:#6C88D7;       /* Brand light blue */
  --ms-text:#111827;
  --ms-muted:#6b7280;
  --ms-bg:#f7f9ff;
  --ms-line:#e6e9f3;
  --ms-radius:14px;

  --ms-header-pad-x: 28px;
  --ms-header-pad-y: 14px;

  /* Product card sizing (tuned for 1920×1080 within a 1400px container: typically ~5 cards/row) */
  --ms-card-min: 210px;
  --ms-card-max: 240px;
  --ms-card-gap: 18px;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */
body{
  color:var(--ms-text);
  background:#fff;
}

a{ color:var(--ms-blue); }
a:hover{ color:var(--ms-az); }

h1,h2,h3{
  letter-spacing:-0.2px;
  font-weight:700;
}

/* --------------------------------------------------------------------------
   Content width (page content centered, header/nav full width)
   -------------------------------------------------------------------------- */
.site-content,
.inside-footer-widgets,
.footer-bar{
  max-width:1400px;
  margin-left:auto;
  margin-right:auto;
}

.inside-header,
.inside-navigation{
  max-width:none;
}

/* --------------------------------------------------------------------------
   Sticky header
   -------------------------------------------------------------------------- */
.site-header{
  position:sticky;
  top:0;
  z-index:9999;
  background:#fff;
  border-bottom:1px solid var(--ms-line);
  box-shadow:0 6px 20px rgba(0,0,0,.04);
}

body.admin-bar .site-header{ top:32px; }
@media (max-width:782px){
  body.admin-bar .site-header{ top:46px; }
}

.site-header .inside-header{
  padding:var(--ms-header-pad-y) var(--ms-header-pad-x);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

@media (max-width:768px){
  .site-header .inside-header{ padding:12px 14px; }
  h1{ font-size:28px; }
}

.site-logo img{
  display:block;
  margin:0 !important;
}

/* --------------------------------------------------------------------------
   Navigation
   -------------------------------------------------------------------------- */
.main-navigation .main-nav ul li a{
  font-weight:600;
  color:var(--ms-text);
  padding:6px 10px;
  border-radius:10px;
}

.main-navigation .main-nav ul li a:hover{
  background:#f2f5ff;
  color:var(--ms-az);
}

.main-navigation .main-nav ul li.current-menu-item > a,
.main-navigation .main-nav ul li.current_page_item > a,
.main-navigation .main-nav ul li.current-menu-ancestor > a{
  color:var(--ms-blue);
}

/* Dropdown menu */
.main-navigation ul ul{
  background:#fff;
  border:1px solid var(--ms-line);
  border-radius:12px;
  padding:8px 0;
  box-shadow:0 10px 24px rgba(0,0,0,.08);
  min-width:220px;
}

.main-navigation ul ul li a{
  padding:10px 16px;
  font-size:14px;
  font-weight:500;
  border-radius:0;
}

.main-navigation ul ul li a:hover{
  background:#f6f8ff;
  color:var(--ms-blue);
}

/* Language switcher */
.main-navigation .lang-item a{
  font-size:14px;
  opacity:.8;
}
.main-navigation .lang-item.current-lang a{
  font-weight:700;
  opacity:1;
}

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.button,
.wp-block-button__link,
input[type="submit"]{
  background:var(--ms-blue);
  border-radius:12px;
  padding:12px 16px;
  font-weight:700;
}

.button:hover,
.wp-block-button__link:hover,
input[type="submit"]:hover{
  background:var(--ms-az);
}

/* --------------------------------------------------------------------------
   Inputs
   -------------------------------------------------------------------------- */
input[type="search"],
input[type="text"],
input[type="email"],
textarea{
  border:1px solid #d9deea;
  border-radius:12px;
  padding:12px 14px;
}

input[type="search"]:focus,
input[type="text"]:focus,
input[type="email"]:focus,
textarea:focus{
  outline:none;
  border-color:var(--ms-az);
  box-shadow:0 0 0 3px rgba(108,136,215,.18);
}

/* --------------------------------------------------------------------------
   Search (inline button with icon)
   -------------------------------------------------------------------------- */
.search-form,
.wp-block-search__inside-wrapper{
  display:flex;
  align-items:stretch;
  gap:10px;
}

.search-form .search-field,
.wp-block-search__input{
  flex:1;
  min-width:0;
  border-radius:12px;
}

.search-form .search-submit,
.wp-block-search__button{
  flex:0 0 auto;
  width:52px;
  padding:0;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--ms-blue);
  border:none;
}

.wp-block-search__button span,
.search-form .search-submit span{
  display:none !important;
}

.wp-block-search__button::before,
.search-form .search-submit::before{
  content:"";
  width:20px;
  height:20px;
  display:block;
  background-repeat:no-repeat;
  background-position:center;
  background-size:20px 20px;
  filter:brightness(0) invert(1);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M10 18a8 8 0 1 1 5.293-14.002A8 8 0 0 1 10 18zm11.707 2.293-5.4-5.4A9.935 9.935 0 0 0 20 10a10 10 0 1 0-10 10 9.935 9.935 0 0 0 4.893-1.693l5.4 5.4a1 1 0 0 0 1.414-1.414z'/%3E%3C/svg%3E");
}

.wp-block-search__button:hover,
.search-form .search-submit:hover{
  background:var(--ms-az);
}

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */
.ms-card{
  border:1px solid #efefef !important;
  border-radius:var(--ms-radius) !important;
  background:#fff !important;
  overflow:hidden;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.ms-card:hover{
  transform:translateY(-2px);
  border-color:#e3e6ef !important;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.ms-imgph{
  background:#fafafa !important;
  border:1px dashed #e2e2e2 !important;
  border-radius:12px !important;
}

/* --------------------------------------------------------------------------
   Product grids (archive + taxonomy)
   Requirements:
   - Responsive (no fixed number of columns)
   - Cards do not "stretch" when results are 1–3 (including after filtering/search)
   - On a typical 1920×1080 screen, within the 1400px container: ~5 cards per row
   -------------------------------------------------------------------------- */
body.post-type-archive-prodotti .ms-grid,
body.tax-sottocategoria_prodotto .ms-grid{
  display:grid;
  gap:var(--ms-card-gap);
  align-items:start;
  justify-content:center;
  grid-template-columns:repeat(auto-fit, minmax(var(--ms-card-min), var(--ms-card-max)));
}

body.post-type-archive-prodotti .ms-grid > .ms-card,
body.tax-sottocategoria_prodotto .ms-grid > .ms-card{
  width:100%;
}

/* Product images (works with and without .ms-thumb wrapper) */
.ms-card .ms-thumb{
  background:#fafafa;
  border-radius:12px;
  overflow:hidden;
  height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.ms-card .ms-thumb img{
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:12px;
}

body.post-type-archive-prodotti .ms-card img,
body.tax-sottocategoria_prodotto .ms-card img{
  width:100%;
  height:220px;
  object-fit:contain;
  border-radius:12px;
  background:#fafafa;
}

@media (max-width:560px){
  :root{
    --ms-card-min: 100%;
    --ms-card-max: 100%;
  }

  .ms-card .ms-thumb{ height:200px; }

  body.post-type-archive-prodotti .ms-card img,
  body.tax-sottocategoria_prodotto .ms-card img{
    height:200px;
  }
}

/* --------------------------------------------------------------------------
   Mobile navigation scrolling (GeneratePress)
   -------------------------------------------------------------------------- */
@media (max-width:768px){
  .main-navigation.toggled{
    position:static !important;
    inset:auto !important;
    background:transparent !important;
    overflow:visible !important;
  }

  .main-navigation .inside-navigation{
    overflow:visible !important;
  }

  .main-navigation.toggled .main-nav{
    max-height:calc(100vh - 160px) !important;
    overflow-y:auto !important;
    -webkit-overflow-scrolling:touch !important;
    overscroll-behavior:contain !important;
  }

  .main-navigation .menu-toggle{
    position:relative !important;
    z-index:99999 !important;
  }
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-info{
  border-top:1px solid var(--ms-line);
  color:var(--ms-muted);
}
