body{
    background: #f8f8f8!important;
    font-size: 14px;
}
.block-header .content-wrapper{
    margin-left: 0!important;
}
.modal-open .datepicker{
    z-index: 999999;
}
.assistant_schedule_section .nice-select{
    max-width: 100px;
    margin-right: 10px;
    margin-top: 8px;
    padding: 6px 20px;
    min-width: 70px;
    height: 45px;
}
.assistant_schedule_section .form-control{
    height: 45px;
    padding: 10px 20px;
}
.assistant_schedule_section .adminform-filed-end-txt{
    margin: 10px;
}
.assistant_schedule_section{
    display: flex;
    align-items: center;
    margin-top: 10px;
}
.nice-select.open .list{
    display: block;
}
.nice-select .list{
    max-height: 200px;
    overflow-y: auto;
    display: none;
}
.email_generate_form_savebutton input {
    background: #256ef1;
    color: #fff;
    font-size: 14px;
    padding: 10px 25px;
    border: 0px solid;
    font-weight: normal;
    margin-top: 10px;
}
#modal-container #modal-header{
    height: 0!important;
}
body:not(.modal_window_opened) #modal-container #modal-close{
    height: 0!important;
    top:0!important;
}
body:not(.modal_window_opened) #modal-close,
body:not(.modal_window_opened) #modal-container{
    padding: 0!important;
    height: 0!important;
}
.modal_window_opened #modal-overlay{
    position: fixed;
}
.admintable tbody > :not([hidden]) ~ :not([hidden]){
    border-color: rgb(241 245 249 / 1);
    --tw-divide-y-reverse: 0;
    border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
    border-bottom-width: calc(1px * var(--tw-divide-y-reverse));
}
.admintable tbody {
    background: #fff;
}
.admintable thead tr th {
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    --tw-text-opacity: 1;
    color: rgb(71 85 105 / 1);
    text-align: left;
    background: #F8F8F8;
    white-space: nowrap;
    position: relative;
}
.admintable tbody tr td {
    --tw-border-opacity: 1;
    border-color: rgb(241 245 249 / 1);
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 1.25rem;
    padding-bottom: 1.25rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    --tw-text-opacity: 1;
    color: rgb(71 85 105 / 1);
    position: relative;
}
.table-responsive{
    overflow-x: auto;
    width: 100%;
}
.customers_list_section tr.admintable_header th,
.organizations_list_section tr.admintable_header th{
    white-space: nowrap;
    position: relative;
}

.start_wizard__button > div{
    width: 100%;
}
.at-cell-action_links .action_links a{
    display: flex;
    align-items: center;
}
.at-cell-action_links .action_links{
    display: flex;
    align-items: center;
    height: 22px;
}
.at-cell-action_links a:hover svg g{
    fill:#1A4159;
}
.at-cell-action_links a:first-child{
    margin-left: 0;
}
.at-cell-action_links .action_links a{
    margin-left: 12px;
}
td.at-cell-action_links{
    min-width: 100px;
}

tr:hover .at-cell-action_links a{
    display: flex;
}
.label{
    display: inline-flex;
    white-space: nowrap;
    border-radius: 50px;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    padding-left: 0.6rem;
    padding-right: 0.6rem;
    vertical-align: baseline;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    text-transform: capitalize;
}
.label-success{
    --tw-bg-opacity: 1;
    background-color: rgb(80 199 147 / var(--tw-bg-opacity));
    color: #fff;
}
.label-primary{
    --tw-bg-opacity: 1;
    background-color: rgb(70 105 250 / var(--tw-bg-opacity));
    color: #fff;
}
.label-danger{
    background-color: rgb(241 89 92 / 1);
    color: #fff;
}
.label-info{
    background: #DEE4FC;
    color: #2563EB;
}
.at-cell-delete,
.at-cell-edit{
    padding: 0!important;
}
.at-cell-delete a svg,
.at-cell-edit a svg{
    margin: auto;
}
.at-cell-delete a,
.at-cell-edit a{
    border-radius: 3px;
    border-color: #E6E8F0;
    border-style: solid;
    border-width: 1px;
    display: flex;
    align-items: center;
    width: 30px;
    height: 30px;
}
.buttons-section {
    width: 100%;
}

.pipeline-dropdown{

}
.adminbuttons {
    display: flex;
}
.collapsed .sidebar-wrapper:hover .navItem > span > span > span {
    display: contents;
}
.collapsed .sidebar-wrapper .navItem > span > span > span{
    white-space: nowrap;
}
.collapsed .sidebar-wrapper .navItem > span{
    flex-wrap: wrap;
}
.collapsed .sidebar-wrapper .navItem > span > span{
    visibility: inherit;
    line-height: 20px;
    min-height: 20px;
}
/* duplicate nice-select rule removed — see global rule lower in this file */
#extendedsearch .modal-dialog {
    max-width: 90vw !important;
    min-width: 800px;
    width: 800px;
}
#extendedsearch .modal-dialog .modal-content {
    padding: 0 !important;
    width: 100%;
}
#extendedsearch .model-headline {
    width: 100%;
}
.tags-for-regularpages #input-tags-selectized{

}
.tags-for-regularpages .selectize-input{
    border-radius: 5px;
    border: 1px solid #EAEAEB;
    min-height: 40px;
    padding: 7px 20px!important;
}
.selectize-control.multi .selectize-input.has-items{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
#modal-container{
    padding: 0!important;
    border-radius: 6px!important;
    border-width: 0px!important;
}
#modal-container #modal-close{
    position: absolute;
    right: 25px;
    top: 25px;
    background-image: url("data:image/svg+xml,%3Csvg%20aria-hidden%3D%22true%22%20class%3D%22w-5%20h-5%22%20fill%3D%22%23ffffff%22%20viewBox%3D%220%200%2020%2020%22%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M4.293%204.293a1%201%200%20011.414%200L10%208.586l4.293-4.293a1%201%200%20111.414%201.414L11.414%2010l4.293%204.293a1%201%200%2001-1.414%201.414L10%2011.414l-4.293%204.293a1%201%200%2001-1.414-1.414L8.586%2010%204.293%205.707a1%201%200%20010-1.414z%22%20clip-rule%3D%22evenodd%22%3E%3C/path%3E%20%3C/svg%3E")!important;
    width: 25px;
    height: 25px;
    opacity: 1;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: transparent;
}
#modal-container #modal-content > div{
    padding: 0 10px 10px;
}
#modal-container #modal-content h4{
    width: 100%;
    background: rgb(17 17 18 / 1);
    margin: 0;
    color: #fff;
    font-weight: 500;
    padding: 20px 24px;
    border-radius: 0;
    box-sizing: border-box;
}
#extendedsearch #ext-search{
    padding: 20px 24px;
}
#extendedsearch .adminform-card{
    border: none;
    padding: 0;
    max-width: 100%;
}
#extendedsearch .adminform_table{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 40px;
}
#extendedsearch .adminform_table > div{
    padding: 10px 0;
}
.dropdown{
    position: relative;
}
.at-cell-location,
.at-cell-department{
    display: flex;
    align-items: center;
}
.additional-buttons-section .ab-button:hover, .buttons.flex .ab-button:hover {
    border-color: #0F172A;
    background: #0F172A;
    color: #fff;
}
.additional-buttons-section .ab-button, .buttons.flex .ab-button {
    display: flex;
    align-items: center;
}
.nice-select::after {
    border-bottom: 2px solid #94A3B8;
    border-right: 2px solid #94A3B8;
    width: 7px;
    height: 7px;
}
.fade:not(.show){
    display: none;
}
.add-new-board-button a{
    white-space: nowrap;
    border-width: 1px!important;
}
.extended-buttons .nice-select{
    padding-left: 0;
    padding-right: 10px;
}
.gap-10{
    gap: 10px;
}
.mr-10{
    margin-right: 10px;
}
.page-bar-section .nice-select{
    height: inherit;
    padding-left: 5px;
    padding-right: 40px;
    background: #EEF1F9;
    border-color: #EEF1F9;
}
.pagination-records{
    white-space: nowrap;
    font-weight: 300;
}
.total_values_info{
    font-weight: 300;
    color: #000;
    margin-bottom: 0!important;
}
.stage-step-wrapper.active{
    background: #0F172A!important;
}
.open > .dropdown-menu {
    display: block;
}
.dropdown-menu {
    border-radius: 0.5rem;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    z-index: 1000;
    float: left;
    min-width: 160px;
    font-size: 14px;
    text-align: left;
    list-style: none;
}
.dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    white-space: nowrap;
}
.flex-direct-column{
    flex-direction: column;
}
.modal-open {
   overflow: hidden;
}
.modal {
   display: none;
   overflow: hidden;
   position: fixed;
   top: 0;
   right: 0;
   bottom: 0;
   left: 0;
   -webkit-overflow-scrolling: touch;
   outline: 0;
}
.fade.in{
    opacity: 1;
}
.modal.fade.in .modal-dialog{
    transform: translate(0, 0);
    min-width: 600px;
}
.contacts_list_wrapper{
    margin-top: 10px!important;
}
.adminform_form .form-group{
    display: table;
    width: 100%;
}
.tinymce_modal_content .adminform_savebutton{
    margin-top: 10px;
}
.additional_functionality_section .google_search_button{
    margin-right: 0!important;
}
.tinymce_modal_content{
    position: relative;
    padding: 10px 40px 40px;
}
#tinymce_modal h2{
    padding: 10px 30px;
}
#tinymce_modal .row h1,
#tinymce_modal h2,
#openai_assistant_history_modal h1,
#openai_assistant_modal h1,
#assign_customer_modal h1,
#ai_modal h1,
#add_customer_modal h1{
    position: absolute;
    top:-60px;
    color: #fff;
    left: 0;
    font-size: 23px!important;
    font-weight: normal;
}
#tinymce_modal .modal-dialog .model-headline,
#openai_assistant_history_modal .modal-dialog .model-headline,
#openai_assistant_modal .modal-dialog .model-headline,
#assign_customer_modal .modal-dialog .model-headline,
#ai_modal .modal-dialog .model-headline,
#add_customer_modal .modal-dialog .model-headline{
    width: 100%;
}
#tinymce_modal .modal-dialog .modal-content .openai_assistant_history_modal_content,
#openai_assistant_history_modal .modal-dialog .modal-content .openai_assistant_history_modal_content,
#openai_assistant_modal .modal-dialog .modal-content .openai_assistant_modal_content,
#assign_customer_modal .modal-dialog .modal-content .assign_customer_messagemodal_content,
#ai_modal .modal-dialog .modal-content .ai_modal_content,
#add_customer_modal .modal-dialog .modal-content .add_customer_messagemodal_content{
    /* top padding bumped from 10 → 28 to clear the new floating
       X close button (top:12 + h9=36 / 2 = 30). Keeps existing
       fragments from being clipped. */
    padding: 28px 40px 40px;
}
#tinymce_modal .modal-dialog .modal-content,
#openai_assistant_history_modal .modal-dialog .modal-content,
#openai_assistant_modal .modal-dialog .modal-content,
#assign_customer_modal .modal-dialog .modal-content,
#ai_modal .modal-dialog .modal-content,
#add_customer_modal .modal-dialog .modal-content{
    padding: 0!important;
}
#add_customer_modal #uploadImageModal .modal-dialog .modal-content{
    padding: 20px!important;
}
#view_video_modal .modal-dialog, #ai_modal .modal-dialog, #tinymce_modal .modal-dialog, #openai_assistant_history_modal .modal-dialog, #openai_assistant_modal .modal-dialog, #assign_customer_modal .modal-dialog{
    display: table;
    margin: auto;
    min-width: 750px;
}
.modal.fade .modal-dialog{
    transform: unset!important;
}
.modal-dialog .modal-content{
    padding: 40px;
}
.modal-content {
    background: #fff;
    border-radius: 0.25rem;
}
.modal-open .modal-backdrop{
    display: block;
    opacity: 0.5;
}
#savesearch .modal-content h3,
#savesearch2 .modal-content h3{
    font-size: 22px;
}
#savesearch .modal-content,
#savesearch2 .modal-content{
    padding: 20px;
}
.common_shared_modal_content,
.preview_customer_messagemodal_content{
    width: 100%;
}
.add_customer_messagemodal_content{
    width: 100%;
}
.add_customer_messagemodal_content h2{
    font-size: 25px;
    font-weight: 500;
    margin-bottom: 20px;
}
.tags-for-regularpages.selectized{
    display: none;
}
.modal .flex{
    align-items: center;
}
.modal h4{
    font-size: 18px;
}
.selectize-input{
    height: 40px;
}
.nice-select{
    height: 34px;
    line-height: 32px;
    display: inline-flex;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
}
.nice-select .option svg{
    margin-right: 10px;
}
.nice-select .option
{
    display: flex;
    align-items: center;
    line-height: 1.4;
    min-height: 36px;
    padding-top: 8px;
    padding-bottom: 8px;
}
.selectize-input{
    padding: 8px 12px;
    border-color: rgb(226 232 240 / 1);
}
.modal{
    overflow-y: auto;
}
#ai_modal .modal-content .row label, #tinymce_modal .modal-content .row label, #view_video_modal .modal-content .row label, #assign_customer_modal .modal-content .row label, #openai_assistant_history_modal .modal-content .row label, #openai_assistant_modal .modal-content .row label, #common_shared_modal .modal-content .row label, #add_customer_modal .modal-content .row label{
    z-index: unset!important;
    font-size: 14px!important;
    top:-1px;
    padding: 0;
    margin: 0;
}
#ai_modal .modal-content .row h1, #tinymce_modal .modal-content .row h1, #view_video_modal .modal-content .row h1, #assign_customer_modal .modal-content .row h1, #openai_assistant_history_modal .modal-content .row h1, #openai_assistant_modal .modal-content .row h1, #add_customer_modal .modal-content .row h1, #common_shared_modal .modal-content .row h1{
    margin-bottom: 10px!important;
}
.at-cell-tags .label-info{
    margin-bottom: 5px;
}
.nice-select .current svg{
    margin-right: 10px;
}
.nice-select .current{
    display: flex;
    align-items: center;
}
h1{
    font-size: 22px;
}
h4{
    font-size: 18px;
}
h2{
    font-size: 20px;
    margin-bottom: 10px;
}
.settings_tabs{
    padding: 0!important;
    margin-bottom: 0!important;
}
.adminform_form .form-label{
    margin-bottom: 0;
    margin-top: 10px;
}
.socialsharewrap{
    margin-bottom: 20px;
}
.previewinviteurl{
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: 8px;
    color: #fff;
    padding: 8px 17px;
    background: #0F172A;
    display: table;
    margin-top: 10px;
}
.widget-settings-form{
    padding: 0!important;
}
.widget-settings-form #admintablerow-initial_message{
    display: table;
}
.embed_grid{
    display: table;
    width: 100%;
}
.add_customer_messagemodal_content #search-box{
    padding-left: 30px;
}

.btn-primary:hover{
    box-shadow: none;
}
#admintablerow-schedule div:last-child{
    display: flex;
    align-items: center;
}
.js .inputfile {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.inputfile + label {
    max-width: 80%;
    font-size: 1.25rem;
    /* 20px */
    font-weight: 700;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    display: inline-block;
    overflow: hidden;
    padding: 0.625rem 1.25rem;
    /* 10px 20px */
}

.no-js .inputfile + label {
    display: none;
}

.inputfile:focus + label,
.inputfile.has-focus + label {
    outline: 1px dotted #000;
    outline: -webkit-focus-ring-color auto 5px;
}

.inputfile + label * {
    /* pointer-events: none; */
    /* in case of FastClick lib use */
    color: #4669FA;
}

.inputfile + label svg {
    width: 1em;
    height: 1em;
    vertical-align: middle;
    fill: currentColor;
    margin-top: -0.25em;
    margin-right: 0.25em;
    display: inline;
}

.inputfile-1 + label {
    color: #fff;
    background-color: #1A4159;
    font-size: 15px;
    padding:10px 30px;
}
.employee_details .inputfile-1:focus + label,
.employee_details .inputfile-1.has-focus + label,
.employee_details .inputfile-1 + label:hover {
    background-color: #1A4159!important;
}
.inputfile-1:focus + label,
.inputfile-1.has-focus + label,
.inputfile-1 + label:hover {
    background-color: transparent;
}
.display-t{
    display: table;
}

.inputfile-1 + label:hover{
    background: transparent;
}
.send_custom_sms_form .customer-sms-send-message{
    display: flex;
    float: right;
    margin-top: -50px;
}
.appointments_section #schedule {
    margin-right: 10px;
}
.form-group .flex{
    align-items: center;
}
#schedule {
    width: 120px;
    display: inline;
}
#admintablerow-schedule .adminform-filed-end-txt {
    float: left;
    line-height: 49px;
    margin: 0 10px 0 10px;
}
#admintablerow-schedule .nice-select.wide {
    width: 70px;
    float: left;
    clear: none;
    margin-right: 15px;
}
.send_custom_sms_form .customer-sms-send-message a{
    margin-right: 15px;
}
.attachment-icon {
    float: right;
    margin-right: 180px;
    margin-bottom: -30px;
    position: relative;
    top: 10px;
}
.customer-notes .rd-dash-notes > div{
    display: table;
    width: 100%;
}
.tinymce_modal_content{
    width: 100%;
}
input[type="submit"]{
    color: #FFFFFF;
    background: #0F172A;
    border-color: #0F172A;
    border-width: 0px;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 24px;
    cursor: pointer;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    border-radius: 8px;
    padding: 8px 17px;
}
.videouploading > div{
    margin: 0;
}
#tags_content .tags_button{

}
.note-edit-icon img{
    width: 15px;
}
.note-edit-icon{
    display: inline-block;
    margin-top: 18px;
    position: relative;
    margin-right: 10px;
    top: 0;
}

.note-edit-icon a {
    display: table;

}
.dropdown-item {
    display: block;
    width: 100%;
    padding: 10px 1.5rem;
    clear: both;
    font-weight: 400;
    color: #212529;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
    font-size: 14px;
}
.dropdown-menu-compaign {
    position: absolute;
    right: 0;
    left: unset;
    min-width: 130px;
}
.ml-10{
    margin-left: 10px;
}
#tags_content .tags_button{
    padding: 0px 10px!important;
    font-size: 12px;
    border-radius: 3px!important;
}
.nav.nav-tabs{
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
}
.filter_buttons > .ab-button.active,
.nav.nav-tabs > li.active > a {
    background: transparent;
    border-bottom: 2px solid #0F172A;
    color: #0F172A;
    font-weight: 600;
}
.filter_buttons > .ab-button:hover{
    background: transparent;
    color: #737373;
}
.filter_buttons > .ab-button{
    border: 0px solid;
    background: transparent;
    border-radius: 0;
}
.filter_buttons > .ab-button,
.nav.nav-tabs > li > a {
    padding: 10px;
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #737373;
    display: table;
}
.label > i{
    margin-right: 5px;
}
.label{
    display: flex;
    align-items: center;
    width: fit-content;
}
.secondary-nav{
    margin-bottom: 0!important;
    margin-left: 20px;
}

.plyr--video{
    display: table;
    margin: auto;
    border-radius: 20px;
    background: #fff;
}
.plyr__video-wrapper{
    background: #fff;
}
.videoeditor {
    background: #fff;
    padding: 40px 60px;
    box-shadow: 0 3px 2px -2px rgba(0,0,0,0.2);
    border: 1px solid #f0f0f0;
    border-radius: 5px;
}
.video_item:hover .playvideobutton{
    background: url("images/videoplayicon.png") no-repeat center center;
    display: table;
    width:60px;
    height: 60px;
    right: 44%;
    top: 35%;
    position: absolute;
    z-index: 99;
}
.videolistsection.sharebuttom .qnty a{
    padding-right: 7px;
    padding-left: 7px;
}
.sharebuttom {
    padding: 5px 20px;
    border-top: 0px solid #f0efef;
}

.video-list .videoscreen-wrapper .sharebuttom{
    align-items:flex-end;
    position: relative;
    bottom: 0;
    min-height: 50px;
}
.videodashboard .customer_video_list .video_item{
    width: 33.333%;
}
.customer_video_list .video_item{
    width: 100%;
}
.customer_video_list{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.videodashboard.assets_section{
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.videoid span{
    background: #1e282c;
    height: 33px;
    padding:4px 15px;
    position: relative;
    top:-10px;
    color: #fff;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
}
.videoid{
    position: absolute;
    z-index: 99;
    left:0px;
    top:25px;
}
.videodashboard.assets_section .video_item .received-info .video-status div:nth-child(2) a{
    color: red;
    margin-right: 10px;
}
.videodashboard.assets_section .video_item .received-info .publish_button svg{
    display: none;
}
.videodashboard.assets_section .video_item .received-info .publish_button{
    background: transparent!important;
}
.videodashboard.assets_section .video_item .received-info .pull-left{
    flex-grow: 1;
}
.videodashboard.assets_section .video_item .received-info .video-status{
    display: flex;
    align-items: center;
}
.videodashboard.assets_section .video_item{
    max-width: 30%;
    padding: 0;
    padding-top:10px;
}
.videodashboard{
    width:100%;
    display: flex;
    flex-wrap: wrap;
    margin-left: 0px!important;
    margin-right: 0px!important;
}
.video-title a{
    color:#167ac6;
    font-weight: 500;
}
.video-description{
    padding:0px 10px;
}
.video-title{
    padding:5px 10px;
}
.sharebuttom ul li{
    float: left;
    flex: 1;
    text-align: center;
    margin-right: 10px;
}
.sharebuttom ul li span{
    font-size: 20px;
}
.sharebuttom ul li:first-child a{
    font-size: 12px;
    color: #1A4159;
}
.sharebuttom ul li:last-child{
    border-right: 0px solid #e2e2e2;
    float: right;
}
.sharebuttom ul li a i{
    font-size: 18px;
}
.sharebuttom ul{
    padding: 5px 0 0 0!important;
    margin: 0;
    display: table;
    width: 100%;
    list-style: none;
}
.sharebuttom ul li.editsection{
    display: flex;
    margin-right: 0;
}

.sharebuttom ul li.qnty a{
    padding-top: 7px;
    font-size: 12px;
}
.sharebuttom ul li.qnty a svg{
    position: relative;
    top:2px;
}
.sharebuttom ul li.qnty{
    display: flex;
}
.sharebuttom ul li a#dropdownMenu2{
    padding-top: 8px;
}
.sharebuttom ul li a.facebook{
    color: #1A4159;
    border:1px solid #E2E2F6;
    border-radius: 5px;
    padding: 5px 10px;
}
.sharebuttom ul li a{
    font-size: 12px;
    display: table;
    width: 100%;
    padding:5px 10px;
}
.sharebuttom ul li a.pageurl{
    color: #372778;
    padding-top: 8px;
}
.sharebuttom ul li a.linkedin{
    color: #1A4159;
    border:1px solid #E2E2F6;
    border-radius: 5px;
    padding: 5px 8px;
}
.sharebuttom ul li a.twitter{
    color: #1A4159;
    border:1px solid #E2E2F6;
    border-radius: 5px;
    padding: 5px 6px;
}
.videoscreen{
    background: #000;
    border: 0px solid #e2e2e2;
    display: table;
    width: 100%;
}
.sharebuttom .qnty span {
    display: flex;
    align-items: center;
    font-size: 14px;
    color: #000;
    padding-left: 0px;
}
.dash-total-requested{
    width: 100%;
}
.dash-total-requested .sharebuttom{
    padding-bottom: 25px;
    max-height: 50px;
}
.videoscreen.audioscreen img{
    margin-top: 10px;
    max-width: 100%;
}
.videoscreen.audioscreen {
    padding-bottom: 20.25%;
}
.videoscreen {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
}
.videoscreen video{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.video_item{
    padding: 0px;
    margin-right: 20px;
    margin-bottom: 20px;
    width: 31%;
    border-radius: 10px;
    box-shadow: 0 3px 22px -2px rgba(0,0,0,0.1);
}
.customer_video_list .video_item{
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px;
    height: 0;
    margin-right: 10px;
}
.video_item{
    padding: 0!important;
}
.video_item:hover{
    background: #fff;
    box-shadow: 0 3px 22px -2px rgba(0,0,0,0.1);
}
.video_item:hover .sharebuttom ul li:first-child a,
.video_item:hover .sharebuttom ul li a.linkedin,
.video_item:hover .sharebuttom ul li a.twitter,
.video_item:hover .sharebuttom ul li a.facebook{
    color: #1A4159;
}
.video_item:hover svg g{
    fill: #1A4159;
}
.videoscreen-wrapper{
    border: 0px solid #e2e2e2;
    margin-bottom: 10px;
    padding-top: 0px;
}
.dashboard_home .video-list-wrapper{
    padding: 0px 25px;
    display: flex;
    flex-wrap: wrap;
}
.video_item img {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    max-height: 100%;
    margin: 0px auto;
    max-width: 100%;
    height: 100%;
}
.video_item .videoinfo .received-info span{
    font-size: 16px;
    font-weight: 500;
    color: #64748B;
}
.video_item .videoinfo .received-info img{
    position: relative;
    top:-3px;
    padding-right: 10px;
    float: left;
}
.socialsharewrap{
    margin: 25px auto 20px;
    display: table;
}
.socialsharewrap td{
    vertical-align: middle!important;
}
.full-width-form{
    width: 100%;
}
.fb-button:hover{
    color: #fff;
}
.fb-button{
    font-size: 18px;
    border-radius: 0px;
    background: #3b579d;
    padding:5px 60px;
    color: #fff;
    text-align: center;
}
.tw-button:hover{
    color: #fff;
}
.tw-button{
    font-size: 18px;
    border-radius: 0px;
    background: #5ea9dd;
    padding:5px 60px;
    color: #fff;
    text-align: center;
    margin-left:5px;
    margin-right:5px;
}
.linked-button:hover{
    color: #fff;
}
.linked-button{
    font-size: 18px;
    border-radius: 0px;
    background: #006599;
    padding:5px 60px;
    color: #fff;
    text-align: center;
}

.video_item .videoinfo .received-info .clockicon{
    top:-1px;
    padding-right: 0px;
    padding-left: 10px;
}
.video_item .videoinfo .received-info span{
    padding-left: 10px;
    font-size: 14px;
    font-weight: 400;
}
.video_item .videoinfo .received-info{
    font-weight: 400;
    font-size: 14px;
    color: #64748B;
    margin-top:10px;
    padding-top:3px;
}
.video_item .videoinfo a span{
    font-weight: 400;
    position: relative;
    font-size: 18px;
}
.video_item .videoinfo a img{
    padding-right: 7px;
    float: left;
}
.video_item .videoinfo a{
    color: #666666;
}
.video_item .videoinfo{
    padding:15px 20px 0 20px;
    min-height: 120px;
    flex-grow: 1;
}
.sharebuttom ul li .error{
    line-height: 40px;
    color: red;
}
.video_item .videoinfo img{
    position: relative;
    height: auto;
    top:4px;
}
.video_item .videoinfo .vide-status{
    color:#807f7f!important;
    display: table;
    width: 100%;
    font-size: 12px;
}
.video_item .videolist-tags{
    margin-top: 10px;
}
.video_item .videoinfo .vide-status.vide-status-published svg{
    fill: #2FBB66;
    width: 18px;
}
.video_item .videoinfo .vide-status.vide-status-published{
    color: #2FBB66!important;
    display: flex;
    gap: 5px;
}
.video_item .edit.pageurl img{
    top:-2px;
}
.video_item .edit img{
    position: relative;
    height: auto;
}
.embed_grid h2{
    font-size: 20px;
}
.embed_grid .socialsharewrap .table-responsive{
    margin-left: 0;
    margin-right: 0;
}
.embed_grid .socialsharewrap{
    margin-bottom: 0;
    padding: 1.5rem!important;
    border-radius: 0.375rem;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    --tw-shadow: 0px 0px 1px rgba(40, 41, 61, 0.08), 0px 0.5px 2px rgba(96, 97, 112, 0.16);
    --tw-shadow-colored: 0px 0px 1px var(--tw-shadow-color), 0px 0.5px 2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
#admintablerow-sender_email div:last-child{
    display: flex;
    align-items: center;
}
.assets_section .videoscreen{
    background: transparent;
}
.assets_section .videoinfo .customer-info span{
    display: table;
    width: 100%;
    margin-bottom: 7px;
    font-size: 14px;
}
.assets_section .videoinfo .customer-info{
    flex-grow: 1;
    min-height: 50px;
}
.assets_section .video_item:hover svg g{
    fill: #fff;
}
.assets_section .videoscreen-wrapper{
    display: flex;
    flex-direction: column;
    height: 100%;
}
.assets_section .video_item .videoinfo .customer-info span{
    white-space: inherit;
}
.assets_section .videoinfo{
    display: flex;
    flex-direction: column;
    padding-bottom: 20px;
}
.additional_top_navigation .nav li a{
    white-space: nowrap;
}
.additional_top_navigation .nav{
    flex-wrap: unset;
}
.additional_top_navigation{
    display: table;
    margin: 0 auto 20px;
}
#searchModal form{
    width: 100%;
}
#searchModal .modal-content{
    padding: 0;
}
.aui-message.aui-message-warning{
    background: rgb(250 145 107 / 14%);
    width: 100%;
    border-radius: 8px;
    font-weight: 400;
    font-size: 0.875rem;
    line-height: 1.25rem;
    padding-top: 18px;
    padding-bottom: 18px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    color: rgb(250 145 107 / 1);
}
#openai_assistant_modal .modal-content{
    height: 100vH;
}
#openai_assistant_modal .modal-dialog{
    right: 0!important;
    position: absolute;
}
.aiassistant-button{
    background: #0F172A!important;
}

.progress {
    width: 100%;
    height: 20px;
    border-radius: 0;
    position: relative;
}
.progress-wrap {
    margin: 20px 0;
    overflow: hidden;
    position: relative;
    border-radius: 100px;
}
.progress-bar {
    background: #4669FA;
    left: 0;
    height: 4px;
    border-radius: 100px;
    position: absolute;
    top: 10px;
}
.nice-select .list,
.nice-select{
    width: 100%;
}
#admintablerow-sms_ctg_select .nice-select{
    margin-bottom: 10px;
}
#admintablerow-ok > div:first-child{
    order: 1;
    margin-left: 5px;
}
#admintablerow-ok{
    display: flex;
}
.tooltip{
    display: none!important;
}
.btn.dropdown-toggle:hover{
    box-shadow: none;
}
.btn.dropdown-toggle{
    background: transparent;
    padding: 0.375rem;
}
.min-w-\[40px\]{
    min-width: 40px;
}
.dropdown-item:active{
    color: #fff;
}
.at-cell-status > a{
    background: transparent;
    height: inherit;
    width: inherit;
}
.trigger_page #block0title{
    display: none;
}
.templates_section .additional-buttons-section .adminbuttons{
    margin-top: -45px;
}
.pagination-wrapper{
    display: table;
    width: 100%;
}
.templates_section .col-md-3{
    padding-left: 0;
}
.templates_section .block-content-outer{
    display: flex;
    flex-direction: row;
    gap: 20px;
}
/* Email/Text templates — no sidebar, card takes full width */
body.emailtemplates_page .block-content-outer,
body.messagetemplates_page .block-content-outer{
    display: block !important;
}
body.emailtemplates_page .block-content-inner,
body.messagetemplates_page .block-content-inner{
    width: 100%;
}
.templates_section .additional-buttons-section .buttons > div{
    display: block;
    width: 100%;
}
.templates_section .extended-buttons .templates-dropdowns{
    max-width: 300px;
}
.templates_section .extended-buttons.menu-open{
    margin-top: 0px;
    margin-bottom: 0px;
    max-width: 300px;
    align-items: unset;
    padding: 1.5rem;
    border-radius: 0.375rem;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    --tw-shadow: 0px 0px 1px rgba(40, 41, 61, 0.08), 0px 0.5px 2px rgba(96, 97, 112, 0.16);
    --tw-shadow-colored: 0px 0px 1px var(--tw-shadow-color), 0px 0.5px 2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    flex-direction: column;
}
.categoriest-list-section ul li .category-item-featured:hover{
    color: #fbf432!important;
}
.categoriest-list-section ul li .category-item-featured.is-featured{
    color: rgb(71 85 105 / 1)!important;
}
.categoriest-list-section ul li .category-item-featured{
    width: 20px;
    font-size: 18px;
    padding: 0 0 0 15px;
    color: rgb(71 85 105 / 1)!important;
    font-size: 14px;
}
.categoriest-list-section ul li a:hover span{
    color: #fff;
}
.categoriest-list-section ul li a span{
    background: #F7F8FC;
    padding: 2px;
    border-radius: 100px;
    color: #475569;
    font-size: 12px;
    min-width: 30px;
    margin-left: 10px;
    display: inline-block;
    text-align: center;
    float: right;
    font-weight: 200;
}
.categoriest-list-section ul li.active a{
    color: #0F172A;
}
.categoriest-list-section ul li a{
    display: table;
    width: 100%;
    padding: 10px 15px 10px 10px;
    color: #475569;
    font-weight: 400;
    font-size: 14px;
}

.two-colls .addcustomer{
    max-width: inherit;
}
.two-colls{
    display: flex;
}
.categoriest-list-section ul li .flex{
    align-items: center;
}
.categoriest-list-section ul li{
    display: table;
    width: 100%;
    position: relative;
}

.categoriest-list-section ul li.active a span,
.categoriest-list-section ul li a:hover span{
    background: #0F172A;
    color: #fff;
}
.categoriest-list-section ul li a:hover{
    text-decoration: none;
    color: #0F172A;
}

.categoriest-list-section ul{
    list-style: none;
}
.categoriest-list-section{
    background: #fff;
    border-radius: 8px;
    padding: 10px;
}
.sms_choose{
    width: 100%;
    background: #fff;
    display: table;
    padding: 40px 60px;
    box-shadow: -1px 6px 5px -4px rgba(0,0,0,0.3);
}
.sms_choose .email_row {
    display: table;
    width: 100%;
    margin-bottom: 40px;
}
.sms_choose .email_row .numbers {
    float: left;
    width: 60px;
}
.sms_choose .email_row .numbers span {
    background: #fff;
    border-radius: 50px;
    width: 40px;
    position: relative;
    z-index: 99;
    height: 40px;
    text-align: center;
    padding-top: 7px;
    margin-top: 20px;
    border: 1px solid #ddd;
    font-size: 18px;
    color: #000;
    display: table;
}
.sms_choose .email_container {
    display: flex;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #dddddd;
    border-radius: 5px;
    padding: 20px;
    position: relative;
    width: calc(100% - 60px);
}
.sms_choose .email_container::before {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 15px 15px 15px 0;
    border-color: transparent #dddddd transparent transparent;
    position: absolute;
    left: -15px;
}
.sms_choose .email_container::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 14px 14px 0;
    border-color: transparent #fff transparent transparent;
    position: absolute;
    left: -14px;
    top: 21px;
}
.sms_choose .email_container label {
    float: left !important;
    width: auto !important;
    display: table !important;
    color: #000;
    font-size: 18px;
    padding-top: 5px;
    font-weight: 400;
}
.sms_choose .email_container select.form-control{
    border: 1px solid #ccc;
    margin: 20px 0 20px;
}
.sms_choose .dayselect select.form-control{
    float: left;
    width: auto;
    border: 1px solid #ccc;
    margin: 0px 10px;
    display: table;
}
.sms_choose .dayselect .nice-select.form-control {
    margin: 5px 20px 0 20px!important;
}
.sms_choose .nice-select.form-control {
    margin-top: 20px;
}
.sms_choose .dayselect {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    align-items: center;
    margin-top: 10px;
}
.sms_choose .removesequence {
    position: absolute;
    right: 10px;
    top:10px;
}
.sms_choose .add_sequence_item{
    width: 100%;
    display: table;
}
.add_sequence_item a.startnow {
    position: relative;
    top: -20px;
    background: #0F172A;
    font-size: 15px;
    text-transform: uppercase;
    font-weight: normal;
    padding: 9px 20px;
    border-radius: 5px;
    color: #fff;
    margin: auto;
    display: table;
}
.uploadAttachmentsButton{
    top:10px!important;
    margin-bottom: -25px!important;
    margin-right:115px!important;
}
.time_log_details_modal_content{
    font-size: 14px;
}
#content_layout > div:not(:first-child) .block .block-header{
    margin-top: 20px;
}
.breadcrumbs{
    margin-top: -5px;
}
#content_layout > div:not(:first-child) .block .block-header .additional_top_navigation,
#content_layout > div:not(:first-child) .block .block-header .breadcrumbs{
    display: none;
}
#admintablerow-ask_for_passwd > div:first-child,
#admintablerow-us_business_data_search_enabled > div:first-child,
#admintablerow-linkedin_data_search_enabled > div:first-child,
#admintablerow-google_search_enabled > div:first-child,
#admintablerow-builtwith_search_enabled > div:first-child,
#admintablerow-sic_search_enabled > div:first-child,
#admintablerow-state_search_enabled > div:first-child,
#admintablerow-us_business_data_search > div:first-child,
#admintablerow-linkedin_data_search > div:first-child,
#admintablerow-google_search > div:first-child,
#admintablerow-sic_code_search > div:first-child,
#admintablerow-state_search > div:first-child,
#admintablerow-builtwith_search > div:first-child,
#admintablerow-publish_page_1 > div:first-child,
#admintablerow-inappcalls_enabled > div:first-child,
#admintablerow-support_enabled > div:first-child,
#admintablerow-pm_enabled > div:first-child,
#admintablerow-initial_message > div:first-child,
#admintablerow-sms_stop_message > div:first-child,
#admintablerow-compliance_message > div:first-child,
#admintablerow-support_available > div:first-child,
#admintablerow-isclosed_p > div:first-child,
#admintablerow-has_review > div:first-child{
    order: 1;
    margin-left: 5px;
}
#admintablerow-ask_for_passwd,
#admintablerow-us_business_data_search_enabled,
#admintablerow-linkedin_data_search_enabled,
#admintablerow-google_search_enabled,
#admintablerow-builtwith_search_enabled,
#admintablerow-sic_search_enabled,
#admintablerow-state_search_enabled,
#admintablerow-us_business_data_search,
#admintablerow-linkedin_data_search,
#admintablerow-google_search,
#admintablerow-sic_code_search,
#admintablerow-state_search,
#admintablerow-builtwith_search,
#admintablerow-publish_page_1,
#admintablerow-inappcalls_enabled,
#admintablerow-support_enabled,
#admintablerow-pm_enabled,
#admintablerow-initial_message,
#admintablerow-sms_stop_message,
#admintablerow-compliance_message,
#admintablerow-support_available,
#admintablerow-isclosed_p,
#admintablerow-has_review{
    display: flex!important;
}
.clearfix{
    display: table;
    width: 100%;
}
.templates_section .additional-buttons-section .buttons .ab-button.active{
    color: #0F172A;
    font-weight: 600;
    background: #F1F5F9;
}
.templates_section.template_categories .adminbuttons{
    margin-top: 0;
}
.templates_section.template_categories .additional-buttons-section .pipeline-dropdown{
    display: none !important;
}
.templates_section.template_categories .additional-buttons-section .menu-open{
    width: auto;
}
.templates_section.template_categories .additional-buttons-section{
    align-items: baseline;
    padding: 0;
    background: transparent !important;
    border-radius: 0 !important;
    max-width: none;
    width: auto !important;
}
.templates_section.template_categories .adminbuttons .action-buttons{
    background: transparent !important;
    border-radius: 0 !important;
}
.templates_section #block0title{
    text-align: center!important;
    display: table;
    margin: auto;
}
.templates_section .additional-buttons-section .buttons{
    display: block !important;
}
.templates_section .additional-buttons-section .buttons .ab-button{
    border:0px;
    background: transparent;
    border-radius: 5px;
    font-weight: 400;
    color: #475569;
    font-size: 14px;
    margin-right: 0;
    margin-bottom: 10px;
}
.payments_content,
.campainsection{
    display: table;
    width: 100%;
}
.payments_content .row,
.subscription-payment-form .body_info .row{
    margin-bottom: 15px;
    display: table;
    width: 100%;
}
.head_info h4,
.subscription-payment-form .pyments-header h4{
    margin: 20px 0 10px;
}
.subscription-payment-form .body_info{
    display: table;
    width: 100%;
}
.status-stats .otherstats .wrapper > div > div span{
    display: table;
    width: 100%;
    font-weight: 600;
    color: #2d2d2e;
    font-size: 40px;
}
.status-stats .otherstats .wrapper > div > div{
    margin: auto;
    font-size: 30px;
    color: #525356;
}
.status-stats .otherstats .wrapper > div:first-child{

}
.status-stats .otherstats .wrapper > div{
    height: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    min-height: 190px;
}
.status-stats .otherstats .wrapper{
    display: flex;
    flex-direction: column;
}
.status-stats .otherstats .wrapper,
.status-stats .statsbox .wrapper{
    width: 100%;
    background: #fff;
}
.status-stats .progressbar .wrapper .title{
    color: #666666;
    font-size: 22px;
    max-width: 250px;
    margin: 0 auto 15px;
}
.status-stats .progressbar .wrapper{
    width: 100%;
    padding: 30px;
    text-align: center;
}
.status-stats .otherstats,
.status-stats .statsbox,
.status-stats .progressbar{
    display: flex;
}
.aui-message.aui-message-error{
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    font-weight: 400;
    ont-size: 0.875rem;
    line-height: 1.25rem;
    padding-top: 18px;
    padding-bottom: 18px;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    --tw-bg-opacity: 1;
    background-color: rgb(241 89 92 / var(--tw-bg-opacity));
    border-radius: 0.3 75rem;
}
.rd-status-sidebar{
    min-width: 250px!important;
}
#calendar{
    background: #fff;
    padding: 20px;
}
a.fc-event{
    font-weight: 500;
}
.buyer-persona-list .settings_tabs{
    width: auto;
    display: table;
    margin: auto;
    float: none;
}
#ai_modal .selectimage{
    margin-top: 10px!important;
}
#ai_modal .ai_modal_content{
    width: 100%;
}
#ai_modal .ai_modal_content .adminform_savebutton{
    margin-top: 20px;
}
#ai_modal .ai_modal_content .form-group label{
    font-size: 14px;
    font-weight: 400;
}
#ai_modal .ai_modal_content .form-group{
    display: table;
    width: 100%;
}
#openai_assistant_history_modal .modal-dialog{
    top:0px!important;
    right: 0!important;
    position: absolute;
}
#ai_modal .modal-dialog{
    top:50px!important;
}
.flex.ab-button{
    align-items: center;
}
.customer_details_page .rd-dash-conversation-answer .conversation-buttons-group{
    position: absolute;
    top: -2px;
    right: 2px;
}
.select_container{
    width: 100%;
}
#image-prompt{
    margin-bottom: 0!important;
}
.account-switcher-wrapper .nice-select{
    display: flex;
}
.account-switcher-wrapper{
    display: table;
    width: 100%;
    min-height: 37px;
}
#content_layout > #block0body:first-child > .block > .block-header > .content-wrapper > .blocktitlesection > h4{
    width: 100%;
    text-align: center;
    display: table;
}

#email-suggesstion-box,
#suggesstion-box {
    position: absolute;
    z-index: 999;
    width: 100%;
    flex: none;
    top:40px;
}

#country-list {
    list-style: none;
    padding: 0;
    box-shadow: rgba(58, 53, 65, 0.56) 0px 6px 18px -8px;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
    border-radius: 6px;
    background: #fff;
    margin-top: 5px;
}

#country-list li:last-child a {
    border-bottom: 0px solid;
}

.clear-organizations-filter {
    white-space: nowrap;
}

#country-list li.nothing-found {
    padding: 10px;
    color: #ccc;
}

#country-list li a:hover {
    background: rgba(58, 53, 65, 0.04);
}

#country-list li a {
    padding: 10px;
    display: table;
    width: 100%;
    border-bottom: #bbb9b9 1px solid;
}
.page-content{
    padding-top: 0;
}
.workflow-stepssection ul li.previous > div > span,
.powerdialer-stepssection ul li.previous > div > span{
    background: #50C793!important;
}
.product-payment-form .pyments-header h4,
.product-payment-form .head_info h4{
    margin-bottom: 20px;
    margin-top: 40px;
}
.product-payment-form .body_info .row{
    display: table;
    width: 100%;
}
.product-payment-form .body_info{
    display: table;
    width: 100%;
}
.view-switcher a.active svg{
    color: #fff;
}
.view-switcher a.active{
    background: #0F172A;
    color: #fff;
}
#ai_modal .modal-content, #tinymce_modal .modal-content, #view_video_modal .modal-content, #openai_assistant_history_modal .modal-content, #openai_assistant_modal .modal-content, #assign_customer_modal .modal-content{
    border-radius: 4px;
    min-width: 600px;
}
.popup_header h4{
    font-size: 16px;
    font-weight: 400;
}
.popup_header {
    margin-left: -40px;
    width: calc(100% + 80px);
    margin-top: -20px;
    border-bottom: 1px solid #F2F2F2;
    padding: 0 20px 20px;
    margin-bottom: 20px;
}
.message-attachments-section .flex .delete-image{
    margin-left: 5px;
}
.message-attachments-section .flex{
    align-items: center;
}
.send_custom_email_form.global_email_inbox .upload-attachments-form{
    margin-bottom: -25px!important;
    top:5px!important;
    margin-right: 85px!important;
}
.send_custom_email_form.global_email_inbox .adminform_savebutton{
    display: table;
    width: 100%;
    text-align: right;
}
.socialsharewrap.addcustomer .card-title{
    margin-top: 15px;
}
.socialsharewrap.addcustomer > h4{
    margin-bottom: 10px;
}
.trigger_page .arrow{
    top: 32px;
}
.trigger_page #title_input{
    margin-top:0;
    align-items: center;
}
.trigger_page #title_info span{
    color: #64748B;
    font-weight: 400;
    font-size: 16px;
}
.trigger_page .trigger_section_wrapper{
    display: table;
    margin: auto;
}
.saveTriggerButton{
    margin-top: 40px!important;
}
.savetriggertagbutton,
.saveTriggerButton,
.savestatusandstagebutton{
    color: #fff;
    padding: 7px 15px!important;
    font-size: 12px!important;
}
.workflow_page .savetriggertagbutton,
.trigger_page .savetriggertagbutton,
.workflow_page .saveTriggerButton,
.trigger_page .saveTriggerButton,
.workflow_page .savestatusandstagebutton,
.trigger_page .savestatusandstagebutton,
.workflow_page .addFilter a,
.trigger_page .addFilter a{
    background: #0F172A!important;
    border-radius: 4px!important;
    padding: 10px 20px!important;
}
.workflow_page .nice-select.form-control,
.trigger_page .nice-select.form-control{
    background: #FBFBFB;
    border-color: #F2F2F2;
    max-width: 600px;
}
.trigger_page .send_message_label{
    background: #FEC163!important;
}
.workflow_page .addFilter,
.trigger_page .addFilter{
    max-width: 100%;
}
.trigger_page .arrow::before{
    height: 62px!important;
    top: -67px!important;
}
.trigger_page .step_wrapper{
    margin: 30px auto!important;
}
.trigger_page .step_wrapper .step_label.delay_label {
    background: #FA916B!important;
}
.trigger_page .step_wrapper .step_label.filter_label {
    background:#4669FA!important;
}

.trigger_page .step_wrapper .step_label{
    background-color: #0F172A;
    color: #fff;
    padding: 7px 15px;
    display: table;
    width: auto;
    border-radius: 4px 4px 0 0;
    font-size: 12px;
    margin: 0;
    text-align: center;
    box-sizing: border-box;
}
#trigger_conditions{
    max-width: 600px;
}
.workflow_page .send_message_label{
    margin-bottom: 6px;
}

.workflow_page #actions_list .wrapper{
    max-width: 600px;
}
.workflow_page .results_wrapper p{
    font-weight: 300;
    font-size: 14px;
}
.workflow_page #templates_dropdown{
    padding-top: 10px;
    display: table;
    width: 100%;
}

.workflow_page #actions_list.step_wrapper > div:first-child .step_wrapper{
    border-top: 0;
}
.workflow_page .step_wrapper .template_dropdown{
    display: table;
    width: 100%;
}
.workflow_page .step_wrapper .dayselect{
    margin-top: 10px;
}
.workflow_page .trigger_status_stage{
    display: table;
    width: 100%;
}
.workflow_page .wizard-step-wrapper #title{
    max-width: 600px;
}
.workflow_page .step_wrapper .step_title{
    margin-bottom: 5px;
    padding-top: 10px;
    display: table;
    width: 100%;
    font-size: 14px;
}
.workflow_page .results_wrapper > p:first-child,
.workflow_page .nice-select .current{
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 100%;

    white-space: nowrap;
}
.workflow_page .results_wrapper > p:first-child{
    max-width: 600px;
}
.templates_section .embed_grid .socialsharewrap .full-width-form .w49,
.settings_page_apis .embed_grid .socialsharewrap .full-width-form .w49{
    width: 49%;
}
.templates_section .embed_grid .socialsharewrap .full-width-form,
.settings_page_apis .embed_grid .socialsharewrap .full-width-form{
    width: 100%;
    max-width: 100%;
}
.templates_section .embed_grid .socialsharewrap,
.settings_page_apis .embed_grid .socialsharewrap{
    margin: 0;
    width: 100%;
}
.profile-section .info-item.dropdown-info-item #organization_content,
.profile-section .info-item.dropdown-info-item #tickets_content,
.profile-section .info-item.dropdown-info-item #purchases_content,
.profile-section .info-item.dropdown-info-item #tags_content,
.profile-section .info-item.dropdown-info-item #videos_content{
    padding: 0;
}
.profile-section .info-item.dropdown-info-item .dropdown_content{
    width: 100%;
    margin-top: 15px;
}
.profile-section .info-item.dropdown-info-item .clients_list{
    padding: 15px 0 0 0!important;
}
#organization_content .user-icon i{
    font-size: 14px;
}
.profile-section .info-item.dropdown-info-item .value{
    font-size: 14px;
}
.profile-section .info-item.dropdown-info-item .section_title{
    font-size: 14px;
    font-weight: 500;
}
.profile-section .info-item.dropdown-info-item .info_section{
    padding: 0!important;
}
.profile-section .info-item.dropdown-info-item .company-title{
    display: none;
}
.profile-section .info-item.dropdown-info-item{
    height: auto;
    flex-wrap: wrap;
}
.label-default{
    background: #f0f0f0;
}
.label-danger {
    background-color: rgb(241 89 92 / 1);
    color: #fff;
}
.label-warning {
    background-color: #f0ad4e;
    color: #fff;
}
.profile-section .info-item.dropdown-info-item #tickets_content .leadcontainer > div{
    font-size: 14px;
}
.icon-wrapper svg{
    display: table;
    margin: auto;
}
.icon-wrapper{
    display: flex;
    align-items: center;
    height: 40px;
    width: 40px;
    border-radius: 6px;
}
.icon-wrapper.green{
    background: #E4FFE0;
    color: #267A18;
}
.icon-wrapper.purple{
    background: #E0E7FF;
    color: #4F46E5;
}
.customer_details_page .profile-active .adminform_form,
.full-width-form{
    min-width: 100%;
}
.user_video_list .video-list-wrapper .col-md-6 {
    width: 47%;
}
.rd-dash-sidebar.hidden{
    display: none;
}
.message-attachments-section{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: 20px;
}
.message-attachments-section > div {
    position: relative;
    margin-right: 10px;
}
.message-attachments-section a {
    margin-right: 5px;
}
.message-attachments-section a img {
    max-width: 100%;
    max-height: 100%;
}
.message-attachments-section > div:hover .delete-image{
    display: block;
}
.user_status.online{
    color: green;
    border-color: green;
}
.user_status{
    font-size: 12px;
    border: 1px solid #ccc;
    color: #ccc;
    border-radius: 4px;
    padding: 3px 10px;
}
.add_customer_messagemodal_content .adminform_form{
    max-width: 100%;
}
.add_customer_messagemodal_content .rd-dash-conversation-view .nothing_found{
    text-align: center;
}
.add_customer_messagemodal_content .rd-dash-conversation-view{
    min-height: inherit;
}
.sidebar-menu .sidebar-submenu > li.active > a, .sidebar-menu .sidebar-submenu > li > a:hover{
    color: inherit;
}
.rollTop{
    bottom: 100%;
    top: unset;
}
.dropdown-menu{
    border-color: #E5E7EB;
}
.contacts_list_details .progress-wrap.progress .progress-bar,
.wizard_page .progress-wrap.progress .progress-bar{
    top:0;
    background: #fff;
}
.contacts_list_details .progress-wrap.progress,
.wizard_page .progress-wrap.progress{
    background: #4669FA;
    height: 3px;
}
.import-progress-wrapper{
    max-width: 400px;
    margin: auto;
}
.add-all-button,
.bulkactions{
    margin: 10px;
}
.showmoreleads .add_asset_button{
    margin: 0 auto 10px;
    display: table;
    width: 100%;
}
.pagination-wrapper .list-none > li > a{
    min-width: 1.5rem;
    width: auto;
}
.navItem.active .icon-arrow{
    color: #fff;
}
.unreadmessages > span{
    margin: auto;
    color: #fff;
}
.unreadmessages{
    position: absolute;
    right: -5px;
    top: -5px;
    display: flex;
    font-size: 11px;
    background: red;
    width: 20px;
    height: 20px;
    align-items: center;
    text-align: center;
    border-radius: 100px;
}
#modal-container #modal-content .send_custom_email_form{
    max-width: 100%;
}
#modal-container #modal-content .send_custom_email_form.global_email_inbox .upload-attachments-form{
    top: 16px !important;
    margin-right: 110px!important;
}
.tinymce_modal_content .nice-select{
    margin-bottom: 10px;
}
.hidesubmitbutton .adminform_savebutton{
    display: none;
}
.pl-1{
    padding-left: 10px;
}
.logo-segment a img{
    max-height: 90px;
}
.logo-segment{
    max-height: 100px;
    overflow: hidden;
}
.sidebar-menus{
    height: calc(100% - 100px);
}

/* ============================================
   Global TGrid table styling — consistent headers
   ============================================ */
.admintable th,
.embed_grid th,
#content_layout table th {
    padding: 10px 16px;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #64748B;
    background: #F9FAFB;
    border-bottom: 1px solid #E5E7EB;
}
.admintable td,
.embed_grid td,
#content_layout table td {
    padding: 12px 16px;
    vertical-align: middle;
}
.admintable tr,
.embed_grid tr,
#content_layout table tr {
    border-bottom: 1px solid #F1F5F9;
}

/* ============================================
   Settings pages — sidebar to horizontal tabs
   ============================================ */

/* Global settings: convert sidebar layout to vertical stack */
.wizard_page .flex.flex-start {
    flex-direction: column !important;
    align-items: stretch !important;
}
.global-settings-sidebar {
    display: none !important;
}
.global-settings-body.col-md-9 {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
}

/* ============================================
   Business settings: vertical sidebar + content
   DashCode-style vertical nav tabs
   ============================================ */

/* Grid layout: sidebar (col 1) + content (col 2)
 *
 * Column 2 uses minmax(0, 960px) instead of plain 1fr so every
 * settings page gets the SAME content width regardless of what's
 * inside it. With plain 1fr, CSS grid grows the track based on
 * each page's min-content size — pages with long unbroken
 * strings (SendGrid/MailJet descriptions, DNC phone numbers,
 * voicemail URLs) stretched the column wider while pages with
 * short content (pipeline, departments, favicon) shrank it.
 * That's what produced the "same max-width:960px wrapper but
 * different rendered width" mismatch we spent hours chasing.
 *
 * minmax(0, 960px) = never larger than 960px AND ignore intrinsic
 * min-content when computing the lower bound. Result: column 2 is
 * exactly 960px on every page (or narrower on small viewports).
 *
 * max-width + margin:0 auto centers the whole grid assembly
 * (tab nav + content column as one unit) inside .content-wrapper
 * so wide monitors don't leave ~540px of dead space on the right.
 * 1134px = 150 (tab nav) + 24 (gap) + 960 (content).
 */
body.template_categories .block-content-outer {
    display: grid !important;
    grid-template-columns: 150px minmax(0, 960px);
    gap: 0 24px;
    align-items: start;
    max-width: 1134px;
    margin: 0 auto;
}

/* Belt-and-suspenders #1: clamp direct grid-column-2 children to
 * min-width 0 so they can never push the track wider than the
 * minmax max. Without this, a sufficiently long unbroken string
 * inside a card can still force the track to overflow. */
body.template_categories .block-content-outer > *:not(.additional-buttons-section) {
    min-width: 0 !important;
}

/* Belt-and-suspenders #2: force every direct-child div of the
 * content column to width:100%. Without this, a plain block div
 * with max-width:960px;margin:0 auto shrinks to fit-content
 * whenever its inner content doesn't have an intrinsic full
 * width — then margin:0 auto centers that narrow box, producing
 * the "small centered card" look on Pipeline / Payments / Video
 * / Support / Logo / Favicon. Forcing width:100% here means the
 * wrapper always fills the grid column (up to max-width:960px)
 * regardless of what's inside it. */
body.template_categories .block-content-outer > div {
    width: 100%;
}

/* Sidebar wrapper — lives in column 1, spans all rows */
body.template_categories .additional-buttons-section,
body.template_categories .additional-buttons-section.extended-buttons {
    grid-column: 1 !important;
    grid-row: 1 / 50 !important;
    position: sticky;
    top: 80px;
    display: block !important;
    width: auto !important;
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    padding: 0 !important;
    max-width: none !important;
    border-radius: 0 !important;
}

/* Hide empty pipeline-dropdown spacer */
body.template_categories .pipeline-dropdown {
    display: none !important;
}

/* Let inner .buttons wrapper be block */
body.template_categories .buttons.flex {
    display: block !important;
    width: 100% !important;
}

/* All content goes to column 2 */
body.template_categories .block-content-outer > *:not(.additional-buttons-section) {
    grid-column: 2 !important;
}

/* ---- Vertical tab buttons ---- */
.bs-vtabs {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 8px 0;
}
.bs-vtab {
    display: block;
    padding: 8px 12px;
    font-size: 13px;
    font-weight: 500;
    color: #475569;
    text-decoration: none;
    border-radius: 6px;
    background: transparent;
    text-align: left;
    transition: background 0.15s ease, color 0.15s ease;
}
.bs-vtab:hover {
    background: #E2E8F0;
    color: #0F172A;
}
.bs-vtab.active {
    background: #0F172A;
    color: #fff;
}

/* ---- Content area adjustments ---- */
.template_categories .embed_grid {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}
.template_categories .socialsharewrap {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
}
/* block-content-outer grid is set above — no display:block override here */
.template_categories .adminbuttons {
    background: transparent !important;
    border-radius: 0 !important;
    max-width: none !important;
}
.template_categories .embed_grid .adminform_form,
.template_categories .embed_grid .adminform_table {
    max-width: 100% !important;
}
.template_categories .card.w-full {
    max-width: none !important;
    margin: 0 !important;
}

/* Kill the menu-open white box */
.template_categories .extended-buttons.menu-open {
    max-width: none !important;
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
}

/* Support settings: kill Bootstrap columns, force single column */
.settings_section {
    display: block !important;
    width: 100% !important;
}
.settings_section > div,
.settings_section .col-md-8,
.settings_section .col-md-9,
.settings_section .col-md-10 {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    float: none !important;
    padding: 0 !important;
}
.settings_section .col-md-2,
.settings_section .col-md-3,
.settings_section .col-md-4 {
    display: none !important;
}

/* ============================================
   FORM STANDARDS — utility classes for templates
   ============================================ */

.crm-form {
    max-width: 560px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 24px;
}
.crm-form-wide {
    max-width: 720px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    padding: 24px;
}
.crm-field {
    margin-bottom: 16px;
}
.crm-field:last-child {
    margin-bottom: 0;
}
.crm-field-row {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}
.crm-field-row .crm-field {
    flex: 1;
    margin-bottom: 0;
}
.crm-label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 6px;
}
.crm-label .required {
    color: #EF4444;
    margin-left: 2px;
}
.crm-input,
.crm-select,
.crm-textarea {
    width: 100%;
    padding: 8px 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-size: 14px;
    color: #111827;
    background: #fff;
    outline: none;
    transition: border-color 0.15s;
    box-sizing: border-box;
}
.crm-input,
.crm-select {
    height: 40px;
}
.crm-textarea {
    min-height: 96px;
    resize: vertical;
}
.crm-input:focus,
.crm-select:focus,
.crm-textarea:focus {
    border-color: #6B7280;
}
.crm-input::placeholder,
.crm-textarea::placeholder {
    color: #9CA3AF;
}
.crm-form-actions {
    margin-top: 24px;
    padding-top: 16px;
    border-top: 1px solid #F1F5F9;
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}
.crm-field-error {
    font-size: 12px;
    color: #EF4444;
    margin-top: 4px;
}
.crm-field-help {
    font-size: 12px;
    color: #9CA3AF;
    margin-top: 4px;
}

/* ============================================
   Wizard pages — constrain width and center
   ============================================ */

/* Outer wrapper: max-width + center */
.campaign-wizard,
.powerdialer-wizard,
.workflow-wizard {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}

/* Step panel: fixed 200px instead of col-md-3 (25%) */
.campaign-stepssection,
.powerdialer-stepssection,
.workflow-stepssection {
    width: 200px;
    min-width: 200px;
    max-width: 200px;
    flex-shrink: 0;
}

/* Step circles: compact 28px */
.campaign-stepssection ul li > div > span,
.powerdialer-stepssection ul li > div > span,
.workflow-stepssection ul li > div > span {
    width: 28px;
    height: 28px;
    font-size: 12px;
}

/* Step connector line: adjust for smaller circles */
.campaign-stepssection ul li:after,
.powerdialer-stepssection ul li:after,
.workflow-stepssection ul li:after {
    left: 14px;
    height: 20px;
    margin: 6px 0;
}

/* Step label text */
.campaign-stepssection ul li > div,
.powerdialer-stepssection ul li > div,
.workflow-stepssection ul li > div {
    font-size: 13px;
    font-weight: 500;
    color: #374151;
}
.campaign-stepssection ul li.active > div,
.powerdialer-stepssection ul li.active > div,
.workflow-stepssection ul li.active > div {
    color: #0F172A;
}

/* Pending step label */
.campaign-stepssection ul li > div,
.powerdialer-stepssection ul li > div,
.workflow-stepssection ul li > div {
    color: #9CA3AF;
}
.campaign-stepssection ul li.active > div,
.campaign-stepssection ul li.previous > div,
.powerdialer-stepssection ul li.active > div,
.powerdialer-stepssection ul li.previous > div,
.workflow-stepssection ul li.active > div,
.workflow-stepssection ul li.previous > div {
    color: #374151;
}

/* Form content: wizard inputs fill their container */
.wizard-step-wrapper input[type="text"],
.wizard-step-wrapper input[type="email"],
.wizard-step-wrapper input[type="password"],
.wizard-step-wrapper input[type="number"],
.wizard-step-wrapper select,
.wizard-step-wrapper textarea,
.wizard-step-wrapper .form-control {
    max-width: none;
}

/* ============================================
   Rail Navigation — white/light-gray theme
   ============================================ */
.rail-nav {
    width: 64px;
    height: 100vh;
    max-height: 100vh;
    background: #ffffff;
    border-right: 1px solid #E5E7EB;
    transition: width 0.2s ease;
    overflow: hidden;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 40;
    display: flex;
    flex-direction: column;
}
.rail-nav:hover {
    width: 220px;
}

/* Company area at top */
.rail-company {
    padding: 16px 20px;
    border-bottom: 1px solid #E5E7EB;
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 60px;
}
.rail-company img {
    width: 28px;
    height: 28px;
    object-fit: contain;
    flex-shrink: 0;
    border-radius: 6px;
}
.rail-company .nav-label {
    font-size: 13px;
    font-weight: 600;
    color: #111827;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.15s;
}
.rail-nav:hover .rail-company .nav-label {
    opacity: 1;
}

/* Scrollable nav area */
.rail-scroll {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
}
.rail-scroll::-webkit-scrollbar {
    width: 4px;
}
.rail-scroll::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,0.1);
    border-radius: 2px;
}

/* Nav items */
.rail-nav .nav-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 22px;
    color: #6B7280;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    min-height: 48px;
    transition: color 0.15s, background 0.15s;
    cursor: pointer;
    border-left: 2px solid transparent;
}
.rail-nav .nav-item:hover {
    color: #111827;
    background: #F3F4F6;
}
.rail-nav .nav-item.active {
    color: #111827;
    background: #F9FAFB;
    border-left: 2px solid #0F172A;
}

/* Icons — normalize all SVGs to 20px */
.rail-nav .nav-item svg.nav-icon,
.rail-nav .nav-item .nav-icon {
    width: 22px;
    height: 22px;
    min-width: 22px;
    flex-shrink: 0;
}
/* Hide img-based icons if any */
.rail-nav .nav-item .main-menu-icon img {
    width: 20px;
    height: 20px;
}

/* Text labels — hide collapsed, show on hover */
.rail-nav .nav-item > span {
    opacity: 0;
    transition: opacity 0.15s;
    font-size: 14px;
    font-weight: 500;
}
.rail-nav:hover .nav-item > span {
    opacity: 1;
}

/* Override the existing nav-icon inline sizes from nav.php */
.rail-nav svg.nav-icon {
    width: 22px !important;
    height: 22px !important;
}

/* Sub-menu groups */
.rail-nav .nav-group {
    position: relative;
}
.rail-nav .nav-subitems {
    display: none;
    background: #F9FAFB;
}
.rail-nav:hover .nav-group:hover > .nav-subitems,
.rail-nav:hover .nav-group.open > .nav-subitems {
    display: block;
}
.rail-nav .nav-subitem {
    padding: 7px 22px 7px 54px;
    min-height: 32px;
    font-size: 12px;
}
.rail-nav .nav-subitem .nav-label {
    opacity: 1;
    font-size: 12px;
    font-weight: 400;
}

/* Unread badge (from Inbox) */
.rail-nav .unreadmessages {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #EF4444;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    border-radius: 50px;
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    margin-left: 6px;
}

/* Chevron on dropdown items */
.rail-nav .nav-chevron {
    width: 12px;
    height: 12px;
    margin-left: auto;
    opacity: 0;
    transition: opacity 0.15s;
}
.rail-nav:hover .nav-chevron {
    opacity: 1;
}

/* Divider between nav sections */
.rail-nav .rail-divider {
    height: 1px;
    background: #E5E7EB;
    margin: 8px 16px;
}

/* ============================================
   Rail Footer — pinned bottom region for
   Notifications / Business Settings / Platform / Profile
   ============================================ */
.rail-footer {
    flex-shrink: 0;
    border-top: 1px solid #E5E7EB;
    padding: 8px 0;
    background: #ffffff;
}
.rail-action,
.rail-profile {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 22px;
    color: #6B7280;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    min-height: 48px;
    transition: color 0.15s, background 0.15s;
    cursor: pointer;
    border-left: 2px solid transparent;
    position: relative;
    background: transparent;
    border-top: none;
    border-right: none;
    border-bottom: none;
    width: 100%;
    font: inherit;
    text-align: left;
}
.rail-action:hover,
.rail-profile:hover {
    color: #111827;
    background: #F3F4F6;
}
.rail-action svg,
.rail-profile svg {
    width: 22px;
    height: 22px;
    min-width: 22px;
    flex-shrink: 0;
}
.rail-profile .rail-avatar,
.rail-profile .rail-avatar img {
    width: 26px;
    height: 26px;
    min-width: 26px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}
.rail-profile .rail-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #F1F5F9;
    color: #475569;
}
.rail-action > .rail-label,
.rail-profile > .rail-label {
    opacity: 0;
    transition: opacity 0.15s;
    font-size: 14px;
    font-weight: 500;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
}
.rail-nav:hover .rail-action > .rail-label,
.rail-nav:hover .rail-profile > .rail-label {
    opacity: 1;
}

/* Badge pill on rail-action (notifications count) */
.rail-action .rail-badge {
    position: absolute;
    top: 6px;
    left: 32px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 10px;
    font-weight: 600;
    background: #EF4444;
    color: #fff;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}
.rail-nav:hover .rail-action .rail-badge {
    position: static;
    margin-left: auto;
}

/* Rail popovers — escape the rail's overflow:hidden via position:fixed.
   Anchored relative to the rail-nav's fixed-left position. JS (rail-popover.js)
   toggles .open on a sibling .rail-popover element. */
.rail-popover {
    position: fixed;
    left: 72px;
    bottom: 16px;
    display: none;
    z-index: 1000;
    background: #ffffff;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05);
    min-width: 240px;
    max-width: 360px;
    overflow: hidden;
}
.rail-popover.open {
    display: block;
}
/* Top-anchored variant — used for the Info popover in the rail header */
.rail-popover.rail-popover-top {
    top: 72px;
    bottom: auto;
}
/* Top-nav variant — bell popover anchored below the top-nav bell button */
.rail-popover.rail-popover-topnav {
    top: 52px;
    right: 16px;
    left: auto;
    bottom: auto;
    min-width: 320px;
    max-width: 420px;
    max-height: calc(100vh - 80px);
    overflow: hidden;
}

/* Top-nav bell button — mirrors the standalone icon buttons we had before */
.topnav-bell {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: #0F172A;
    cursor: pointer;
    border-radius: 8px;
    flex-shrink: 0;
    transition: background 0.15s;
}
.topnav-bell:hover {
    background: #F3F4F6;
}
.topnav-bell .topnav-bell-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 10px;
    font-weight: 600;
    background: #EF4444;
    color: #fff;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}

/* Iter4 — Quick-tool icons in top nav (Inbox / Calendar / Reports / Support).
   Grouped with a small divider before the bell. Hidden below lg. */
.topnav-quick {
    display: inline-flex;
    align-items: center;
    gap: 2px;
}
.topnav-icon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    color: #0F172A;
    text-decoration: none;
    border-radius: 8px;
    flex-shrink: 0;
    transition: background 0.15s, color 0.15s;
}
.topnav-icon:hover {
    background: #F3F4F6;
    color: #0F172A;
}
.topnav-icon .topnav-badge {
    position: absolute;
    top: 4px;
    right: 4px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    font-size: 10px;
    font-weight: 600;
    background: #EF4444;
    color: #fff;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    pointer-events: none;
}
.topnav-badge.topnav-badge-blue { background: #3B82F6; }
.topnav-badge.topnav-badge-amber { background: #F59E0B; }

.topnav-quick-divider {
    width: 1px;
    height: 24px;
    background: #E5E7EB;
    margin: 0 8px;
}

/* Iter5 #4 — Top-nav profile button. Uses rail-popover.js toggle; popover reuses
   .rail-popover-topnav positioning so it opens below the avatar. */
.topnav-profile {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    color: #0F172A;
    cursor: pointer;
    border-radius: 50%;
    flex-shrink: 0;
    transition: background 0.15s;
    overflow: hidden;
}
.topnav-profile:hover {
    background: #F3F4F6;
}
.topnav-profile-avatar {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
}

/* Make PLATFORM chip clickable in Platform Mode (exit affordance) */
a.rail-platform-chip {
    text-decoration: none;
    cursor: pointer;
}
a.rail-platform-chip:hover {
    background: #4F46E5;
    color: #FFFFFF;
}

/* Info (ⓘ) button inside rail-company — compact, visible in collapsed state */
.rail-info-btn {
    margin-left: auto;
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    color: #6B7280;
    cursor: pointer;
    border-radius: 4px;
    flex-shrink: 0;
    opacity: 0;
    transition: opacity 0.15s, color 0.15s, background 0.15s;
}
.rail-nav:hover .rail-info-btn {
    opacity: 1;
}
.rail-info-btn:hover {
    color: #111827;
    background: #F3F4F6;
}
/* Anchor the Bootstrap-managed profile dropdown inside the rail-footer
   so it opens up+right from the rail (until Phase 2 swaps it to .rail-popover).
   Bootstrap's data-bs-toggle renders .dropdown-menu with inline top/left styles
   via Popper — overriding with !important forces our desired placement. */
.rail-footer .dropdown-menu {
    position: fixed !important;
    left: 72px !important;
    top: auto !important;
    bottom: 16px !important;
    transform: none !important;
    margin: 0 !important;
    min-width: 240px;
}

/* Hide old sidebar when rail is active */
.has-rail-nav .sidebar-wrapper {
    display: none !important;
}

/* ============================================
   Phase 4 — Platform Management mode accent
   Applied via body.platform-mode when super admin enters /platform/*.
   Indigo rail + PLATFORM chip make it unmistakable that you're outside a tenant.
   ============================================ */
body.platform-mode .rail-nav {
    background: #1E1B4B;
    border-right: 1px solid #312E81;
}
body.platform-mode .rail-nav .rail-company {
    border-bottom: 1px solid #312E81;
}
body.platform-mode .rail-nav .rail-company .nav-label,
body.platform-mode .rail-nav .nav-item > span,
body.platform-mode .rail-nav .rail-action > .rail-label,
body.platform-mode .rail-nav .rail-profile > .rail-label {
    color: #E0E7FF;
}
body.platform-mode .rail-nav .nav-item {
    color: #C7D2FE;
}
body.platform-mode .rail-nav .nav-item:hover,
body.platform-mode .rail-nav .rail-action:hover,
body.platform-mode .rail-nav .rail-profile:hover {
    color: #FFFFFF;
    background: #312E81;
}
body.platform-mode .rail-nav .nav-item.active {
    color: #FFFFFF;
    background: #312E81;
    border-left: 2px solid #A5B4FC;
}
body.platform-mode .rail-nav .rail-action,
body.platform-mode .rail-nav .rail-profile {
    color: #C7D2FE;
}
body.platform-mode .rail-nav .rail-footer {
    background: #1E1B4B;
    border-top: 1px solid #312E81;
}
body.platform-mode .rail-nav .rail-divider {
    background: #312E81;
}
body.platform-mode .rail-nav .rail-info-btn {
    color: #C7D2FE;
}
body.platform-mode .rail-nav .rail-info-btn:hover {
    color: #FFFFFF;
    background: #312E81;
}

/* PLATFORM chip — sits above the logo in the rail header during Platform Mode */
.rail-platform-chip {
    display: none;
    margin-bottom: 10px;
    padding: 3px 8px;
    background: #6366F1;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    border-radius: 4px;
    text-transform: uppercase;
    align-self: flex-start;
    white-space: nowrap;
}
body.platform-mode .rail-platform-chip {
    display: inline-block;
}
/* Give the rail-company extra vertical space for the chip above the logo row */
body.platform-mode .rail-company {
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
    min-height: 80px;
    padding-top: 12px;
}
body.platform-mode .rail-company > a,
body.platform-mode .rail-company > .nav-label {
    display: inline-flex;
    align-items: center;
}

/* Super admin indicator — CRM mode only. Shown in rail-company header so
   the SA always knows they have elevated privileges and can jump to
   Platform Mode from anywhere. */
.rail-sa-chip {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    padding: 2px 6px;
    background: #EEF2FF;
    color: #4338CA;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.03em;
    border-radius: 4px;
    text-decoration: none;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.15s, background 0.15s;
    align-self: flex-start;
}
.rail-sa-chip:hover {
    background: #E0E7FF;
    color: #3730A3;
}
.rail-nav:hover .rail-sa-chip {
    opacity: 1;
}
/* Give rail-company vertical stacking when the SA chip is present */
.rail-company.has-sa-chip {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    min-height: 74px;
    padding-top: 12px;
}
.rail-company.has-sa-chip > a,
.rail-company.has-sa-chip > .nav-label {
    display: inline-flex;
    align-items: center;
}
.rail-company.has-sa-chip .rail-company-row {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}

/* ============================================
   Phase 6 — Slim the top bar
   Header now contains only: hamburger (mobile) + breadcrumb + search.
   Reduce vertical padding from 1.5rem to 0.5rem (was ~64px tall, now ~48px).
   ============================================ */
.app-header {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
}
@media (min-width: 768px) {
    .app-header {
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
        padding-left: 1.5rem !important;
        padding-right: 1.5rem !important;
    }
}

/* Rail nav content offset — override DashCode 248px/72px sidebar margins to 64px */
.app-header,
#content_wrapper,
.site-footer {
    margin-left: 64px !important;
}
.collapsed .content-wrapper,
.collapsed .app-header,
.collapsed .site-footer {
    margin-left: 64px !important;
}

/* Condensed logo swap: show icon when collapsed, full logo when extended */
.collapsed .rail-logo-full { display: none !important; }
.collapsed .rail-logo-icon { display: block !important; margin: 0 auto; }

/* Mobile: hide rail, reset margins */
@media (max-width: 1023px) {
    .rail-nav {
        display: none;
    }
    .app-header,
    #content_wrapper,
    .content-wrapper,
    .site-footer {
        margin-left: 0 !important;
    }
}