/* ===== GP Child Theme — Tab Slider Styles ===== */

.gp-tabs-horizontal { margin: 2rem 0; }

.gp-tabs-horizontal .tab-nav {
    display: flex; gap: 0;
    border-bottom: 2px solid #e5e7eb;
    overflow-x: auto; margin-bottom: 1.5rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
}

.gp-tabs-horizontal .tab-nav .tab-item {
    padding: 0.75rem 1.5rem; cursor: pointer;
    font-weight: 600; font-size: 0.9375rem;
    color: #6b7280; border: none; background: none;
    border-bottom: 2px solid transparent; margin-bottom: -2px;
    transition: color 0.2s ease, border-color 0.2s ease;
    white-space: nowrap; font-family: inherit;
}
.gp-tabs-horizontal .tab-nav .tab-item.active,
.gp-tabs-horizontal .tab-nav .tab-item:hover {
    color: #2563eb; border-bottom-color: #2563eb;
}
.gp-tabs-horizontal .tab-nav .tab-item:focus-visible {
    outline: 2px solid #2563eb; outline-offset: -2px;
}

/* Vertical */
.gp-tabs-vertical { display: flex; gap: 1.5rem; margin: 2rem 0; }
.gp-tabs-vertical .tab-nav {
    display: flex; flex-direction: column; gap: 0.25rem;
    min-width: 200px; border-right: 2px solid #e5e7eb;
    padding-right: 1rem; flex-shrink: 0;
}
.gp-tabs-vertical .tab-nav .tab-item {
    padding: 0.75rem 1rem; cursor: pointer;
    font-weight: 600; font-size: 0.9375rem;
    color: #6b7280; border: none; background: none;
    border-radius: 4px; text-align: left;
    transition: background 0.2s ease, color 0.2s ease;
    font-family: inherit;
}
.gp-tabs-vertical .tab-nav .tab-item.active,
.gp-tabs-vertical .tab-nav .tab-item:hover {
    background: #eff6ff; color: #2563eb;
}
.gp-tabs-vertical .tab-content { flex-grow: 1; min-width: 0; }

.tab-pane { display: none; }
.tab-pane.active { display: block; }

.tab-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1.5rem;
}

/* Slider */
.gp-slider { position: relative; overflow: hidden; margin: 2rem 0; }
.gp-slider .slider-track { display: flex; transition: transform 0.4s ease; gap: 1.5rem; }
.gp-slider .slider-track .gp-card { flex: 0 0 calc(33.333% - 1rem); min-width: 0; }
.gp-slider .slider-controls { display: flex; justify-content: center; gap: 0.75rem; margin-top: 1.5rem; }
.gp-slider .slider-controls button {
    width: 40px; height: 40px; border-radius: 50%;
    border: 1px solid #e5e7eb; background: #fff;
    cursor: pointer; font-size: 1.125rem;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.2s ease; color: #374151;
}
.gp-slider .slider-controls button:hover {
    background: #f3f4f6; color: #111827;
}

@media (max-width: 768px) {
    .gp-tabs-vertical { flex-direction: column; }
    .gp-tabs-vertical .tab-nav {
        flex-direction: row; min-width: auto;
        border-right: none; border-bottom: 2px solid #e5e7eb;
        padding-right: 0; padding-bottom: 0.5rem;
        overflow-x: auto;
    }
    .gp-tabs-vertical .tab-nav .tab-item { white-space: nowrap; }
    .tab-items { grid-template-columns: 1fr; }
    .gp-slider .slider-track .gp-card { flex: 0 0 calc(100% - 0.5rem); }
}

@media (prefers-reduced-motion: reduce) {
    .gp-tabs-horizontal .tab-nav .tab-item,
    .gp-tabs-vertical .tab-nav .tab-item,
    .gp-slider .slider-track { transition: none; }
}