/* Astro theme overrides */

html, body {
    overflow-x: hidden;
}

.page-container {
    overflow-x: hidden;
}

.cd-slider-nav .navbar-nav {
    flex-wrap: wrap;
}

.navbar-brand-wrap .navbar-brand {
    margin-bottom: 0;
}

.lang-switcher-nav {
    font-size: 0.95rem;
}

.astro-sidebar-item {
    display: flex;
    align-items: center;
    gap: 10px;
}

.astro-sidebar-dot {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    background-color: rgba(255,255,255,0.8);
    border-radius: 50%;
}

.astro-sidebar-item:has(a.active) .astro-sidebar-dot {
    background-color: #99FF66;
}

.astro-sidebar {
    min-width: 200px;
    padding: 30px 20px 30px 0;
    border-right: 1px solid rgba(255,255,255,0.3);
    margin-right: 25px;
}

.astro-sidebar-nav a {
    display: block;
    padding: 6px 0;
}

.astro-sidebar-nav a.active {
    color: #99FF66;
    font-weight: 400;
}

@media (max-width: 992px) {
    .navbar-brand-wrap {
        margin-bottom: 10px;
    }
    .astro-content-wrapper {
        flex-direction: column;
    }
    .astro-sidebar {
        min-width: 100%;
        padding: 15px 0;
        margin-right: 0;
        margin-bottom: 15px;
        border-right: none;
        border-bottom: 1px solid rgba(255,255,255,0.3);
    }
    .astro-sidebar-nav ul {
        display: flex;
        flex-wrap: wrap;
        gap: 10px 20px;
    }
    .astro-sidebar-nav li {
        margin-bottom: 0 !important;
    }
}

.intro-left-full {
    max-width: none;
    width: 100%;
}

/*
 * All Astro app pages: full-width content column (overrides templatemo narrow wrappers).
 * .page-width-1 / .page-width-2 default max-width 810px / 912px — removed inside this column only.
 */
.astro-content-area-app {
    min-width: 0;
    box-sizing: border-box;
    padding-left: clamp(0.5rem, 2vw, 2rem);
    padding-right: clamp(0.5rem, 2vw, 2rem);
}

.astro-content-area-app .page-width-1,
.astro-content-area-app .page-width-2 {
    max-width: none !important;
    width: 100%;
}

.astro-content-area-app .page-left,
.astro-content-area-app .page-right {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.tm-footer-bar-wrapper.tm-border-top {
    padding-top: 20px;
    padding-bottom: 0;
}

.tm-footer-bar .tm-link-white {
    text-decoration: none;
}

.tm-footer-bar .tm-link-white:hover {
    text-decoration: underline;
}

.astro-nav-social a {
    font-size: 1rem;
    opacity: 0.9;
}

.astro-nav-social a:hover {
    opacity: 1;
    color: #99FF66 !important;
}

/* Projects grid (BreezyCV-style filters without shuffle plugin) */
.astro-portfolio-filters .btn.active {
    background-color: rgba(153, 255, 102, 0.25);
    border-color: #99FF66;
    color: #fff;
}

.astro-portfolio-item.hidden {
    display: none !important;
}

.astro-portfolio-thumb {
    height: 180px;
    width: 100%;
    object-fit: cover;
}

/*
 * Blog / About wrappers (horizontal padding lives on .astro-content-area-app).
 */
.astro-blog-page,
.astro-about-page {
    width: 100%;
    box-sizing: border-box;
}

/* Blog filters: match dark cards + rounded corners (not stark white boxes) */
.astro-blog-filters .astro-blog-filter-control {
    background-color: rgba(0, 0, 0, 0.35);
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 10px;
    color: #fff;
    padding: 0.55rem 1rem;
    min-height: 46px;
    font-size: 0.95rem;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.astro-blog-filters .astro-blog-filter-control::placeholder {
    color: rgba(255, 255, 255, 0.5);
}

.astro-blog-filters .astro-blog-filter-control:focus {
    background-color: rgba(0, 0, 0, 0.48);
    border-color: rgba(153, 255, 102, 0.45);
    box-shadow: 0 0 0 0.2rem rgba(153, 255, 102, 0.12);
    color: #fff;
}

.astro-blog-filters select.astro-blog-filter-control {
    cursor: pointer;
    font-weight: 600;
    padding-right: 2.5rem;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23ffffff' stroke-opacity='0.85' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.8' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.85rem center;
    background-size: 14px 10px;
}

/* Firefox / native arrow suppression where needed */
.astro-blog-filters select.astro-blog-filter-control {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.astro-blog-filters .astro-blog-filter-submit {
    border-radius: 10px;
    min-height: 46px;
    border: 1px solid rgba(255, 255, 255, 0.28);
    background-color: rgba(0, 0, 0, 0.28);
    color: #fff;
    font-weight: 600;
}

.astro-blog-filters .astro-blog-filter-submit:hover {
    background-color: rgba(153, 255, 102, 0.14);
    border-color: rgba(153, 255, 102, 0.55);
    color: #fff;
}

/* Blog listing: BreezyCV-style stacked card (image → date → title), no carousel */
.astro-blog-grid {
    --astro-blog-image-height: 200px;
}

.astro-blog-media {
    position: relative;
    background: rgba(0, 0, 0, 0.35);
}

.astro-blog-card-img {
    display: block;
    height: var(--astro-blog-image-height);
    object-fit: cover;
    vertical-align: middle;
}

.astro-blog-category-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 2;
    max-width: calc(100% - 20px);
}

.astro-blog-category-badge a {
    display: inline-block;
    background: #fff;
    color: #111;
    padding: 4px 10px;
    font-size: 0.75rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: 2px;
    line-height: 1.2;
}

.astro-blog-category-badge a:hover {
    background: #f0f0f0;
    color: #000;
}

.astro-blog-card-body {
    min-height: 5.5rem;
}

.astro-blog-title {
    font-size: 1rem;
    line-height: 1.35;
}

.astro-blog-title:hover {
    color: #99FF66 !important;
}

@media (max-width: 575.98px) {
    .astro-blog-grid {
        --astro-blog-image-height: 180px;
    }
}
