/**
 * Personnalisation et alertes : sélection « Pour vous », encart d'alerte,
 * pages de Mon compte, tableaux de la demande.
 * Couleurs de la boutique : vert #1C3A2E / #2A4E44, menthe #71CC98.
 */

.ktb-perso-feed {
    margin: 0 0 36px;
}

.ktb-perso-feed--shop {
    padding-bottom: 8px;
    border-bottom: 1px solid #e5e7eb;
}

.ktb-perso-feed__head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
}

.ktb-perso-feed__title {
    margin: 0;
    font-size: 1.25rem;
    color: #1C3A2E;
}

.ktb-perso-feed__more {
    font-size: .9rem;
}

/* Encart « prévenez-moi » sur une recherche sans résultat. */
.ktb-perso-alert-box {
    max-width: 640px;
    margin: 24px auto;
    padding: 22px 24px;
    background: #EAF2EE;
    border: 1px solid #cfe3d8;
    border-radius: 10px;
}

.ktb-perso-alert-box h3 {
    margin: 0 0 8px;
    color: #1C3A2E;
}

.ktb-perso-alert-box p {
    margin: 0 0 14px;
}

.ktb-perso-alert-box--done {
    background: #e8f6ee;
    border-color: #a7dcc0;
}

.ktb-perso-alert-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.ktb-perso-alert-form input[type="email"] {
    flex: 1 1 240px;
    min-width: 0;
    padding: 11px 14px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
}

.ktb-perso-alert-form .button {
    flex: 0 0 auto;
}

/* Le champ piège à robots ne doit jamais se voir. */
.ktb-perso-hp {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* Listes d'alertes. */
.ktb-perso-alert-list {
    margin: 0 0 26px;
    padding: 0;
    list-style: none;
}

.ktb-perso-alert-list__item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 10px 0;
    border-bottom: 1px solid #eceff1;
}

.ktb-perso-alert-list__item.is-new {
    background: #f4faf6;
}

.ktb-perso-alert-list__item a {
    display: flex;
    align-items: center;
    gap: 14px;
    text-decoration: none;
}

.ktb-perso-alert-list__item img {
    width: 54px;
    height: auto;
    border-radius: 4px;
}

.ktb-perso-alert-list__title {
    font-weight: 600;
    color: #1C3A2E;
}

.ktb-perso-alert-list__meta {
    margin-left: auto;
    color: #6b7280;
    font-size: .88rem;
    text-align: right;
}

.ktb-perso-badge {
    display: inline-block;
    min-width: 20px;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    background: #71CC98;
    color: #1C3A2E;
    font-size: .78rem;
    font-weight: 700;
    text-align: center;
}

/* Tableaux (alertes, demande). */
.ktb-perso-table {
    width: 100%;
    margin-bottom: 26px;
    border-collapse: collapse;
}

.ktb-perso-table th,
.ktb-perso-table td {
    padding: 10px 12px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    vertical-align: middle;
}

.ktb-perso-table thead th {
    background: #EAF2EE;
    color: #1C3A2E;
    font-size: .85rem;
    text-transform: uppercase;
}

.ktb-perso-inline-form {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0;
}

.ktb-demande h2 {
    margin: 28px 0 12px;
    color: #1C3A2E;
    font-size: 1.15rem;
}

/* Le tableau de bord vendeur est étroit : le tableau défile au lieu de déborder. */
.ktb-perso-table-scroll {
    max-width: 100%;
    overflow-x: auto;
}

.ktb-demande .dokan-demande-content {
    max-width: 100%;
    padding: 0 15px 20px;
}

@media (max-width: 600px) {
    .ktb-perso-alert-list__item,
    .ktb-perso-alert-list__item a {
        flex-wrap: wrap;
    }

    .ktb-perso-alert-list__meta {
        margin-left: 0;
        text-align: left;
        width: 100%;
    }
}

/* Boutique : le titre, les icônes de colonnes et le tri sur une seule ligne.
   Le titre est frère de .bwp-top-bar (qui contient .content-top, les icônes
   et le tri), dans la colonne des livres. Le bloc « Pour vous » chargé après
   coup est dans un .ktb-perso-slot : display: contents le dissout. */
.ktb-perso-slot {
    display: contents;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    column-gap: 24px;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > * {
    flex: 0 0 100%;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .ktb-perso-slot {
    display: contents;
}

.ktb-perso-discover {
    flex: 0 0 auto !important;
    order: 1;
    margin: 0 0 18px !important;
    padding: 0;
    line-height: 42px !important;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar {
    flex: 1 1 0;
    min-width: 0;
    order: 2;
    margin: 0 0 18px;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar .content-top {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 16px;
    margin: 0;
    padding: 0;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar .content-top > * {
    margin-top: 0;
    margin-bottom: 0;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar .woocommerce-ordering {
    margin-left: auto;
    float: none;
}

:has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar ~ * {
    order: 3;
}

@media (max-width: 767px) {
    .ktb-perso-discover,
    :has(> .ktb-perso-discover, > .ktb-perso-slot > .ktb-perso-discover) > .bwp-top-bar {
        flex: 0 0 100% !important;
    }
}

/* La sélection est une <ol> (voir class-feed.php) : mêmes réglages qu'une liste. */
ol.ktb-perso-list {
    list-style: none;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
}

/* La sélection se met à jour quand un filtre de la boutique est appliqué. */
.ktb-perso-slot.is-loading .ktb-perso-feed {
    opacity: .45;
    transition: opacity .2s;
}