/* ==========================
   OVERLAY
========================== */

[id^="headlessui-dialog"] .fixed.inset-0.bg-black,
[id^="headlessui-dialog"] .fixed.inset-0{

    backdrop-filter:blur(40px);
    -webkit-backdrop-filter:blur(40px);

    background:
    rgba(0,0,0,.10)
    !important;

}

/* ==========================
   MOBILE MENU
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl{

    background:
    rgba(251,248,245,.45)
    !important;

    backdrop-filter:
    blur(28px);

    -webkit-backdrop-filter:
    blur(28px);

    border-left:
    1px solid rgba(74,15,27,.10);

    box-shadow:
    -20px 0 60px rgba(74,15,27,.08);

}

/* ==========================
   CART DRAWER
========================== */

[data-cart="panel-inner"]{

    background:
    rgba(251,248,245,.32)
    !important;

    backdrop-filter:
    blur(36px);

    -webkit-backdrop-filter:
    blur(36px);

    border-left:
    1px solid rgba(74,15,27,.10);

    box-shadow:
    -20px 0 60px rgba(74,15,27,.08);

}

/* ==========================
   TOP GLOW LINE
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl::before,
[data-cart="panel-inner"]::before{

    content:"";

    position:absolute;

    top:0;
    left:0;
    right:0;

    height:1px;

    background:
    linear-gradient(
        90deg,
        transparent,
        rgba(74,15,27,.15),
        transparent
    );

}

/* ==========================
   TITLES
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl .font-bold{

    color:#4A0F1B !important;

}

[data-cart="title"]{

    color:#4A0F1B !important;

}

/* ==========================
   LINKS
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl a,
[data-cart="panel-inner"] a{

    color:#2A2523 !important;

}

/* ==========================
   HOVER
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl a:hover,
[data-cart="panel-inner"] a:hover{

    color:#4A0F1B !important;

}

/* ==========================
   ICONS
========================== */

.relative.flex.w-full.max-w-xs.flex-col.overflow-y-auto.bg-white.pb-12.shadow-xl svg,
[data-cart="panel-inner"] svg{

    color:#4A0F1B !important;

}