.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

[data-mobile-nav].is-open { display: block; }

.legal-content h2:not(.not-legal) { margin-top: 2rem; font-size: 1.125rem; font-weight: 600; color: #171717; }
.legal-content p { margin-top: 0.75rem; }
.legal-content a { color: #171717; text-decoration: underline; }
.legal-content ul, .legal-content ol { margin-top: 0.75rem; }

details summary::-webkit-details-marker { display: none; }

[data-flash] { transition: opacity 0.3s; }

/* Safe area for notched phones */
body {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

/* Touch-friendly minimum tap targets */
button, a.btn-touch, input[type="submit"], input[type="number"] {
    min-height: 44px;
}

/* Mobile product grid: single column on very small screens */
@media (max-width: 380px) {
    .product-grid-mobile { grid-template-columns: 1fr !important; }
}

/* Cart item mobile layout */
@media (max-width: 640px) {
    .cart-item-mobile {
        flex-direction: column;
        align-items: stretch;
    }
    .cart-item-mobile .cart-item-actions {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        width: 100%;
    }
}

/* Sticky header offset for mobile nav */
@media (max-width: 1279px) {
    main { padding-bottom: env(safe-area-inset-bottom); }
}

/* Prevent horizontal overflow */
html, body { overflow-x: hidden; max-width: 100vw; }

/* Better form inputs on iOS */
input, textarea, select {
    font-size: 16px;
}

@media (min-width: 640px) {
    input, textarea, select { font-size: inherit; }
}

@media (prefers-reduced-motion: no-preference) {
    .animate-fade-in { animation: fadeIn 0.5s ease-out; }
}
@keyframes fadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
