/* /Components/Layout/StoreLayout.razor.rz.scp.css */
/* ── Palette (brand scale from pazienza-web tailwind.config.ts) ─────────────
   brand-50  #EBF5EF   brand-100 #D3E4DA   brand-200 #A8CDB8
   brand-600 #3E7B5E   brand-700 #2D5C43
   slate-600 #475569   slate-700 #334155   slate-400 #94a3b8
   amber-400 #fbbf24   amber-300 #fcd34d
   ─────────────────────────────────────────────────────────────────────────── */

/* ── OUTER WRAPPER ─────────────────────────────────────────────────────────── */
.store-wrapper[b-snja8mfog7] {
    min-height: 100vh;
    background: #EBF5EF;
    font-family: 'Roboto', system-ui, -apple-system, 'Segoe UI', sans-serif;
    -webkit-font-smoothing: antialiased;
}

/* ── HEADER ─────────────────────────────────────────────────────────────────── */
.store-header[b-snja8mfog7] {
    background: rgba(255, 255, 255, 0.95);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    border-bottom: 1px solid #D3E4DA;
    position: sticky;
    top: 0;
    z-index: 100;
}

.store-header-inner[b-snja8mfog7] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 16px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

/* ── Logo ── */
.store-logo[b-snja8mfog7] {
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;       /* gap-2.5 */
    color: #2D5C43;  /* brand-700 */
    flex-shrink: 0;
}

.store-logo-text[b-snja8mfog7] {
    font-size: 1.5rem;    /* text-2xl */
    font-weight: 900;     /* font-black */
    letter-spacing: -0.025em; /* tracking-tight */
    line-height: 1;
}

/* ── Nav links (desktop) ── */
.store-nav[b-snja8mfog7] {
    display: flex;
    align-items: center;
    gap: 32px;  /* gap-8 */
}

.store-navlink[b-snja8mfog7] {
    font-size: 0.875rem;   /* text-sm */
    font-weight: 500;      /* font-medium */
    color: #475569;        /* slate-600 */
    text-decoration: none;
    transition: color 150ms ease;
    white-space: nowrap;
}

.store-navlink:hover[b-snja8mfog7] {
    color: #3E7B5E;  /* brand-600 */
}

/* ── Header CTAs (desktop) ── */
.store-header-ctas[b-snja8mfog7] {
    display: flex;
    align-items: center;
    gap: 12px;  /* gap-3 */
    flex-shrink: 0;
}

.store-btn-outline[b-snja8mfog7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #2D5C43;          /* brand-700 */
    border: 1px solid #A8CDB8; /* brand-200 */
    padding: 8px 16px;       /* py-2 px-4 */
    border-radius: 8px;      /* rounded-lg */
    text-decoration: none;
    background: transparent;
    transition: background-color 150ms ease;
    white-space: nowrap;
}

.store-btn-outline:hover[b-snja8mfog7] {
    background-color: #EBF5EF;  /* brand-50 */
}

.store-btn-primary[b-snja8mfog7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #ffffff;
    background-color: #3E7B5E;  /* brand-600 */
    padding: 8px 16px;
    border-radius: 8px;
    text-decoration: none;
    transition: background-color 150ms ease;
    white-space: nowrap;
}

.store-btn-primary:hover[b-snja8mfog7] {
    background-color: #2D5C43;  /* brand-700 */
}

.store-link-muted[b-snja8mfog7] {
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;  /* slate-600 */
    text-decoration: none;
    transition: color 150ms ease;
    white-space: nowrap;
}

.store-link-muted:hover[b-snja8mfog7] {
    color: #334155;  /* slate-700 */
}

/* ── Hamburger (mobile only) ── */
.store-hamburger[b-snja8mfog7] {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;     /* p-2 */
    color: #475569;   /* slate-600 */
    border-radius: 6px;  /* rounded-md */
    transition: background-color 150ms ease;
    flex-shrink: 0;
}

.store-hamburger:hover[b-snja8mfog7] {
    background-color: #EBF5EF;  /* brand-50 */
}

/* ── Mobile dropdown menu ── */
.store-mobile-menu[b-snja8mfog7] {
    border-top: 1px solid #D3E4DA;
    background: #ffffff;
    padding: 8px 16px 16px;  /* pt-2 px-4 pb-4 */
}

.store-mobile-navlink[b-snja8mfog7] {
    display: block;
    padding: 8px 12px;     /* py-2 px-3 */
    font-size: 0.875rem;
    font-weight: 500;
    color: #334155;        /* slate-700 */
    text-decoration: none;
    border-radius: 8px;    /* rounded-lg */
    transition: background-color 150ms ease;
}

.store-mobile-navlink:hover[b-snja8mfog7] {
    background-color: #EBF5EF;  /* brand-50 */
}

.store-mobile-ctas[b-snja8mfog7] {
    border-top: 1px solid #D3E4DA;
    margin-top: 12px;    /* mt-3 */
    padding-top: 12px;   /* pt-3 */
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.store-mobile-btn-outline[b-snja8mfog7] {
    display: block;
    text-align: center;
    padding: 10px 16px;    /* py-2.5 px-4 */
    font-size: 0.875rem;
    font-weight: 600;
    color: #2D5C43;
    border: 1px solid #A8CDB8;
    border-radius: 8px;
    text-decoration: none;
    background: transparent;
    transition: background-color 150ms ease;
}

.store-mobile-btn-outline:hover[b-snja8mfog7] {
    background-color: #EBF5EF;
}

.store-mobile-btn-primary[b-snja8mfog7] {
    display: block;
    text-align: center;
    padding: 10px 16px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #ffffff;
    background-color: #3E7B5E;
    border-radius: 8px;
    text-decoration: none;
    transition: background-color 150ms ease;
}

.store-mobile-btn-primary:hover[b-snja8mfog7] {
    background-color: #2D5C43;
}

.store-mobile-link-muted[b-snja8mfog7] {
    display: block;
    text-align: center;
    padding: 10px 16px;
    font-size: 0.875rem;
    font-weight: 600;
    color: #475569;
    text-decoration: none;
    transition: color 150ms ease;
}

.store-mobile-link-muted:hover[b-snja8mfog7] {
    color: #334155;
}

/* ── MAIN ─────────────────────────────────────────────────────────────────── */
.store-main[b-snja8mfog7] {
    max-width: 1280px;
    margin: 0 auto;
    padding: 40px 16px 80px;
}

/* ── FOOTER ───────────────────────────────────────────────────────────────── */
.store-footer[b-snja8mfog7] {
    background: #EBF5EF;
    border-top: 1px solid #D3E4DA;
    padding: 48px 16px 32px;  /* py-12 */
}

.store-footer-inner[b-snja8mfog7] {
    max-width: 1280px;
    margin: 0 auto;
}

.store-footer-grid[b-snja8mfog7] {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr;  /* lg:col-span-2 + 3 cols */
    gap: 32px;  /* gap-8 */
}

.store-footer-brand-desc[b-snja8mfog7] {
    margin-top: 8px;   /* mt-2 */
    font-size: 0.875rem;  /* text-sm */
    color: #64748b;    /* slate-500 */
    line-height: 1.625; /* leading-relaxed */
    max-width: 280px;
}

.store-footer-brand-tagline[b-snja8mfog7] {
    margin-top: 16px;  /* mt-4 */
    font-size: 0.75rem;
    color: #94a3b8;    /* slate-400 */
    font-style: italic;
}

.store-footer-col-heading[b-snja8mfog7] {
    font-size: 0.75rem;       /* text-xs */
    font-weight: 600;         /* font-semibold */
    text-transform: uppercase;
    letter-spacing: 0.05em;   /* tracking-wider */
    color: #3E7B5E;           /* brand-600 */
    margin: 0 0 12px;         /* mt-3 → space above links */
}

.store-footer-col-heading-gap[b-snja8mfog7] {
    margin-top: 24px;  /* mt-6 between Guide and Legale */
}

.store-footer-links[b-snja8mfog7] {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;  /* space-y-2 */
}

.store-footerlink[b-snja8mfog7] {
    font-size: 0.875rem;
    color: #475569;   /* slate-600 */
    text-decoration: none;
    transition: color 150ms ease;
}

.store-footerlink:hover[b-snja8mfog7] {
    color: #3E7B5E;  /* brand-600 */
}

.store-footer-bottom[b-snja8mfog7] {
    margin-top: 40px;   /* mt-10 */
    border-top: 1px solid #D3E4DA;
    padding-top: 24px;  /* pt-6 */
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.store-footer-bottom-text[b-snja8mfog7] {
    font-size: 0.75rem;
    color: #94a3b8;  /* slate-400 */
    margin: 0;
}

/* ── RESPONSIVE ───────────────────────────────────────────────────────────── */
@media (min-width: 640px) {
    .store-header-inner[b-snja8mfog7] {
        padding: 0 24px;
    }
    .store-main[b-snja8mfog7] {
        padding: 40px 24px 80px;
    }
    .store-footer[b-snja8mfog7] {
        padding: 48px 24px 32px;
    }
}

@media (max-width: 1023px) {
    .store-footer-grid[b-snja8mfog7] {
        grid-template-columns: 1fr 1fr;  /* md:grid-cols-2 */
    }
}

@media (max-width: 767px) {
    .store-nav[b-snja8mfog7]          { display: none; }
    .store-header-ctas[b-snja8mfog7]  { display: none; }
    .store-hamburger[b-snja8mfog7]    { display: flex; align-items: center; justify-content: center; }
    .store-footer-grid[b-snja8mfog7]  { grid-template-columns: 1fr; }
}
