.note,
.warning,
.tip,
.maintenance-pop,
.incident-pop,
.important{
    position: relative;
    z-index: 1;
    margin: 2rem 0;
    border-radius: 0.25rem;
    overflow: hidden;
}

.note,
.warning,
.tip,
.maintenance-pop,
.incident-pop,
.important {
    padding: 1.5rem;
    overflow: hidden;
    background-color: rgb(250, 250, 249);
}

.note::before,
.important::before,
.tip::before,
.maintenance-pop::before,
.incident-pop::before,
.warning::before {
    display: block;
    font-weight: bold;
    margin-bottom: 0.75rem;
}

.maintenance-pop,
.note {
    overflow: unset;
}


.note::before:empty {
    display: none;
}

.maintenance-pop::after,
.note::after {
    content: '';
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -2px;
    border-radius: 0px;
    background: #625ACA;
}

.maintenance-pop p,
.incident-pop p {
    margin-bottom: 0;
}

.warning {
    overflow: unset;
}

.warning::after {
    content: '';
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -2px;
    border-radius: 0px;
    background: rgb(227, 61, 67);
}

.tip {
    overflow: unset;
}

.tip::after {
    content: '';
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -2px;
    border-radius: 0px;
    background: #bfe4ff;
}

.incident-pop,
.important {
    overflow: unset;
}

.incident-pop::after,
.important::after {
    content: '';
    width: 10px;
    height: 100%;
    position: absolute;
    top: 0;
    left: -2px;
    border-radius: 0px;
    background: #1A1649;
}

.note h3.title,
.warning h3.title,
.tip h3.title,
.important h3.title,
.note h2.title,
.warning h2.title,
.tip h2.title,
.important h2.title {
    display: none;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~ Product update styling ~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.title-month{
    position: relative;
    font-size: 20px;
    font-weight: bold;
    color: #404040;
    margin-top: 10px;
    margin-bottom: 30px;
}

.update-month-container{
    position: relative;
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 30px;
    transition: opacity 0.5s linear;
}

.update-month-container:not(:last-child){
    border-bottom: solid 1px rgba(0,0,0,0.1);
}

.product-update-container{
    position: relative;
    margin-bottom: 30px;
}

.product-update-container:hover .update-open-arrow{
    transform: translateX(7px);
}

.update-table{
    position: relative;
    width: 100%;
}

.table-col-1,
.table-col-2,
.table-col-3{
    min-width: 94px;
    vertical-align: top;
}
.table-col-1{
    max-width: 94px;
}
.table-col-3{
    vertical-align: middle;
}

.announcements-type{
    position: relative;
    font-size: 9px;
    font-family: "Mulish", sans-serif;
    font-weight: 700;
    text-align: center;
    line-height: 13px;
    height: 21px;
    padding: 5px;
    color: #1a1649;
    border-radius: 3px;
    background-color: #ccc;
    text-transform: uppercase;
    display: inline-block;
    transform: translateY(-2px);
}
.announcements-date{
    position: relative;
    font-size: 16px;
    font-family: "Mulish", sans-serif;
    font-weight: 500;
    text-align: left;
    line-height: 26px;
    padding: 0px 5px;
    color: #415061;
    display: inline-block;
}
.announcements-title{
    position: relative;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    color: #1a1649;
    margin-bottom: 10px;
}

.incidents{
    background-color: #D8F766;
}
.maintenance{
    background-color: #5D57C9;
    color: #fff;
}
.deprecations{
    background-color: #C2DCFB;
}

.update-day{
    position: relative;
    font-size: 36px;
    font-family: "Lato", sans-serif;
    font-weight: 400;
    text-align: center;
    line-height: 38px;
    padding-top: 5px;
    color: #404040;
}
.update-month{
    position: relative;
    font-size: 12px;
    color: #404040;
    text-align: center;
}

.update-title{
    position: relative;
    font-size: 26px;
    font-weight: 600;
    line-height: 36px;
    color: #625ACA;
    margin-bottom: 10px;
}
.update-body{
    position: relative;
    font-size: 15px;
    color: #415061;
    font-family: 'Lato', sans-serif;
    margin-bottom: 10px;
}

.update-body p:last-child{
    margin-bottom: 0;
}
.update-hashtags{
    position: relative;
    font-size: 18px;
    font-family: 'Lato', sans-serif;
    font-weight: normal;
    color: #625ACA;
}
.update-open-arrow{
    width: 22px;
    height: 50px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42.62 97.74"><path d="M.49 3.5 13.6 19.33l20.87 25.2 4.77 5.75v-2.82L26.13 63.28 5.26 88.48.49 94.24c-1.63 2 1.19 4.81 2.83 2.83l13.11-15.83 20.87-25.2 4.77-5.76a2.07 2.07 0 0 0 0-2.82L28.96 31.63 8.09 6.43 3.32.67C1.68-1.31-1.14 1.53.49 3.5Z" fill="%23323d49"/></svg>');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: auto;
    transition: all 0.3s ease-in-out;
}

#show-more-btn{
    display: initial;
    background: #fff;
    color: rgb(0, 60, 90);
    border: solid 1px rgb(0, 60, 90);
    transition: all 0.15s ease-in-out;
}

#show-more-btn:hover{
    background-color: rgb(0, 60, 90);
    color: #fff;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~ Product update styling ~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~ Might be interested styling ~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.promo-articles-item{
    padding: 18px 24px;
    padding-right: 60px;
    border-radius: 0 0 0 33px;;
    background-color: #1A1649;
}

.promo-articles-item:after{
    content: "";
    position: absolute;
    right: 24px;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 16px;
    height: 36px;
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 42.62 97.74"><path d="M.49 3.5 13.6 19.33l20.87 25.2 4.77 5.75v-2.82L26.13 63.28 5.26 88.48.49 94.24c-1.63 2 1.19 4.81 2.83 2.83l13.11-15.83 20.87-25.2 4.77-5.76a2.07 2.07 0 0 0 0-2.82L28.96 31.63 8.09 6.43 3.32.67C1.68-1.31-1.14 1.53.49 3.5Z" fill="%231A1649"/></svg>');
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    transform: translateX(0px);
    transition: transform 0.3s ease-in-out;
}

.promo-articles-item:hover:after {
    transform: translateX(5px);
}

.promo-category-name{
    font-size: 14px;
    font-weight: 400;
    color: #1A1649;
    opacity: 0.8;
    margin-bottom: 5px;
}
.promo-title{
    font-size: 16px;
    font-weight: 600;
    color: #1A1649 !important;
}

.promo-dsp .promo-articles-item,
.promo-stt .promo-articles-item,
.promo-ssp .promo-articles-item,
.promo-dmp .promo-articles-item,
.promo-api .promo-articles-item,
.promo-studio .promo-articles-item,
.promo-glossary .promo-articles-item,
.promo-notes .promo-articles-item{
    background: #BFE4FF;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~ Might be interested styling ~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Unified notifications box styling ~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.global-notification-box-close svg:hover {
    color: #222222;
    background-color: lightgray;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Unified notifications box styling ~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/


/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Edit tooltip styling ~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.popover {
    border-color: #C5E7DA!important;
    box-shadow: 0 5px 10px #E7F6F1!important;
}

.popover p {
    margin-bottom: 0;
}

.popover .arrow {
    display: none!important;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Edit tooltip styling ~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Edit sign-in button styling ~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.menu a[data-auth-action="signin"] {
    position: relative;
    z-index: 0;
    width: 126.59px; /* Adjusted width to match the specified value */
    height: 36px;
    color: #1E1E1E;
    font: 12px acid-grotesk-regular, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    background: #DAF453;
    margin: 1px 1.5px;
    padding: 7px 24px 8px;
    border-radius: 28px; /* Adding border-radius for rounded corners */
    /*line-height: 0;*/
    display: flex; /* Enable flexbox layout */
    justify-content: center; /* Center horizontally */
    align-items: center;
}

.menu a[data-auth-action="signin"]:focus,
.menu a[data-auth-action="signin"]:active,
.menu a[data-auth-action="signin"]:hover {

    color: #000000;
}

.menu .search form {
    width: 100%;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*~~~~~~~~ Edit sign-in button styling ~~~~~~~~~~~~*/
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

.subscribe-popup{
    position: fixed;
    width: 500px;
    height: auto;
    top: 50vh;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    box-shadow: 0px 5px 15px #aaa;
    display: none;
}

.subscribe-popup-close a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#popup-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.3);
    z-index: 200;
    display: none;
}

#btn-menu-more {
    display: flex;
    text-align: center;
    cursor: pointer;
    color: #625ACA;
    height: 45px;
    align-items: center;
    justify-content: center;
}