/*==================================================
    WISHLIST.CSS
    My Lolita Wardrobe
==================================================*/


/*==============================
    GRID
==============================*/

#wishlistGrid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(300px,1fr));

    gap:25px;

}

@media (max-width:700px){

#wishlistGrid{

    grid-template-columns:1fr;

}

}



/*==============================
    FILTER BAR
==============================*/

.wishFilterBar{

    display:flex;

    justify-content:center;

    align-items:center;

    gap:12px;

    flex-wrap:wrap;

}

.wishFilterBar label{

    font-weight:bold;

    color:var(--wine);

}

.wishFilterBar select{

    padding:10px;

    border-radius:14px;

    border:1px solid var(--gold-line);

    background:var(--ivory);

    color:var(--ink);

    font-family:inherit;

}



/*==============================
    PRIORITY BADGES
==============================*/

.priorityBadge{

    display:inline-block;

    border-radius:20px;

    padding:4px 14px;

    font-size:.8rem;

    font-weight:bold;

    margin-bottom:10px;

}

.priorityHigh{

    background:var(--ivory-deep);

    color:var(--wine-deep);

    border:1px solid var(--wine);

}

.priorityMedium{

    background:#ffe7d8;

    color:#a8571c;

    border:1px solid #e08a4c;

}

.priorityLow{

    background:#e4f2e5;

    color:#3c7a41;

    border:1px solid #7cb281;

}



/*==============================
    WISH CARD NOTES
==============================*/

.wishNotes{

    font-style:italic;

    color:var(--ink-soft);

    font-size:.9rem;

}