@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap');

#main {
    background-color: #F2F4F7;
}

.mallDashboard-0-page .layout-cpnt {
    margin-bottom: 0;
}

.mallDashboard-0-page .callout-cat .inner {
    border-radius: 8px;
}

.mallDashboard-0-page .callout-cat .inner > .b-grey {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
}

.mallDashboard-0-page h2.cat {
    color: #101828;
    text-align: center;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.72px;
}
/* 
.mallDashboard-1339-page .callout-cat .inner span.button {
    background-color: #6ABF4A;
}

.mallDashboard-1339-page .callout-cat .inner .span-arrow::after {
    border-color: #6ABF4A;
} */

.mallDashboard-0-page [data-widget-type="galleryCallout"] .featured-brand {
    background-color: #101828 !important;
}

.mallDashboard-0-page [data-widget-type="galleryCallout"] .featured-brand h2.cat {
    color: #FFFFFF !important;
}

.mallDashboard-0-page .bic-flex-con-block-widget .widget-head {
    margin-bottom: 64px;
}

.mallDashboard-0-page [data-widget-id="2033"] .bic-flex-con-block-widget .widget-head .title {
    border-bottom: 1px solid #FFF;
    padding-bottom: 8px;
    margin: 0 auto 16px !important;
    width: fit-content;
}

.mallDashboard-0-page .bic-flex-con-block-widget .widget-head .description {
    text-align: center;
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 600;
    line-height: 24px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 :is(.card-1, .card-2, .card-3, .card-4) .card-content .title {
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 30.067px;
    font-weight: 700;
    line-height: 38.084px;
    position: absolute;
    bottom: 0;
    padding: 0 0 32px;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] {
    background-color: #101828 !important;
}

:is(.mallDashboard-0-page) [data-widget-type="galleryRecommendation"] h2.cat {
    color: #FFF !important;
    text-align: center;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.72px;
    border-bottom: 1px solid #941F25;
    padding: 0 0 8px;
    margin: 0 0 16px;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] h2.cat {
    color: #101828 !important;
}

:is(.mallDashboard-0-page) [data-widget-type="galleryRecommendation"] ul.rewards-for-you {
    position: relative;
    padding-top: 40px !important;
}

:is(.mallDashboard-0-page) [data-widget-type="galleryRecommendation"] ul.rewards-for-you::before {
    content: "Don’t miss our awesome lineup of top-selling featured products!";
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    color: #FFF;
    text-align: center;
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] ul.rewards-for-you::before {
    color: #475467 !important;
}

:is(.mallDashboard-0-page) .rewards-for-you .product-box {
    border-radius: 8px;
}

:is(.mallDashboard-0-page) .rewards-for-you .product-box .rewards-for-you .product-title {
    color: #101828;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: 0.56px;
}

/* POINTS STOREFRONT OVERRIDES */

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-1.layout-3 .card-1 .card-content .title {
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
    letter-spacing: -0.72px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-1.layout-3 .card-1 .card-content .description {
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}


.mallDashboard-0-page .bic-flex-con-block-widget.card-count-1.layout-6 .card-1 .card-content {
    padding: 0 !important;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-1.layout-6 .card-1 .card-content .title {
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 36px;
    font-weight: 600;
    line-height: 44px;
    letter-spacing: -0.72px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-1.layout-6 .card-1 .card-content .description {
    font-family: "Work Sans", sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
}

.mallDashboard-0-page .brand-store-container a.store {
    flex-direction: column-reverse !important;
}

.mallDashboard-0-page .brand-store-container .store-wrapper h2 {
    margin: 16px 0 0 !important;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    color: #101828;
}

.mallDashboard-0-page [data-widget-type="galleryCallout"] .featured-brand {
    background: url('https://cloudfront.carltonone.com/dashboard-images/client-specific/halo-ahf/storefront/2-up-bg.png') center / cover no-repeat !important;
    padding: 80px 0 !important;
}

.mallDashboard-0-page [data-widget-type="galleryCallout"] .featured-brand h2.cat {
    color: #FFF !important;
    text-align: center;
    font-family: "Oswald", sans-serif;
    text-transform: uppercase;
    font-size: 36px;
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.72px;
    /* border-bottom: 1px solid #FFF; */
    padding: 0 0 8px;
    margin: 0 0 16px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-2.layout-2 .card-content .card-details {
    position: absolute;
    bottom: 0;
    padding: 0 0 32px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-2.layout-2 .card-content .card-details .title {
    font-family: 'Oswald', sans-serif;
    font-size: 28px;
    font-weight: 400;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-3 .card-content .card-details {
    width: 100% !important;
    position: relative;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-3 .card-content .card-details .title {
    position: absolute;
    bottom: 0;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    font-size: 24px;
    line-height: 32px;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-2.layout-2 .card-content .card-details .description {
    font-family: 'Work Sans', sans-serif;
    font-size: 14px;
    line-height: 20px;
    font-weight: 500;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 .widget-head .title {
    color: #101828 !important;
    text-align: center !important;
    font-family: 'Oswald', sans-serif;
    text-transform: uppercase;
    /* font-size: 36px !important; */
    font-style: normal;
    font-weight: 700;
    line-height: 44px;
    letter-spacing: -0.72px;
    border-bottom: 1px solid #941F25;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 .widget-head .description {
    color: #475467 !important;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 {
    background-image: none !important;
    background-color: #FFF !important;
}

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 :is(.card-1, .card-2, .card-3, .card-4) .card-content .title {
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    padding: 0 0 32px;
}

.mallDashboard-0-page .bic-flex-con-block-widget .widget-head .title {
    font-family: 'Oswald', sans-serif;
    /* border-bottom:  1px solid #941F25; */
    /* padding: 0 0 8px; */
    margin: 0 auto !important;
    width: fit-content;
    font-size: 36px !important;
    text-transform: uppercase;
}

.mallDashboard-0-page .bic-flex-con-block-widget .widget-head .description {
    text-align: center;
    font-family: 'Work Sans', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}

/* .mallDashboard-1339-page .bic-flex-con-block-widget .widget-head .title {
    border-bottom:  1px solid #941F25;
} */

.mallDashboard-0-page .bic-flex-con-block-widget.card-count-3.layout-1 .card-content .card-details, .mallDashboard-0-page .bic-flex-con-block-widget.card-count-4.layout-1 .card-content .title {
    width: 100% !important;
    position: relative;
}

.mallDashboard-0-page .bic-flex-con-block-widget:is(.card-count-3.layout-1, .card-count-4.layout-1) :is(.card-1, .card-2, .card-3, .card-4) .card-content .title {
    position: absolute;
    bottom: 0;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] {
    background-color: #F2F4F7 !important;
    padding: 80px 0 !important;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] .rewards-for-you .product-box {
    border: 1px solid #D0D5DD !important;
}

.mallDashboard-0-page [data-widget-type="galleryRecommendation"] .cline.b-grey {
    border: none !important;
}



div#member-dashboard:has(div[data-widget-id="9999"]) .upcoming-anniv-summary-container h2,
div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container.pos-relative.small-container h2,
div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container.pos-relative.small-container h2 + span {
font-family: 'Oswald', sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 32px;
text-transform: uppercase;
}
div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container.pos-relative.small-container h2 + span {
margin: 0;
}


div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container .flex-row.justify-flex-start.align-center.gap-sm,
div#member-dashboard:has(div[data-widget-id="9999"]) .upcoming-anniv-summary-container .header-left.flex-row {
margin-bottom: 8px;
}


div#member-dashboard:has(div[data-widget-id="9999"]) .upcoming-anniv-summary-container path,
div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container.pos-relative.small-container path
{
stroke: #941F25;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .upcoming-anniv-summary-container.service .icon-img img {
filter: invert(17%) sepia(55%) saturate(2760%) hue-rotate(337deg) brightness(83%) contrast(96%);}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] {
background: #0E3C65;
padding: 24px;
display: flex;
flex-direction: column;
align-items: center;
border-radius: 8px;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container div,
div#member-dashboard:has(div[data-widget-id="9999"]) .admin-upcoming-anniv-container div,
div#member-dashboard:has(div[data-widget-id="9999"]) .my-approvals-container div p,
div#member-dashboard:has(div[data-widget-id="9999"]) .admin-upcoming-anniv-container div p {
    font-family: "Raleway", sans-serif !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] label {
text-align: center;
color: #fff;
margin: 0 0 24px;
font-family: 'Oswald', sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 32px;
text-transform: uppercase;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] input {
padding: 12px;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] .panel-tertiary {
width: 100%;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] button,
div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] button[disabled="disabled"] {

color: #2c2c2c;
background: #FFFFFF;
font-family: 'Oswald', sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 24px;
text-transform: uppercase;
border-radius: 1px;
border: 1px solid #FFFFFF;
padding: 10px 16px;
display: inline-block;
text-decoration: none;
text-align: center;
min-width: 140px;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] button:hover,
div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] button[disabled="disabled"]:hover {
background: #eee;
border: 1px solid #eee;
color: #2c2c2c;

}


div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] label::after {
content: "Enter your serial card code below to redeem!";
display: block;
color: #FFFFFF;
text-align: center;
font-family: "Raleway", sans-serif;
font-size: 14px;
font-weight: 500;
line-height: 20px;
margin-top: 8px;
text-transform: none;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div[data-widget-type="serialcard"] .form-group {margin-bottom: 24px;}

div#member-dashboard:has(div[data-widget-id="9999"]) .layout-cpnt {margin-bottom: 0 !important;}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-body h2 {
font-family: 'Oswald', sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 32px;
text-transform: uppercase;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-body h3 {
font-family: 'Oswald', sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 32px;
text-transform: uppercase;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-item .feed-widget-body p,
div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-item .feed-widget-body span,
div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-item .feed-widget-body p a,
div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget-item .feed-widget-body span a {
text-align: center;
font-family: "Raleway", sans-serif !important;
line-height: 1.5em;
}

/* Equal-height columns */
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) {
    display: flex;
    align-items: stretch;
}

div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > [class*="col-"] {
    float: none;
    min-height: 0;
}

/* Left + right columns */
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-3 {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* By default, side-column widgets may absorb extra height */
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2)
    > .col-xs-12.col-md-3
    > * {
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/*
 * RIGHT COLUMN ONLY:
 * Last two widgets must retain their natural/inherited height.
 */
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2)
    > .col-xs-12.col-md-3:last-child
    > :nth-last-child(-n + 2) {
    flex: 0 0 auto;
}

/* Center column fills available height */
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-6 {
    display: flex;
    flex-direction: column;
}

div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2)
    > .col-xs-12.col-md-6
    > * {
    flex: 1 1 0;
    min-height: 0;
    overflow: hidden;
}

div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-3 > * .row,
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-3 > * .row .col-xs-12,
div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-3 > * .row .main-award-container {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .admin-upcoming-anniv-loader:has(> div > *:only-child) {
    min-height: unset;
}

div#member-dashboard:has(div[data-widget-id="9999"]) div.admin-upcoming-anniv-container.small-container {
    min-height: auto !important;
}

div#member-dashboard:has(div[data-widget-id="9999"]) > .row:nth-child(2) > .col-xs-12.col-md-3 > * > div {
    height: 100%;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div,
div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div > div {
    height: 100%;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget .feed-widget-body {
    overflow-y: scroll;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div {
    position: relative;
    /* overflow: hidden; */
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div > .text-center {
    position: absolute;
    top: auto;
    bottom: 0;
    width: 100%;
    z-index: 9999;
    left: 50%;
    transform: translate(-50%);
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div > .text-center {
    display: inline-flex;
    flex-direction: column;
    justify-content: flex-end;
    /* background: linear-gradient(to bottom, rgba(128, 128, 128, 0) 0%, rgba(128, 128, 128, 0.2) 100%); */
    height: fit-content;
}

div#member-dashboard:has(div[data-widget-id="9999"]) .feed-widget > div > .text-center button {
    width: fit-content;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 16px;
}

/* PEER DASHBOARD */
div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
.row.flex-row:has(> .col-md-4 + .col-md-8)  .col-xs-12.col-md-4 {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

@media (min-width: 992px) {

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8) {
    position: relative;
    display: block;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-4 {
    float: none;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8 {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 66.66666667%;
    min-height: 0;
    overflow: hidden;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8
    > .feed-widget,

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8
    > .feed-widget
    > div {
    height: 100%;
    min-height: 0;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8
    .feed-widget-body {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8
    .feed-widget-body {
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  div#member-dashboard:has(div[data-widget-id="9999"]):has(div.col-md-4 + div.col-md-8)
    .row.flex-row:has(> .col-md-4 + .col-md-8)
    > .col-md-8
    .feed-widget-body::-webkit-scrollbar {
    display: none;
  }
}

/* svg logo */
#header-wrap img {
    display: block;
}

#header-wrap .navbar-brand::before {
    content: "";
    background: url('https://raw.githubusercontent.com/mtranhalo-web/css/refs/heads/main/ahf-logo.svg') no-repeat;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    max-width: 79px;
}

#header-wrap .navbar-brand img {
    display: none;
}

@media screen and (max-width: 400px) {
    #header-wrap .navbar-brand::before {
    content: "";
    background: url('https://raw.githubusercontent.com/mtranhalo-web/css/refs/heads/main/ahf-logo.svg') no-repeat;
    width: 100%;
    height: 100%;
    display: block;
    position: relative;
    max-width: 55px;
        background-position: center left;
}
}


.main-award-container {
    border-radius: 8px;
}







	[data-widget-id="10156"].layout-cpnt {
		margin-bottom: 0 !important;
	}
	
	.main-branded-serial-top-container {
		padding: 16px 16px;
		border-radius: 2px 2px 0 0;
		background-color: #0E3C65;
		color: #fff;
		font-family: 'Oswald', sans-serif;
		box-shadow: 0 4px 8px -2px rgba(16, 24, 40, 0.10), 0 2px 4px -2px rgba(16, 24, 40, 0.06);
	}
	
	.main-branded-serial-top-container h3 {
		font-weight: 1000;
		font-size: 24px;
		line-height: 150%;
		letter-spacing: 1px;
		margin: 0 0 4px;
		text-transform: uppercase;
	}
	
	.main-branded-serial-top-container p {
		font-family: "Work Sans", sans-serif;
		font-size: 12px;
		font-weight: 600;
		line-height: 18px;
		/* max-width: 600px; */
	}
	
	[data-widget-type="serialcard"] form.serial-card-redemption {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		gap: 16px;
	}
	
	[data-widget-type="serialcard"] .panel-tertiary {
		margin-bottom: 0 !important;
	}
	
	[data-widget-type="serialcard"] .panel-body {
		padding: 0 16px 16px !important;
		background-color: #0E3C65;
		border-radius: 0 0 2px 2px;
	}
	
	[data-widget-type="serialcard"] .panel-body .form-group label {
		display: none;
	}
	
	[data-widget-type="serialcard"] .panel-body .form-group {
		margin-bottom: 0;
		width: 100%;
	}
	
	[data-widget-type="serialcard"] .form-control {
		padding: 8px 12px;
		border-radius: 8px;
		border: 1px solid #F8F4F1;
		box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05);
	}
	
	[data-widget-type="serialcard"] .panel-body .btn.btn-secondary {
		background-color: #fff;
		font-family: 'Oswald', sans-serif;
		color: #FFF;
		border-radius: 1px;
		font-weight: 600;
		font-size: 14px;
		text-transform: uppercase;
		opacity: 1;
		line-height: 1;
		padding: 10px 16px;
		position: relative;
		width: 100%;
		border: 1px solid #FFE3E4;
	}
	
	[data-widget-type="serialcard"] .panel-body .btn.btn-secondary {
	
font-size: 0 !important;
	}
	[data-widget-type="serialcard"] .panel-body .btn.btn-secondary::after {
		content: 'Submit Code';
		position: absolute;
		left: 0;
		color: #0E3C65;
		width: 100%;
font-size: 14px !important;
	}
	/* #member-dashboard .row.flex-row:nth-of-type(2) {
        margin-top: 32px !important;
        margin-left: 0;
        margin-right: 0;
    }

    #member-dashboard .row.flex-row:nth-of-type(2) .col-xs-12.col-md-12 {
        background: url(https://cloudfront.carltonone.com/dashboard-images/client-specific/big-dunkin/SerialCard.png) center / cover no-repeat #E11383;
        border-radius: 8px;
    } */
	
	@media (max-width: 775px) {
		[data-widget-type="serialcard"] form.serial-card-redemption {
			flex-direction: column;
		}
		[data-widget-type="serialcard"] .panel-body .btn.btn-secondary {
			width: 100%;
		}
	}



/* AHF Above & Beyond dashboard overrides
   Theme colors observed on the live page: red #941F25, blue #0E3C65.
*/

/* Replace the separate serial-card title widget with a CSS title inside the form widget. */
#app.dashboards-1336-page #main .col-md-3 [data-widget-type="html"]:has(.main-branded-serial-top-container) {
  display: none !important;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .panel,
#app.dashboards-1336-page #main [data-widget-type="serialcard"] .panel-body {
  padding: 0;
  border: 0;
  background: #0E3C65;
  color: #fff;
  border-radius: 2px;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption {
  margin: 0;
  padding: 16px;
  color: #fff;
  text-align: left;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption::before,
#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption::after {
  display: block;
  color: #fff;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption::before {
  content: "Redeem Recognition Card";
  margin: 0 0 4px;
  font-family: Oswald, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 0;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group::before {
  content: "Enter your serial card code below to redeem!";
  margin: 0 0 16px;
  font-family: "Work Sans", sans-serif;
  font-size: 12px;
  line-height: 1.5;
  width: 100%;
  margin-bottom: 16px;
  display: block;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption label {
  display: none;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group {
  margin-bottom: 12px;
}

/* Match the approvals and anniversaries titles to the dashboard's Oswald headings. */
#app.dashboards-1336-page #main .my-approvals-container h2,
#app.dashboards-1336-page #main .admin-upcoming-anniv-container .upcoming-anniv-header-container h2 {
  font-family: Oswald, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* Keep the newsfeed controls in the scrolling area and show the AHF red scrollbar. */
#app.dashboards-1336-page #main .feed-widget {
  max-height: 57rem;
  overflow-y: auto;
  scrollbar-color: #941F25 #F2F2F2;
  scrollbar-width: thin;
}

#app.dashboards-1336-page #main .feed-widget::-webkit-scrollbar {
  width: 10px;
}

#app.dashboards-1336-page #main .feed-widget::-webkit-scrollbar-track {
  background: #F2F2F2;
  border-radius: 8px;
}

#app.dashboards-1336-page #main .feed-widget::-webkit-scrollbar-thumb {
  background: #941F25;
  border: 2px solid #F2F2F2;
  border-radius: 8px;
}

#app.dashboards-1336-page #main .feed-widget::-webkit-scrollbar-thumb:hover {
  background: #721015;
}

/* Preserve a 16px gap and let content determine column height. The anniversary
   widget has a 720px vendor minimum; this dashboard override lowers that floor,
   while its natural content can still make it taller when needed. */
#app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.admin-upcoming-anniv-container) .admin-upcoming-anniv-container.small-container {
  min-height: 416px !important;
}

#app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .layout-cpnt {
  margin: 0 !important;
}

@media (min-width: 992px) {
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) {
    align-items: stretch;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has([data-widget-type="marketplace"]),
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
  }

  /* The right-column widgets share any extra height. Hidden widgets stay out
     of flex layout; visible cards stretch while preserving the same 16px gap. */
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) [data-widget-type] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    margin: 0 !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) [data-widget-type] .row {
    display: flex;
    flex: 1 1 auto;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) [data-widget-type] .col-xs-12 {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
  }

  /* Exclude the feed's post count from the row's height calculation. It fills
     the stretched center column and scrolls when its content reaches the edge. */
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6:has(.feed-widget) {
    position: relative;
    display: block;
    min-height: 0;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6:has(.feed-widget) .feed-widget {
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    left: 15px;
    width: auto;
    height: auto;
    margin: 0;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) .main-feed-stack,
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) .main-feed-stack .feed-link,
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) [data-widget-type="serialcard"] .panel {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 100%;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) [data-widget-type="serialcard"] .panel-body,
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) [data-widget-type="serialcard"] .panel-body div:has(form.serial-card-redemption) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) [data-widget-type="serialcard"] form.serial-card-redemption {
    flex: 1 1 auto;
  }
}

/* At tablet and mobile widths, restore natural stacking and a bounded feed. */
@media (max-width: 991px) {
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3,
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6 {
    display: block;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6:has(.feed-widget) {
    position: static;
    display: block;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6:has(.feed-widget) .feed-widget {
    position: static;
    width: auto;
    height: auto;
    max-height: 57rem;
    margin: 0 0 16px !important;
    overflow-x: hidden;
    overflow-y: auto;
  }
}


#app.dashboards-1336-page #main [data-widget-type="serialcard"] form.serial-card-redemption {
    gap: 8px;
}

/* Mobile and stacked-column layout at the dashboard's Bootstrap breakpoint. */
@media (max-width: 991px) {
  #app.dashboards-1336-page #main .profile-info {
    gap: 0 !important;
  }

  #app.dashboards-1336-page #main .profile-info.flex-row.justify-center {
    margin-bottom: 24px !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  /* Flexbox order: recognition cards first, approvals/anniversaries second,
     and the social feed last. */
  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) {
    order: 1 !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.admin-upcoming-anniv-container) {
    order: 2 !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-6:has(.feed-widget) {
    order: 3 !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) {
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #app.dashboards-1336-page #main .row.flex-row:has(.col-md-3):has(.col-md-6) .col-md-3:has(.main-feed-stack) [data-widget-type] {
    margin: 0 !important;
  }
}



/* AHF Above & Beyond dashboard 1338 overrides
   Theme colors observed on dashboard 1336: red #941F25, blue #0E3C65.
*/

/* Replace the separate serial-card heading widget with CSS text on the form. */
#app.dashboards-1338-page #main .col-md-4 [data-widget-type="html"]:has(.main-branded-serial-top-container) {
  display: none !important;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .panel,
#app.dashboards-1338-page #main [data-widget-type="serialcard"] .panel-body {
  padding: 0;
  border: 0;
  background: #0E3C65;
  color: #fff;
  border-radius: 2px;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption {
  margin: 0;
  padding: 16px;
  color: #fff;
  text-align: left;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption::before {
  content: "Redeem Recognition Card";
  display: block;
  margin: 0 0 4px;
  color: #fff;
  font-family: Oswald, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  text-transform: uppercase;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group::before {
  content: "Enter your serial card code below to redeem!";
  display: block;
  width: 100%;
  margin: 0 0 16px;
  color: #fff;
  font-family: "Work Sans", sans-serif;
  font-size: 12px;
  line-height: 1.5;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption label {
  display: none;
}

#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group {
  margin-bottom: 12px;
}

/* Keep the serial-card form's tighter spacing from the current inspect CSS. */
#app.dashboards-1338-page #main [data-widget-type="serialcard"] form.serial-card-redemption {
  gap: 8px;
}

/* Match the approvals and anniversaries headings if these widgets are present. */
#app.dashboards-1338-page #main .my-approvals-container h2,
#app.dashboards-1338-page #main .admin-upcoming-anniv-container .upcoming-anniv-header-container h2 {
  font-family: Oswald, sans-serif;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 1px;
  text-transform: uppercase;
}

/* Show the AHF red scrollbar when the newsfeed overflows. */
#app.dashboards-1338-page #main .feed-widget {
  max-height: 57rem;
  overflow-y: auto;
  scrollbar-color: #941F25 #F2F2F2;
  scrollbar-width: thin;
}

#app.dashboards-1338-page #main .feed-widget::-webkit-scrollbar {
  width: 10px;
}

#app.dashboards-1338-page #main .feed-widget::-webkit-scrollbar-track {
  background: #F2F2F2;
  border-radius: 8px;
}

#app.dashboards-1338-page #main .feed-widget::-webkit-scrollbar-thumb {
  background: #941F25;
  border: 2px solid #F2F2F2;
  border-radius: 8px;
}

#app.dashboards-1338-page #main .feed-widget::-webkit-scrollbar-thumb:hover {
  background: #721015;
}

/* Target the dashboard's 4/8 card-stack and newsfeed row. */
#app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .layout-cpnt {
  margin: 0 !important;
}

@media (min-width: 992px) {
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) {
    align-items: stretch;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-height: 0;
  }

  /* Stretch all cards in the first column while holding a consistent gap. */
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) [data-widget-type] {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    margin: 0 !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) [data-widget-type] .row {
    display: flex;
    flex: 1 1 auto;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) [data-widget-type] .col-xs-12 {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) .main-feed-stack,
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) .main-feed-stack .feed-link,
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) [data-widget-type="serialcard"] .panel {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: 100%;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) [data-widget-type="serialcard"] .panel-body,
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) [data-widget-type="serialcard"] .panel-body div:has(form.serial-card-redemption) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) [data-widget-type="serialcard"] form.serial-card-redemption {
    flex: 1 1 auto;
  }

  /* Remove post content from row sizing; the feed fills the card column height. */
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-8:has(.feed-widget) {
    position: relative;
    display: block;
    min-height: 0;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-8:has(.feed-widget) .feed-widget {
    position: absolute;
    top: 0;
    right: 15px;
    bottom: 0;
    left: 15px;
    width: auto;
    height: auto;
    margin: 0;
    min-height: 0;
    max-height: none;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

/* Mobile: keep the card stack first and place the social feed after it. */
@media (max-width: 991px) {
  #app.dashboards-1338-page #main .profile-info {
    gap: 0 !important;
  }

  #app.dashboards-1338-page #main .profile-info.flex-row.justify-center {
    margin-bottom: 24px !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) {
    order: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-4:has(.main-feed-stack) [data-widget-type] {
    margin: 0 !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-8:has(.feed-widget) {
    order: 2 !important;
    position: static;
    display: block;
    width: 100% !important;
    max-width: 100% !important;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4):has(.col-md-8) .col-md-8:has(.feed-widget) .feed-widget {
    position: static;
    width: auto;
    height: auto;
    max-height: 57rem;
    margin: 0 0 16px !important;
    overflow-x: hidden;
    overflow-y: auto;
  }
}


/* Shared serial-card alignment and description typography for dashboards 1336 and 1338. */
#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption,
#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption {
    padding: 0 !important;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption::before,
#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption::before {
    text-align: center !important;
}

#app.dashboards-1336-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group::before,
#app.dashboards-1338-page #main [data-widget-type="serialcard"] .serial-card-redemption .form-group::before {
    color: #FFFFFF !important;
    text-align: center !important;
    font-family: "Raleway", sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    line-height: 20px !important;
}

/* Restore the 1338 two-column row as a flex row so the newsfeed column
   stretches to the height of the card stack and its scroll area has height. */
@media (min-width: 992px) {
  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4 + .col-md-8) {
    display: flex !important;
    flex-direction: row;
    align-items: stretch;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4 + .col-md-8) .col-md-8:has(.feed-widget) {
    position: relative;
    display: block;
    min-height: 0;
  }

  #app.dashboards-1338-page #main .row.flex-row:has(.col-md-4 + .col-md-8) .col-md-8:has(.feed-widget) .feed-widget {
    position: absolute;
    inset: 0 15px;
    width: auto;
    height: auto;
    max-height: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
  }
}

/* On desktop, the feed body is the actual scrolling element. Override the
   legacy dashboard rule that hides its scrollbar. */
@media (min-width: 992px) {
  #app.dashboards-1338-page #main .feed-widget .feed-widget-body {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scrollbar-color: #941F25 #F2F2F2 !important;
    scrollbar-width: thin !important;
    -ms-overflow-style: auto !important;
  }

  #app.dashboards-1338-page #main .feed-widget .feed-widget-body::-webkit-scrollbar {
    display: block !important;
    width: 10px !important;
  }

  #app.dashboards-1338-page #main .feed-widget .feed-widget-body::-webkit-scrollbar-track {
    background: #F2F2F2 !important;
    border-radius: 8px;
  }

  #app.dashboards-1338-page #main .feed-widget .feed-widget-body::-webkit-scrollbar-thumb {
    background: #941F25 !important;
    border: 2px solid #F2F2F2;
    border-radius: 8px;
  }

  #app.dashboards-1338-page #main .feed-widget .feed-widget-body::-webkit-scrollbar-thumb:hover {
    background: #721015 !important;
  }
}