/* Breadcrumb Navigation - Desktop Only */

/* Container - full width bar below header */
.ckc-breadcrumbs {
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    padding: 12px 20px 6px;
    display: none; /* Hidden by default */
}

/* Show only on desktop (769px+) */
@media (min-width: 769px) {
    .ckc-breadcrumbs {
        display: block;
    }
}

.ckc-breadcrumbs__container {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size: 13px;
}

/* Breadcrumb items - pill style */
.ckc-breadcrumbs__item {
    background: #e8eef7;
    color: #314177;
    padding: 6px 12px;
    border-radius: 16px;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s ease, transform 0.1s ease;
    display: inline-block;
}

.ckc-breadcrumbs__item:hover {
    background: #d4dff0;
    transform: translateY(-1px);
}

.ckc-breadcrumbs__item:active {
    transform: translateY(0);
}

/* Current page (not linked) */
.ckc-breadcrumbs__item--current {
    background: #ddd;
    color: #666;
    cursor: default;
}

/* Tighter gap below breadcrumb bar (skip legacy <br> in indexCKC.php) */
@media (min-width: 769px) {
    .ckc-page-content--with-breadcrumbs #main-content {
        padding-top: 4px;
    }
}

/* Separator between items */
.ckc-breadcrumbs__separator {
    color: #999;
    font-size: 16px;
    line-height: 1;
    user-select: none;
}