/* ================================================================
   assets/css/agentic.css - Fixes for Agentic Browsing (CLS & AI)
   ================================================================ */

/* =============================== */
/* 1. Σταθεροποίηση εικόνων στο grid */
/* =============================== */
.card-media img {
    aspect-ratio: 1 / 1;
    object-fit: contain;
    width: 100%;
    height: auto;
}

/* =============================== */
/* 2. Σταθεροποίηση flash items στο hero */
/* =============================== */
.flash-img img {
    aspect-ratio: 120 / 70;
    object-fit: contain;
    width: 100%;
    height: auto;
}
.flash-strip {
    min-height: 160px;
}
.flash-item {
    flex: 0 0 130px;
    height: 160px;
}
.flash-img {
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* =============================== */
/* 3. Σταθεροποίηση hero κύριας εικόνας */
/* =============================== */
.hero-media-main {
    min-height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.hero-media-main img {
    aspect-ratio: 1 / 1;
    object-fit: contain;
    max-height: 240px;
    width: auto;
    max-width: 100%;
}

/* =============================== */
/* 4. Σταθεροποίηση καρτών (cards) */
/* =============================== */
.card {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.card-media-wrap {
    min-height: 180px;
}
.card-media {
    min-height: 150px;
}
.card-body {
    flex: 1;
}

/* =============================== */
/* 5. Σταθεροποίηση του sidebar (hero-side) */
/* =============================== */
.hero-side {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.side-card {
    min-height: 80px;
}
.flash-card {
    min-height: 180px;
}

/* =============================== */
/* 6. Σταθεροποίηση του hero-main container */
/* =============================== */
.hero-main {
    min-height: 280px;
}

/* =============================== */
/* 7. Σταθεροποίηση του product grid container */
/* =============================== */
.grid {
    min-height: 200px;
}

/* =============================== */
/* 8. Σταθεροποίηση του load-more-wrap */
/* =============================== */
.load-more-wrap {
    min-height: 50px;
}

/* =============================== */
/* 9. Σταθεροποίηση του logo */
/* =============================== */
.brand-logo-wrap img {
    width: 120px !important;
    height: auto !important;
    aspect-ratio: 120 / auto;
}

/* =============================== */
/* 10. Σταθεροποίηση του search bar */
/* =============================== */
.header-search {
    min-height: 40px;
}

/* =============================== */
/* 11. Σταθεροποίηση του category bar */
/* =============================== */
.catbar-inner {
    min-height: 44px;
}

/* =============================== */
/* 12. Σταθεροποίηση του layout-bottom (About & FAQ) */
/* =============================== */
.layout-bottom {
    min-height: 200px;
}
.about-block,
.faq-block {
    min-height: 150px;
}