/* ==========================================================================
   Demo Three — Wishlist (wishlist.html)
   Loaded after home.css + common.css, before responsive.css
   ========================================================================== */
.wl-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 24px;
}

.wl-head .pg-h3 {
    margin-bottom: 4px;
}

.wl-head p {
    font-size: 14px;
    color: var(--pg-muted);
}

.wl-share {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 14px;
    font-weight: 600;
    color: var(--pg-dark);
}

.wl-share .pg-social a {
    width: 34px;
    height: 34px;
    font-size: 13px;
}

.wl-table td.td-remove {
    width: 60px;
    text-align: center;
}

.wl-product {
    display: flex;
    align-items: center;
    gap: 16px;
}

.wl-product a:not(.pg-media) {
    display: block;
    margin-bottom: 4px;
    font-family: var(--pg-head-font);
    font-weight: var(--pg-head-weight);
    font-size: 16px;
    color: var(--pg-dark);
    text-decoration: none;
}

.wl-product a:hover {
    color: var(--pg-accent);
}

.wl-product span {
    font-size: 12px;
    color: var(--pg-muted);
}

.wl-action {
    text-align: right;
}

.wl-foot {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px;
}

@media (max-width: 767.98px) {
    .wl-table td.td-remove {
        width: auto;
        justify-content: flex-end;
    }

    .wl-table td.wl-action {
        justify-content: stretch;
    }

    .wl-table td.wl-action .pg-btn {
        width: 100%;
    }
}

@media (max-width: 575.98px) {
    .wl-foot .pg-btn {
        width: 100%;
    }
}