/*
Theme Name: Pro Affiliate Aggregator V17 Master Pro
Theme URI: https://nobokal.com
Author: Custom Pro Studio & AI Expert
Description: Professional mini-Amazon affiliate theme featuring exact real product metadata, real stock status checks, zero fake data, and zero overflow.
Version: 17.0
*/

:root { 
    --primary: #131921; 
    --secondary: #232f3e;
    --accent: #febd69; 
    --accent-hover: #f3a847;
    --bg: #eaeded; 
    --card-bg: #fff; 
    --text: #0f1111; 
    --green: #007185; 
    --red: #B12704; 
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Amazon Ember', Arial, sans-serif; background: var(--bg); color: var(--text); }

.site-header { background: var(--primary); color: #fff; padding: 10px 20px; display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; z-index: 1000; box-shadow: 0 2px 10px rgba(0,0,0,0.3); width: 100%; }
.logo-area a { text-decoration: none; color: #fff; display: flex; align-items: center; }
.logo-area h1 { margin: 0; font-size: 22px; font-weight: 700; letter-spacing: 0.5px; }
.custom-logo-img { max-height: 40px; width: auto; display: block; object-fit: contain; }

.search-bar-form { flex: 1; max-width: 650px; margin: 0 25px; display: flex; align-items: center; background: #fff; border-radius: 6px; overflow: hidden; box-shadow: 0 2px 5px rgba(0,0,0,0.1); }
.search-bar-form select { background: #f3f3f3; border: none; padding: 10px 12px; font-size: 13px; color: #555; border-right: 1px solid #ddd; outline: none; cursor: pointer; }
.search-bar-form input { flex: 1; padding: 11px 15px; border: none; outline: none; font-size: 14px; color: #111; background: #fff; }
.search-bar-form button { padding: 11px 22px; background: var(--accent); border: none; font-weight: bold; cursor: pointer; color: #111; transition: background 0.2s; }
.search-bar-form button:hover { background: var(--accent-hover); }

.header-badge span { background: rgba(255,255,255,0.1); padding: 6px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; color: #febd69; border: 1px solid rgba(254,189,105,0.3); white-space: nowrap; }

.sub-nav-bar { background: var(--secondary); border-bottom: 1px solid #3a4553; padding: 8px 20px; overflow-x: auto; white-space: nowrap; color: #fff; width: 100%; }
.sub-nav-container { max-width: 1400px; margin: 0 auto; display: flex; align-items: center; gap: 15px; font-size: 13px; }
.live-pulse { width: 9px; height: 9px; background: #2ecc71; border-radius: 50%; display: inline-block; }

.container { display: flex; max-width: 1400px; margin: 25px auto; gap: 25px; padding: 0 15px; width: 100%; box-sizing: border-box; }
.sidebar { width: 260px; min-width: 260px; background: var(--card-bg); padding: 20px; border-radius: 10px; height: fit-content; box-shadow: 0 2px 8px rgba(0,0,0,0.06); border: 1px solid #e3e6e6; box-sizing: border-box; }
.sidebar h3 { font-size: 15px; margin-bottom: 12px; border-bottom: 2px solid var(--accent); padding-bottom: 6px; color: #111; }
.category-list { list-style: none; margin-bottom: 20px; }
.category-list li { margin-bottom: 8px; }
.category-list a { text-decoration: none; color: #007185; font-size: 13px; font-weight: 500; }
.category-list a:hover { color: var(--red); text-decoration: underline; }

.content { flex: 1; min-width: 0; box-sizing: border-box; }
.ad-slot { background: #fff; text-align: center; padding: 14px; margin-bottom: 25px; border: 1px dashed #b1b1b1; color: #666; font-size: 12px; border-radius: 8px; box-shadow: 0 1px 4px rgba(0,0,0,0.03); width: 100%; box-sizing: border-box; }

.section-title { font-size: 20px; margin-bottom: 18px; display: flex; align-items: center; gap: 10px; font-weight: 700; color: #111; }
.live-badge { background: var(--red); color: white; padding: 3px 8px; border-radius: 4px; font-size: 11px; font-weight: bold; }

.product-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 15px; margin-bottom: 30px; width: 100%; box-sizing: border-box; }
@media (min-width: 768px) { .product-grid { grid-template-columns: repeat(4, 1fr); gap: 20px; } }

.product-card { background: var(--card-bg); border-radius: 10px; padding: 15px; display: flex; flex-direction: column; justify-content: space-between; position: relative; border: 1px solid #e3e6e6; transition: transform 0.2s ease, box-shadow 0.2s ease; width: 100%; box-sizing: border-box; overflow: hidden; box-shadow: 0 2px 5px rgba(0,0,0,0.04); }
.product-card:hover { transform: translateY(-4px); box-shadow: 0 8px 20px rgba(0,0,0,0.1); }

.badge-row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.ai-badge { background: #fdf0ed; color: #ff5722; font-size: 9px; font-weight: 700; padding: 2px 6px; border-radius: 4px; border: 1px solid #ffd8cc; }
.discount-pill { background: var(--red); color: #fff; padding: 3px 6px; font-size: 10px; font-weight: bold; border-radius: 4px; }

.stock-status { font-size: 11px; font-weight: bold; margin-bottom: 6px; }
.in-stock { color: #007600; }
.out-of-stock { color: var(--red); }

.store-tag { font-size: 10px; background: #f0f2f2; padding: 2px 6px; border-radius: 3px; border: 1px solid #d5d9d9; display: inline-block; margin-bottom: 6px; color: #333; font-weight: 600; }
.product-image-wrap { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; margin-bottom: 12px; }
.product-image-wrap img { max-width: 100%; max-height: 100%; object-fit: contain; }

.product-title { font-size: 13px; color: #0f1111; margin: 0 0 8px; height: 38px; overflow: hidden; line-height: 1.3; font-weight: 500; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }

.price-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; }
.current-price { font-size: 19px; font-weight: 700; color: #0f1111; }
.original-price { font-size: 11px; color: #565959; text-decoration: line-through; }

.buy-btn { display: block; width: 100%; background: #ffd814; color: #0f1111; text-align: center; padding: 9px 0; border-radius: 20px; font-size: 12px; font-weight: bold; text-decoration: none; box-shadow: 0 1px 2px rgba(0,0,0,0.2); transition: background 0.2s; box-sizing: border-box; }
.buy-btn:hover { background: #f7ca00; }

.site-footer { background: var(--secondary); color: #fff; text-align: center; padding: 35px 20px; margin-top: 50px; font-size: 13px; border-top: 1px solid #3a4553; width: 100%; box-sizing: border-box; }
.site-footer a { color: #ddd; text-decoration: none; margin: 0 10px; }
.site-footer a:hover { text-decoration: underline; }

@media (max-width: 768px) { 
    .site-header { flex-direction: column; gap: 12px; padding: 12px 15px; }
    .search-bar-form { width: 100%; margin: 0; }
    .container { flex-direction: column; } 
    .sidebar { width: 100%; min-width: 0; } 
    .product-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; } 
}
