/**
 * Main Admin CSS File
 *
 * This file has been refactored. Many styles have been moved to dedicated files:
 *
 * - base.css: Tooltips, info icons, base utilities (always loaded)
 * - notices.css: Admin notices (always loaded)
 * - dashboard.css: All Popups list page (loaded on instant-popup-builder page)
 * - add-new-popup.css: Add New Popup page (loaded on add-new-instant-popup page)
 * - license.css: License page styles (already extracted)
 *
 * See REFACTORING_PLAN.md for complete file structure.
 *
 * This file now contains remaining styles that haven't been extracted yet.
 * Future refactoring will continue to move styles to appropriate files.
 */

/* ============================================
   Base styles moved to admin/css/base.css
   ============================================ */

/* Base loader, typography, and layout utilities moved to admin/css/base.css */
/* Add New Popup page styles moved to admin/css/add-new-popup.css */

.instant_popup_filter {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 10px 0px 0 0;
}

.rules {
    display: flex;
    gap: 40px;
    align-items: center;
}

.rules
 .selection {
    position: relative;
    width: 30%;
}
.rules i {
    color: #1A73E8;
    cursor: pointer;
    font-size: 20px;
}

/* Note: .rules .info and .rules .info img rules are defined in unified CSS section above */

/* Note: Tooltip styling (.info .detail) is handled by unified CSS at top of file */
/* This conflicting rule has been removed to ensure consistent tooltip appearance */

.popup_status ul {
    align-items: center;
    margin: 0;
    display: flex;
    gap: 20px;
}

.popup_status {
    flex: 0 0 80%;
}

.instant_filter {
    flex: 0 0 20%;
}

span.req {
    color: red !important;
}

.popup_status li a.active{

    color: black;
    font-weight: bold;
    text-decoration: none;
}
.search_wrapper form {
    align-items: center;
    display: flex;
    gap: 10px;
    overflow: hidden;
}
input#key_search {
    border: 1px solid #E0E0E0;
    background: white;
    color: black !important;
}
input#search_popup {
    border: 1px solid #E0E0E0 !important;
}

.popup_lists table {
    background: white;
    width: 98%;
    margin: 20px 0;
}
input#popup_title {
    border: 1px solid #E0E0E0 !important;
    text-transform: capitalize;
    padding: 10px;
    width:100%;
    margin: 0 0 10px 0;
    border: none;
    border-radius: 0px;
    font-size: 18px;
    padding: 4px 15px;
}

.input_field.disabled {
    pointer-events: none;
}

.input_field {
    height: 100px;
}

.ex_del{

    display: none;
}
div#video_disabeld label {
    background: lightblue !important;
    position: absolute;
    top: -13px;
}

#video_module
 input[type="radio"]+label {
    background: lightblue !important;
}
.popup_lists th,
.popup_lists td {
    text-align: left;
    border: none !important;
    border-width: 0px 1px 1px 0px !important;
    border-bottom: 1px solid #E0E0E0 !important;
    border: 1px solid lightgray;
    padding: 15px;
    font-size: 16px;
}

a#popup_btn {
    box-sizing: border-box;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: none;
    margin: 20px 0 !important;
    border: 1px solid #2271b1;
    border-radius: 3px;
    background: #f6f7f7;
    font-size: 16px;
    font-weight: 400;
    line-height: 2.15384615;
    color: #2271b1;
    padding: 5px 10px;
    min-height: 30px;
    -webkit-appearance: none;
}

.instant_popup_wrapper .pagination,.ipb_subscriptiobn_wrapper .pagination{
    justify-content: end;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px 20px 20px 20px;
}

.instant_popup_wrapper .pagination a.page-numbers,.ipb_subscriptiobn_wrapper .pagination a.page-numbers{
    text-decoration: none;
    font-size: 14px;
    border-radius: 5px;
    background: #1A73E8;
    padding: 4px 14px;
    color: white;
    line-height: 26px;
}

.instant_popup_wrapper span.page-numbers.current,.ipb_subscriptiobn_wrapper .pagination span.page-numbers {
    color: white;
    padding: 4px 14px;
    background: black;
    border-radius: 5px;
    font-size: 14px;
    line-height: 26px;
}

.instant_popup_wrapper .pagination a.page-numbers:hover,.ipb_subscriptiobn_wrapper .pagination a.page-numbers:hover  {
    background: transparent;
    color: #1A73E8;
    border: 1px solid #1A73E8;
}

/*
.ipb_top_bar ul.list li:nth-child(2) {
    display: none !important;
}
     */
.display_inner h1 {
    font-size: 24px;
    line-height: 30px;
    margin: 0;
}

.add_new_popup {
    padding: 20px 0;
}

.trigger_dispaly {
    background: white !important;
    padding: 12px !important;
    margin: 6px 0 !important;
}
.sens_options {
    padding: 10px;
    background: white;
    margin: 8px 0;
}

.trigger_dispaly label {
    color: black;
}

.display_option {

    padding: 20px 0;
    color: black;
    position: absolute;
    left: 0;
    top: 28%;
}

.trigger_dispaly .d_opt label {align-items: center;display: flex;flex-direction: row;gap: 5px;}

.trigger_dispaly .d_opt {
    gap: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* radio input block intentionally removed */

input#popup_image:focus{
    outline: none !important;
}
input#popup_image,input#popup_video {
    font-weight: 600;
    font-size: 18px;
    width: 40%;
    background: transparent;
    padding: 15px 0;
    border-radius: 10px;
    color: black;
}

.actions a {
    text-decoration: none;
    font-size: 14px;
    background: transparent !important;
    color: #1A73E8 !important;
    padding: 0 !important;
}

.actions {
    display: flex;
    justify-content: start;
    gap: 10px;
    margin: 5px 0;
    align-items: center;
}
img#ipb_img_front {
    width: 25%;
    display: block;
    margin: 14px 0;
}

.input_fields_wrap i.fa-solid.fa-trash {
    cursor: pointer;
    position: relative;
    top: -9px;
    font-size: 16px;
    color: red;
}
.input_fields_wrap .fields {
    flex: 0 0 32%;
}

.input_fields_wrap {
    position: relative;
    align-items: end;
    display: flex;
    padding: 10px 0;
}

.input_fields_wrap
 .info {
    position: absolute;
   right: 16px;
    top: 42px;
}

.input_fields_wrap .info img {
    width: 18px;
}

.input_fields_wrap .fields select {
    width: 95%;
}

.instant_inner_wrapper .heading {
    display: flex;
    align-items: end;
    align-items: c;
    justify-content: space-between;
}

.popup_message.edit_message {
    position: relative;
    width: fit-content;
    background: transparent;
}

.popup_message.edit_message p {
    margin: 0 !important;
    font-size: 16px;
    font-weight: 700;
}

.instant_inner_wrapper .heading h1 {
    margin: 10px 0;
}

.ipb_popup_setting {
    margin-top: 100px;
}
.bulk_status_filter
 form#bulk_filter {
    width: 50%;
}

.popup_bulk_filter.subscription_filter {
    justify-content: space-between;
    width: 98% !important;
}

.bulk_status_filter {
    width: 66%;
}

.ipb_setting_tab input[type=checkbox] {
    height: 20px;
    width: 20px;
    margin-top: 0px;
}

.ipb_setting_tab input[type=checkbox]:checked::before {
    width: 26px;
}

.fields label {
    color: #1E1F21;
    font-size: 16px !important;
}
.form_fields {
    margin: 30px 0;
}

.input_fields {
    height: 100px;
    margin: 40px 0;
    display: flex;
    gap: 45px;
    align-items: start;
}

.input_field {
    position: relative;
    flex: 0 0 22%;
}

/* .input_field input[type="radio"]+label {
    left: 0;
    position: absolute;
    width: 100%;
    max-width: 100%;
    background: #2A408B !important;
    z-index: 99999;
    top: -12px;
} */

/* .input_field label {
    text-transform: capitalize;
    border-radius: 10px;
    cursor: pointer;
    color: white;
    width: 100%;
    position: absolute;
    background: #2A408B;
    padding: 40px 10px;
    text-align: center;
    font-size: 29px;
} */

/* .input_field input[type="radio"]:checked+label {

    background: yellow !important;
    color: black !important;

} */

.size_fields {
    transition: opacity 0.5s ease-in-out;
    margin: 20px 0;
    display: flex;
    flex-direction: column;
    width: 100% !important;
    gap: 20px;
}

.size_fields .field_l {
    width: 49%;
}

.size_fields .field_l input {
    padding: 5px 12px;
    width: 260px !important;
}

.field_l.design_percent {
    margin: 20px 0;
    display: none;
    /* gap: 0px;
    flex-direction: column;
    position: relative;
    align-items: self-start; */

}

#design_percentage {
    display: block;
    margin: 10px 0 !important;
    padding: 0px !important;
    -webkit-appearance: none;
    margin: 10px 0;
    width: 65%;
    background: transparent;
  }
  #design_percentage:focus {
    outline: none;
  }
  #design_percentage::-webkit-slider-runnable-track {
    width: 100%;
    height: 15px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: none;
    background: transparent;
    border-radius: 26px;
    border: 1px solid #1A73E8;
  }
  #design_percentage::-webkit-slider-thumb {
    box-shadow:none;
    border: 1px solid #1A73E8;
    height: 26px;
    width: 27px;
    border-radius: 25px;
    background: #1A73E8;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -6.5px;
  }
  #design_percentage:focus::-webkit-slider-runnable-track {
    background: transparent;
  }
  #design_percentage::-moz-range-track {
    width: 100%;
    height: 15px;
    cursor: pointer;
    animate: 0.2s;
    box-shadow: none;
    background:transparent;
    border-radius: 0;
    border: 1px solid #1A73E8;
  }
  #design_percentage::-moz-range-thumb {
    box-shadow:none;
    border: 1px solid #1A73E8;
    height: 25px;
    width: 25px;
    border-radius: 0;
    background: #1A73E8;
    cursor: pointer;
  }
  #design_percentage::-ms-track {
    width: 100%;
    height: 10px;
    cursor: pointer;
    animate: 0.2s;
    background: transparent;
    border-color: transparent;
    color: transparent;
  }
  #design_percentage::-ms-fill-lower {
    background: #1A73E8;
    border: 1px solid #000000;
    border-radius: 52px;
    box-shadow: 1px 1px 1px #000000;
  }
  #design_percentage::-ms-fill-upper {
    background: #1A73E8;
    border: 1px solid #000000;
    border-radius: 0;
    box-shadow: none;
  }
  #design_percentage::-ms-thumb {
    box-shadow: none;
    border: 1px solid #1A73E8;
    height: 26px;
    width: 27px;
    border-radius: 25px;
    background: #1A73E8;
    cursor: pointer;
  }
  #design_percentage:focus::-ms-fill-lower {
    background: #1A73E8;
  }
  #design_percentage:focus::-ms-fill-upper {
    background: #1A73E8;
  }

p.perc_count {
    /* position: relative; */
    /* top: -9px; */
    font-size: 16px;
    font-weight: 400;
    color: black;
}

input#add_new_popup {
    border-radius: 10px;
    width: 20%;
    margin: 20px;
    background: #2A408B !important;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    color: white;
    cursor: pointer;
}
.modal{

    max-width: fit-content !important;
}

.instant_text {
    max-width: 70% !important;
    padding: 15px 20px !important;
    font-size: 20px !important;
}

.instant_text p {
    margin: 0;
    font-size: 18px;
}

.instant_inner_wrapper form {
    flex-wrap: wrap;
    align-items: stretch;
    display: flex;
    gap: 10px;
}

.instant_left_col {
    /* display: flex; */
    flex: 0 0 68%;
    flex-direction: column;
}

.actions a.edit_btn,.actions a.del_btn {
    background: #2A408B;
    padding: 5px 10px;
    border-radius: 5px;
    color: white;
    text-decoration: none;
}

.popup_lists p.popu_views {
    color: #1E1F21;
    padding: 10px;
    background: #F8FAFC;
    border-radius: 6px;
    font-weight: 400;
    line-height: normal;
}
a.edit_btn,a.dup_btn,a.prev_btn {
    padding: 1px 7px !important;
    border-right: 1px solid #E0E0E0 !important;
    border-radius: 0 !important;
}
.actions a.del_btn {
    background-color: transparent !important;
    color: #D32F2F !important;
}
.debug_file {
    scrollbar-width: thin;
    overflow: scroll;
    height: 400px;
    line-height: 26px;
    padding: 15px;
    background: white;
    margin: 20px 0;
    width: 650px;
    padding-top: 0;
    white-space: pre-line;
    border-radius: 10px;
}
/* .initial_trigger .fields:nth-child(2),.initial_trigger .fields:nth-child(3) {
    display: none;
} */
.initial_trigger{
    display: none;
}
#delete {
    background: #9d0202 !important;
}

div#editor {
    /* position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0; */
    height: 235px;
}

input.ipb_submit, #ipb_action_draft {
    width: 100%;
    background: #1A73E8 !important;
    font-size: 18px;
    color: white;
    font-weight: 400;
    padding: 10px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    text-transform: capitalize;
    line-height: 28px;
}

button#ipb_action_draft {
    padding: 12px;
    background: #D8E7FB !important;
    color: #1E1F21;
}

.ipb_setting_tab .tab_content
 .fields {
    padding: 10px 20px;
    border: 1px solid #E0E0E0;
    width: fit-content;
    margin: 20px 0;
}

.insant_image {
    width: 50% !important;
    max-width: 50% !important;
        padding: 0 !important;
}

.insant_image
 img#ipb_img_front {
    width: 100%;
}

#trigger
 .trigger_options {
    align-items: center;
}
/* Keep trigger fields inline: input, copy icon, trash, info */
.trigger_options .fields { display: inline-flex; align-items: center; gap: 8px; padding: 0; border: none; margin: 0; }
.trigger_options .fields input[type="text"],
.trigger_options .fields input[type="number"] { width: auto; }
.trigger_options i.fa-solid.fa-trash { position: static; top: 0; }
.trigger_options .info { position: static; }
.trigger_options .info img { position: static; width: 18px; }
.toggle {
    justify-content: space-between;
    width: 100%;
    display: flex;
}
.ipb_sound_wrapper{

    flex-direction: column;
    gap: 40px;
}

.ipb_sound_wrapper .sound_inputs {
    display: flex;
    gap: 20px;
    position: relative;
    width: fit-content;
}

.sound_wrap {
    flex-direction: column;
}

.sounds {
    width: 100% !important;
}
.sound_fields {
    width: 50%;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sounds i {
    font-size: 32px;
}

.sound_input {
    padding-bottom: 20px;
    flex-wrap: wrap;
    display: flex;
}
.v_tabs_content .v_tab_content{

    display: none;
}
.v_tabs_content .active{

    padding: 20px 0;
    display: block;
}

.intant_new_popup_type {
    margin-top: 110px !important;
}

.popup_message {
    position: absolute;
    padding: 0px 20px;
    background: white;
    width: 100%;
    left: -2%;
    z-index: 99;
}

.popup_message p {
    font-size: 24px;
    font-weight: 600;
}

/* Settings tabs styles moved to admin/css/settings-tabs.css */

#closing .input_fields {
    height: auto;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 20px;
    margin: 5px 0;
    width: 350px;
}

.instant_popup_setting i.fa-solid.fa-trash{

    color:#D32F2F;
}

.trigger_options {
    position:relative;
    display: flex;
    align-items: center;
    gap: 15px;
}
#trigger .rules {
    gap: 20px;
    align-items: end;
    position: relative;
}

.exit_trigger .info{
    top: -46px;
}

select#close_position {
    width: 100%;
    margin: 15px 0px;
}

.trigger_inner .rules select,.input_fields_wrap select ,.instant_popup_setting select, .instant_popup_setting input[type="text"],
.instant_popup_setting input[type="number"],.instant_popup_setting .select2-selection
{
    font-size:16px;
    width: 100%;
    color:#1E1F21;
    padding: 2px 15px;
    border-radius: 6px;
    border: 1px solid #E0E0E0;
}

.trigger_inner h2 {
    font-size: 18px;
    font-weight: 500;
}

.limit_fields input {
    width: 65%;
    padding: 5px 12px;
    font-size: 14px;
    border: none;
    margin: 10px 0;
}
#closing .input_fields .fields {
    border-radius: 5px;
    margin: 1px 0;
    background: #1a73e8;
    flex: 0 0 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 5px 15px 5px 15px;
    color: white;
    width: 100%;
    position: relative;
}

#closing .input_fields .fields label {
    font-weight: 300;
    font-size: 15px !important;
    color: white;
}

#closing .info {
    position: absolute;
    right: 0;
    top: -3px;
}

/* Make info icon outside the box with spacing (6-8px) in closing section */
#closing .fields .info {
    position: absolute !important;
    right: -24px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex;
    align-items: center;
    margin-left: 0;
    vertical-align: middle;
    flex-shrink: 0;
}

#closing .input_field_sel .info {
    position: absolute !important;
    right: -24px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex;
    align-items: center;
    margin-left: 0;
    vertical-align: middle;
}

#closing .input_field_sel {
    width: 250px;
    position: relative;
}

#closing .input_fields .fields input:before, .video_wrapper input[type="checkbox"]:before {
    position: absolute;
    content: '';
    width: 25px !important;
    height: 25px !important;
    background: white;
    border-radius: 4px;
    left: 0;
    top: -2px;
}

#closing .input_fields .fields input:after,.video_wrapper input[type="checkbox"]:after {
    content: '';
    width: 8px;
    height: 16px;
    border-width: 0px 3px 3px 0px;
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #1a73e8;
    transform: rotate(46deg);
    left: 3px;
    top: -2px;
    opacity: 0;
}

#closing .input_fields .fields input:checked:after,.video_wrapper input[type="checkbox"]:checked:after {
    left: 6px;
    opacity: 1;
}

#closing .input_fields .fields input:checked:before,.video_wrapper input[type="checkbox"]:checked:before {
    top: 1px;
    left: 3px;
}

#closing .input_fields .fields input,.video_wrapper input[type="checkbox"]  {
    appearance: none;
    position: relative;
}

.input_fields_p {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    margin: 10px 0;
    gap: 5px;
}

.position_option {
    width: 80%;
    position: relative;
    display: flex;
    gap: 20px;
    align-items: center;
}

.position_option .input_fields_p {
    flex-wrap: wrap;
    width: 48%;
}

.position_option h2 {
    width: 130px;
    margin: 0;
}

.position_option .info {
    position: absolute !important;
    left: calc(130px + 3px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    right: auto !important;
    display: inline-flex;
    align-items: center;
    margin-left: 0;
    vertical-align: middle;
}

select#back_image_size {
    width: 220px;
}

.fields_p {
    flex: 0 0 26%;
    margin: 16px 0px;
    position: relative;
    width: 26%;
    padding: 6px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
}

.limit_fields {
    display: flex;
    align-items: center;
    gap: 50px;
}

.limit_fields h2 {
    width: 120px;
}

.limit_fields .field_l {
    gap: 20px;
    position: relative;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    width: fit-content;
}

.limit_fields .info {
    z-index: 9999;
    top: 15%;
    position: absolute;
    right: 0;
}

/* Design page - size fields and z-index: position icons outside inputs */
.size_fields .field_l .info,
.limit_fields .field_l .info:not(label .info) {
    position: absolute !important;
    right: -24px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: auto;
}

/* Override absolute positioning when info icon is inside inline-flex label */
.limit_fields label[style*="inline-flex"] .info,
.limit_fields label[style*="display:inline-flex"] .info {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    z-index: auto;
}

.input_fields_p label {
    position: absolute;
    /* width: 100%; */
    /* background: #f29494; */
    padding: 5px 0;
}

.input_fields_p input[type="radio"] {
    position: absolute;
    width: 100%;
    appearance: none;
    background: transparent;
    border: none;
    box-shadow: none;
    height: 43px;
}

#background .input_fields_p  input[type="radio"]:before{

    border-radius: 0px !important;
}

.input_fields_p  input[type="radio"]:before {
    border-radius: 0px;
    top: 10%;
    left: 0;
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background: #1A73E8;
}
.input_fields_p  input[type="radio"]:checked:before {
    border-radius: 5;
    left: -3px;
    top: 0px;
    background: rgb(42 42 42);
}

/**
 * All of the CSS for your admin-specific functionality should be
 * included in this file.
 */

 .popup_message a {
    color: #2A408B;
}

body.ipb-admin-page h1 {
    font-size: 32px;
    margin: 32px 0;
    /* font-weight: 600; */
}

body.ipb-admin-page label {
    font-size: 18px;
    line-height: 32px;
    font-weight: 400;
}

span.status {
    font-weight: 500;
    font-size: 18px;
}
td.no-item {
    text-align: center;
    border: none !important;
}

.label label {
    font-size: 18px;
    font-weight: 600;
}

textarea#popup_type_value ,.input_wrapper select {
    border:1px solid #1A73E8 !important;
    padding: 10px;
    width: 98%;
    margin: 10px 0;
    border: none;
    border-radius: 10px;
}

.instant_popup_filter {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 10px 0px 0 0;
}

.popup_status ul {
    align-items: center;
    margin: 0;
    display: flex;
    gap: 20px;
}

.popup_status {
    flex: 0 0 80%;
}

.instant_filter {
    width: 48%;
    float: right;
    flex: 0 0 48%;
}
.filter_wrapper {
    margin-top: 80px;
    /* padding: 20px; */
    display: flex;
    align-content:center;
}

.popup_bulk_filter {
    align-items: center;
    display: flex;
    width: 50%;
    gap: 15px;
}

.instant_filter {
    width: 48%;
    float: right;
    flex: 0 0 48%;
}

.search_wrapper {
    float: right;
}
.popup_status li a.active{

    color: black;
    font-weight: bold;
    text-decoration: none;
}

.input_field.disabled {
    pointer-events: none;
}

#video_module
 input[type="radio"]+label {
    background: lightblue !important;
}

.top_heading {padding: 0px;border-bottom: 1px solid #E0E0E0;    margin: 110px 20px 20px 3px;}

.popup_bulk_filter .button_sbnt i.fa-solid.fa-plus {
    position: relative;
    left: -8px;
}

.ipb_top_bar {
    top: 0;
    background: white;
    position: absolute;
    padding: 0.8rem 1rem;
    background: white;
    width: 99%;
    left: -17px;
}

.ipb_top_bar ul.list, .instant_popup_setting .tabs_list  ul{
    margin: 5px 0;
    display: flex;
    gap: 25px;
}
.instant_popup_setting .tabs_list{
    padding: 0.3rem 1rem;
    background: white;
    margin: 0 0 15px 0;
    border-radius: 6px;
}
.ipb_top_bar ul.list li a,.instant_popup_setting .tabs_list  ul li a {
    transition: 0.5s ease all;
    color: black;
    padding: 8px 12px;
    text-decoration: none;
    font-size: 18px;
    line-height: normal;
    font-weight: 400;
}

.ipb_top_bar ul.list li, .instant_popup_setting .tabs_list  ul li {
    margin: 0;
}

.ipb_top_bar ul.list li a:hover ,.ipb_top_bar ul.list li a.active,.instant_popup_setting .tabs_list  ul li.active{
    background: #D8E7FB;
    color: #1A73E8;
    font-weight: 600;
}

select#bulk_val, input[name='search_popup'] {
    padding: 3px 12px;
    border: 1px solid #1A73E8 !important;
    font-size: 16px;
    width: 100%;
    border-radius: 6px;
}

.popup_bulk_filter form {
    width: 40%;
    align-items: center;
    gap: 10px;
    display: flex;
}
.popup_lists tr th:nth-child(2), .popup_lists tr td:nth-child(2) {
    padding-left: 0;
}

#popup_status_search_{

    width: 50%;
}

input#search_by_email {
    border: 1px solid #E0E0E0;
    font-size: 18px;
    padding: 1px 15px;
}

a#popup_btn ,input#popup_bulk_search_, #key_search, #popup_status_search_, #ipb_user_btn,input#popup_sub_search_, #popup-close-btn{
    box-sizing: border-box;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    text-shadow: none;
    margin: 20px 0 !important;
    border-radius: 6px;
    background: #1A73E8;
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    color: white;
    padding: 8px 20px;
    min-height: 30px;
    -webkit-appearance: none;
    border: none;
}

.add_new_popup {
    padding: 20px 0;
}

/* radio input block intentionally removed */

.input_wrapper {
    padding: 0px 10px;
    margin: 20px 0;
}
.instant_left_col .input_wrapper {
    padding: 0px !important;
    margin: 0;
}

.input_wrapper.ipb_text_editor {
    margin: 10px 0;
    padding: 10px !important;
    background: white !important;
    border-radius: 10px !important;
}

.ql-editor.ql-blank {
    border: none !important;
}

div#popup_content {
    border: none;
}

div#toolbar-container {
    background: #F0F0F1;
    border: none;
}

img#ipb_img_front {
    width: 25%;
    display: block;
    margin: 14px 0;
}

.input_fields {
    height: 100px;
    margin: 40px 0;
    display: flex;
    gap: 45px;
    align-items: start;
}

.input_field {
    position: relative;
    flex: 0 0 22%;
}

/* .input_field input[type="radio"]+label {
    left: 0;
    position: absolute;
    width: 100%;
    max-width: 100%;
    background: #2A408B !important;
    z-index: 99999;
    top: -12px;
} */

/* .input_field label {
    border-radius: 10px;
    cursor: pointer;
    color: white;
    width: 100%;
    position: absolute;
    background: #2A408B;
    padding: 40px 10px;
    text-align: center;
    font-size: 29px;
} */

/* .input_field input[type="radio"]:checked+label {
    background: yellow !important;
    color: black !important;
} */
input#add_new_popup {
    border-radius: 10px;
    width: 20%;
    margin: 20px;
    background: #2A408B !important;
    border: none;
    padding: 20px;
    font-size: 20px;
    font-weight: bold;
    color: white;
    cursor: pointer;
}

/* Design tab background preview uses .ipb-background-settings .ipb_back_img in setting-background.css */

div#popup-success-modal {
    position: fixed;
    top: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
    background: #000000a3;
    width: 100%;
    height: 100vh;
    left: 0;
}

#popup-success-modal h2 {
    font-size: 28px !important;
    font-weight: 700;
    margin: 10px 0;
}

.modal{

    /* max-width: fit-content !important; */
    height: fit-content;
}

/* .instant_text {
    max-width: 70% !important;
    padding: 30px !important;
    font-size: 20px !important;
}

.instant_text p {
    font-size: 18px;
} */

.instant_inner_wrapper form {
    margin-top: 24px;
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 20px;
}

#ipb_action_draft {
    padding: 9px;
    background: #D8E7FB !important;
    color: #1E1F21;
}

.ipb_preview_box {
    padding: 20px;
    height: 14em;
    background: white;
    border-radius: 6px;
    border: none;
    margin: 20px 0;

}

.preview_link a {
    /* pointer-events: none; */
    background: #1A73E8;
    color: white;
    text-decoration: none;
    padding: 12px 20px;
    font-size: 20px;
    font-weight: 400 !important;
}

.ipb_preview_inner {
    display: flex
    ;
        height: 100%;
        background: #E0E0E0;
        align-items: center;
        justify-content: space-around;
}

p.preview_link {
    margin: 0;
}

.instant_left_col {
    /* display: flex; */
    flex: 0 0 70%;
    flex-direction: column;
}

.options {
    display: flex;
    gap: 10px;
    align-items: center;
}

.options select {
    padding: 2px 10px;
    width: 60%;
}

.instant-right_col {
    flex: 0 0 20%;
    background: transparent;
    height: fit-content;
    border: NONE;
}

div#ipb_actions_wrapper {
    padding: 14px;
    border: 1px solid #E0E0E0;
    gap: 20px;
    border-radius: 5px;
    background: white;
    align-items: center;
    justify-content: center;
}

div#ipb_pop_action {
    width: 100%;
    flex: 0 0 auto;
}

/* .popup_message {
    padding: 20px;
    background: white;
} */

.popup_message p {
    margin: 10px 0;
    font-size: 24px;
    font-weight: 600;
}

/* Settings tabs styles moved to admin/css/settings-tabs.css */

/* Design tab styles moved to admin/css/design-tab.css */

/* Admin review notice moved to admin/css/notices.css */

/* Advance tab styles moved to admin/css/advance-tab.css */

/* setting  */

form#setting_popup {
    width: 98%;
    text-align: left;
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 0;
}

.popup_setting .fields {
    padding: 15px;
    border-radius: 5px;
    background: white;
    width: 300px;
    margin: 20px 0;
    box-shadow: -1px 2px 2px 0px lightgray;
}

/* License styles moved to dedicated file: admin/css/license.css */
/* Setting tab */

.ipb_setting_tab {
    padding: 10px;
    background: white;
    gap: 20px;
    width: 97%;
    display: flex;
}

.ipb_setting_tab
 .tabs_list {
    border-radius: 6px;
    padding: 10px 0;
    width: 300px;
    overflow: hidden;
    border: 1px solid #E0E0E0;
}

.ipb_setting_tab
 .tabs_content {
    width: 65%;
}

.ipb_setting_tab .tabs_list ul {
    display: block;
    width: 100% !important;
}

.ipb_setting_tab .tabs_list ul li {

    padding: 12px;
    font-weight: 500;
    background: white;
    color: black;
    display: flex;
    width: 100%;
    align-items: center;
    gap: 10px;
}

.ipb_setting_tab .tabs_list ul li.active {
    color: white;
    background: #1A73E8;
}

.ipb_setting_tab .tabs_list ul li.active img {
    filter: invert(1);
}

/* Video popup styles are provided by the Instant Popup - Video Popup extension. */
/* Subscription popup styles moved to admin/css/subscription-popup.css */

.input_wrapper fieldset {
    padding: 10px;
    position: relative;
    border-radius: 10px;
    border: 2px solid #1e3a8a;
    margin: 25px 0;
    background: #eb88956e;
    flex: auto;
}

.sub_back_img .back {
    width: fit-content;
    position: relative;
}

.sub_back_img .back i {
    z-index: 1000000;
    position: absolute;
    top: -6px;
    left: -5px;
    color: yellow !important;
    font-size: 22px;
    cursor: pointer;
}

fieldset.sub_back_img {
    width: 100%;
}
.input_wrapper label.up_label {
    position: absolute;
    top: -28px;
    background: white;
    padding: 0px 10px;
}

.subscription_popup {
    border-radius: 10px;
    z-index: 9999999;
    gap: 10px;
    display: flex;
    overflow: hidden;
    background: white;
    width: 100% !important;
}

.subscription_popup img {
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.subscription_popup .sub_left_col {
    display: flex;
    flex: 0 0 45%;
    padding: 30px;
    flex-direction: column;
    justify-content: center;
    background: white !important;
}

.subscription_popup .fields {
    width: 100% !important;
    padding: 6px 0;
    display: flex;
    flex-direction: column;
}

.sub_left_col h2 {
    margin: 20px 0 !important;
    font-size: 32px;
    line-height: 38px;

}

.subscription_popup .sub_left_col label {
    font-size: 18px !important;
    margin: 0;
    line-height: 32px;
    color: black !important;
}

.subscription_popup input {
    border: 1px solid #cacaca;
    border-radius: 10px !important;
    line-height: 20px !important;
    padding: 10px !important;
}

.sub_privacy label {
    font-size: 16px !important;
}

.input_wrapper fieldset input {
    width: 100%;
    padding: 5px 10px;
    border: none;
    color: black !important;
    font-size: 16px;
}

.input_wrapper .inner_field {
    margin: 10px 0 !important;
    padding: 10px !important;
}

.input_wrapper .inner_field {
    padding: 5px 0;
}

.subscription_modal {
    width: 70%;
}

.fields.sub_privacy {
    flex-direction: row;
    display: flex;
    justify-content: start;
    align-items: center;
    gap: 3px;
}

.fields.sub_privacy input {
    padding: 0px !important;
    border-radius: 0px !important;
}

input#sub_btn {
    background: black;
    color: white;
    border: none;
    font-size: 16px;
    font-weight: 500;
    line-height: 27px !important;
}

input#sub_btn:hover {
    border: 2px solid black;
    background: transparent;
    color: black !important;
    box-shadow: none !important;
    cursor: pointer;
    transition: 0.5s ease all;
}
.subscription_field .input_wrapper fieldset{

    margin-top: 50px 0 !important;
}

.subscription_field .input_wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
}

.add_new.subscribe_head {
    border-bottom: 1px solid #E0E0E0 !important;
    margin-top: 70px;
    display: flex;
    justify-content: space-between;
    width: 98%;
    align-items: center;
    margin-bottom: 20px;
}

.subscribe_head
 .ipb_new_user {
    width: 32%;
}

a#ipb_user_btn {
    padding: 10px 36px;
    display: flex;
    margin: 0 !important;
    align-items: center;
    gap: 15px;
}

.ipb_new_user li {
    margin: 0;
    position: relative;
    color: #1E1F21;
    font-size: 18px;
    font-weight: 400;
    display: flex;
    align-items: center;
    gap: 6px;
}

.subscribe_head .ipb_new_user ul {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
/* End Subscriptiop popup */

/* Media query */

/* Add New Popup responsive styles moved to admin/css/add-new-popup.css */

@media (min-width: 1024px) and (max-width:1366px)
{
    .background_field .back_pos .fields_p {
        flex: 0 0 20%;
    }
}
.background_field.background_color{
    display: none !important;
}
.background_field.background_color.show{
    display: flex !important;
}
.background_field.background_image{
    display: none !important;
}
.background_field.background_image.show{
    display: flex !important;
}

/* Dashboard/All Popups list page styles moved to admin/css/dashboard.css */

.preview_links a {
    width: 100%;
    padding: 8px 0px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 0 !important;
    background: #f0f0f1;
    color: #1d2327;
    text-decoration: none;
}

#ipb_pop_action button {
    width: 100%;
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.ipb-publish {
    background: #2271b1;
    color: #fff;
}

button.ipb-save-draft {
    margin-bottom: 10px;
}
.instant-right_col.postbox {
    min-width: auto !important;
    margin-right: 20px;
    position: sticky;
    top: 32px;
    align-self: flex-start;
}
p.preview_links {
    margin-top: 0px !important;
    margin-bottom: 10px;
}

/**
 * Template Selection Modal Styles
 */
#subscription-template-modal {
    position: fixed !important;
    top: 10% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 800px !important;
    height: auto !important;
    background: none !important;
    z-index: 999999 !important;
    display: none !important;
    transition: all 0.3s ease !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    /* Override blocker styles from main modal.css */
    right: auto !important;
    bottom: auto !important;
    padding: 0 !important;
    box-sizing: content-box !important;
    overflow: visible !important;
    text-align: left !important;
}

/* Ensure no blocker overlay is applied */
#subscription-template-modal:before {
    display: none !important;
    content: none !important;
}

/* Override any modal library blocker styles */
.blocker #subscription-template-modal,
#subscription-template-modal.blocker {
    position: fixed !important;
    top: 10% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 800px !important;
    height: auto !important;
    background: none !important;
    background-color: transparent !important;
    right: auto !important;
    bottom: auto !important;
    padding: 0 !important;
    box-sizing: content-box !important;
    overflow: visible !important;
    text-align: left !important;
}

/* Prevent blocker pseudo-element */
.blocker #subscription-template-modal:before,
#subscription-template-modal.blocker:before {
    display: none !important;
    content: none !important;
}

#subscription-template-modal.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: none !important;
    background-color: transparent !important;
}

.template-selection-modal .modal-content {
    background: #ffffff;
    border-radius: 8px;
    max-width: 800px;
    max-height: 85vh;
    width: 800px;
    position: relative;
    overflow: hidden;
    box-shadow: none;
    border: 1px solid #ddd;
    transition: transform 0.3s ease;
}

#subscription-template-modal.show .modal-content {
    transform: none;
}

.template-selection-modal .modal-header {
    padding: 20px 25px;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
}

.template-selection-modal .modal-header h3 {
    margin: 0;
    font-size: 20px;
    color: #333;
    font-weight: 600;
}

.template-selection-modal .close-modal {
    font-size: 24px;
    cursor: pointer;
    color: #999;
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    transition: color 0.3s ease;
}

.template-selection-modal .close-modal:hover {
    color: #333;
}

.template-selection-modal .modal-body {
    padding: 0;
    max-height: calc(85vh - 80px);
    overflow-y: auto;
    background: #fff;
}

/* Template Selection Content */
.template-selection-modal .template_selection_wrapper {
    margin: 0;
    padding: 25px;
    max-width: none;
}

.template-selection-modal .ipb_new_heading {
    margin-bottom: 20px;
    text-align: center;
}

.template-selection-modal .ipb_new_heading h3 {
    display: none; /* Hide since we have it in modal header */
}

.template-selection-modal .ipb_new_heading p {
    font-size: 14px;
    color: #666;
    margin: 0;
}

.template-selection-modal .ipb_template_search {
    margin-bottom: 25px;
    display: flex;
    justify-content: center;
}

.template-selection-modal .ipb_ext_search {
    max-width: 300px;
    width: 100%;
}

.template-selection-modal .ipb_ext_search input {
    padding: 10px 15px;
    font-size: 14px;
    border-radius: 6px;
    border: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
}
/* Enhanced Subscribers Management styles moved to admin/css/subscribers.css */

/* Enhanced Subscribers Management Styles */
.ipb_subscription_wrapper {
    background: #f8f9fa;
    min-height: 100vh;
    padding: 20px;
}

.ipb_subscription_wrapper .wrapper {
    width: 100%;
    margin: 0 auto;
    background: white;
    border-radius: 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    overflow: hidden;
}

/* Header Section */
.ipb_subscribers_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 40px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_subscribers_header h1 {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    color: white;
}

.ipb_header_actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

/* Enhanced Button Styles */
.ipb_btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
    white-space: nowrap;
}

.ipb_btn_primary {
    background: #4f46e5;
    color: white;
}

.ipb_btn_primary:hover {
    background: #4338ca;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(79, 70, 229, 0.3);
}

.ipb_btn_secondary {
    background: white;
    color: #374151;
    border: 1px solid #d1d5db;
}

.ipb_btn_secondary:hover {
    background: #f9fafb;
    border-color: #9ca3af;
    transform: translateY(-1px);
}

/* Enhanced Filters Section */
.ipb_filters_section {
    padding: 20px 30px;
    background: #fefefe;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_filters_form {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.ipb_filters_row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 15px;
    align-items: end;
}

.ipb_filter_group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ipb_filter_group label {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.ipb_filter_group select,
.ipb_filter_group input[type="date"],
.ipb_filter_group input[type="email"],
.ipb_filter_group input[type="text"] {
    padding: 8px 12px;
    border: 2px solid #e5e7eb;
    border-radius: 6px;
    font-size: 13px;
    transition: all 0.3s ease;
    background: white;
}

.ipb_filter_group select:focus,
.ipb_filter_group input:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.ipb_search_group {
    flex: 1;
}

.ipb_filter_actions {
    display: flex;
    gap: 12px;
    align-items: end;
    justify-content: flex-end;
}

/* Enhanced Import Modal */
.ipb_enhanced_modal {
    max-width: 600px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
}

/* Subscriber Modal Styles */
.ipb_subscriber_modal {
    max-width: 800px !important;
}

.ipb_subscriber_modal .ipb_modal_body {
    max-height: 70vh;
    overflow-y: auto;
    padding: 20px 30px;
}

.ipb_subscriber_modal .ipb_form_section {
    margin-bottom: 25px;
    padding: 20px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.ipb_subscriber_modal .ipb_form_section:last-child {
    margin-bottom: 0;
}

.ipb_subscriber_modal .ipb_section_header {
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_subscriber_modal .ipb_section_header h4 {
    margin: 0;
    font-size: 16px;
    color: #1e293b;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ipb_subscriber_modal .ipb_section_header h4 i {
    color: #667eea;
}

.ipb_subscriber_modal .ipb_form_grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    align-items: start;
}

.ipb_subscriber_modal .ipb_form_group_full {
    grid-column: 1 / -1;
}

.ipb_subscriber_modal .ipb_form_group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ipb_subscriber_modal .ipb_form_label {
    font-size: 13px;
    font-weight: 600;
    color: #374151;
}

.ipb_subscriber_modal .ipb_form_label .required {
    color: #ef4444;
}

.ipb_subscriber_modal .ipb_form_input,
.ipb_subscriber_modal .ipb_form_select {
    padding: 10px 12px;
    border: 2px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    transition: all 0.3s ease;
    background: white;
}

.ipb_subscriber_modal .ipb_form_input:focus,
.ipb_subscriber_modal .ipb_form_select:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.ipb_subscriber_modal .ipb_form_input.ipb_field_invalid,
.ipb_subscriber_modal .ipb_form_select.ipb_field_invalid {
    border-color: #ef4444;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.1);
}

.ipb_subscriber_modal .ipb_form_input[readonly] {
    background-color: #f9fafb;
    color: #6b7280;
    cursor: not-allowed;
}

.ipb_subscriber_modal .ipb_field_error {
    color: #ef4444;
    font-size: 12px;
    font-weight: 500;
    display: none;
}

.ipb_subscriber_modal .ipb_toggle_container {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ipb_subscriber_modal .ipb_toggle_switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 24px;
}

.ipb_subscriber_modal .ipb_toggle_switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.ipb_subscriber_modal .ipb_toggle_label {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #cbd5e1;
    transition: 0.3s;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 2px;
}

.ipb_subscriber_modal .ipb_toggle_slider {
    height: 20px;
    width: 20px;
    background-color: white;
    transition: 0.3s;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.ipb_subscriber_modal .ipb_toggle_switch input:checked + .ipb_toggle_label {
    background-color: #10b981;
}

.ipb_subscriber_modal .ipb_toggle_switch input:checked + .ipb_toggle_label .ipb_toggle_slider {
    transform: translateX(26px);
}

.ipb_subscriber_modal .ipb_toggle_text {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

/* Modal Responsive Design */
@media (max-width: 768px) {
    .ipb_subscriber_modal {
        max-width: 95% !important;
    }

    .ipb_subscriber_modal .ipb_modal_body {
        padding: 15px 20px;
        max-height: 60vh;
    }

    .ipb_subscriber_modal .ipb_form_grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .ipb_subscriber_modal .ipb_form_section {
        padding: 15px;
        margin-bottom: 20px;
    }

    .ipb_subscriber_modal .ipb_section_header h4 {
        font-size: 15px;
    }
}

.ipb_modal_content {
    background: white;
    border-radius: 12px;
    overflow: hidden;
}

.ipb_modal_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 30px;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_modal_header h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #1e293b;
}

.ipb_modal_close {
    font-size: 24px;
    color: #64748b;
    text-decoration: none;
    cursor: pointer;
    transition: color 0.2s ease;
}

.ipb_modal_close:hover {
    color: #dc2626;
}

.ipb_modal_body {
    padding: 30px;
}

.ipb_file_upload_area {
    border: 2px dashed #d1d5db;
    border-radius: 12px;
    padding: 40px;
    text-align: center;
    margin-bottom: 30px;
    transition: all 0.3s ease;
    cursor: pointer;
}

.ipb_file_upload_area:hover {
    border-color: #4f46e5;
    background: #f8fafc;
}

.ipb_file_upload_area i {
    font-size: 48px;
    color: #9ca3af;
    margin-bottom: 16px;
}

.ipb_file_upload_area p {
    font-size: 16px;
    color: #64748b;
    margin-bottom: 16px;
}

.ipb_import_settings h4 {
    margin-bottom: 16px;
    font-size: 16px;
    font-weight: 600;
    color: #374151;
}

.ipb_checkbox_label {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
    font-size: 14px;
    color: #374151;
    cursor: pointer;
}

.ipb_checkbox_label input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: #4f46e5;
}

.ipb_modal_footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 24px 30px;
    background: #f8fafc;
    border-top: 1px solid #e5e7eb;
}

/* Bulk Actions */
.ipb_bulk_actions {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 20px 40px;
    background: #f8fafc;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_bulk_actions select {
    padding: 8px 12px;
    border: 2px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    background: white;
}

/* Enhanced Table Styles */
.ipb_table_container {
    overflow: visible;
    margin: 0;
}

.ipb_subscribers_table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
    background: white;
    table-layout: fixed;
}

.ipb_subscribers_table thead {
    background: #f8fafc;
    border-bottom: 2px solid #e5e7eb;
}

.ipb_subscribers_table th {
    padding: 12px 16px;
    text-align: left;
    font-weight: 600;
    color: #374151;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}

.ipb_subscribers_table th.ipb_sortable {
    cursor: pointer;
    user-select: none;
    transition: background-color 0.2s ease;
}

.ipb_subscribers_table th.ipb_sortable:hover {
    background: #e5e7eb;
}

.ipb_checkbox_column,
.ipb_actions_column {
    width: 4%;
    text-align: center;
}

.ipb_subscriber_row {
    border-bottom: 1px solid #f1f5f9;
    transition: all 0.2s ease;
}

.ipb_subscriber_row:hover {
    background: #fafbfc;
}

.ipb_subscribers_table td {
    padding: 12px 16px;
    vertical-align: middle;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Enhanced Cell Styles */
.ipb_name_cell {
    width: 20%;
}

.ipb_subscriber_info {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ipb_subscriber_avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 600;
    color: white;
    text-transform: uppercase;
    flex-shrink: 0;
}

.ipb_subscriber_details strong {
    color: #1e293b;
    font-weight: 600;
}

.ipb_email_cell {
    width: 25%;
}

.ipb_email_with_status {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #475569;
}

.ipb_email_status {
    font-size: 16px;
}

.ipb_email_status.ipb_active {
    color: #10b981;
}

.ipb_email_status.ipb_inactive {
    color: #ef4444;
}

.ipb_campaign_cell {
    width: 15%;
}

.ipb_campaign_badge {
    display: inline-block;
    padding: 4px 12px;
    background: #dbeafe;
    color: #1e40af;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
}

.ipb_no_campaign {
    color: #9ca3af;
    font-style: italic;
    font-size: 12px;
}

.ipb_privacy_cell {
    width: 12%;
}

.ipb_privacy_status {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 500;
}

.ipb_privacy_status.ipb_agreed {
    color: #10b981;
}

.ipb_privacy_status.ipb_not_agreed {
    color: #f59e0b;
}

.ipb_status_cell {
    width: 12%;
}

.ipb_subscription_status {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.ipb_subscription_status.ipb_subscribed {
    background: #d1fae5;
    color: #065f46;
}

.ipb_subscription_status.ipb_unsubscribed {
    background: #fee2e2;
    color: #991b1b;
}

.ipb_date_cell {
    width: 12%;
    color: #64748b;
    font-size: 12px;
}

.ipb_actions_cell {
    width: 4%;
}

.ipb_checkbox_column {
    width: 4%;
    text-align: center;
}

.ipb_action_buttons {
    display: flex;
    gap: 4px;
    justify-content: center;
}

.ipb_action_btn {
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.2s ease;
    font-size: 12px;
}

.ipb_edit_btn {
    background: #dbeafe;
    color: #1e40af;
}

.ipb_edit_btn:hover {
    background: #bfdbfe;
    transform: translateY(-1px);
}

.ipb_export_btn {
    background: #d1fae5;
    color: #065f46;
}

.ipb_export_btn:hover {
    background: #a7f3d0;
    transform: translateY(-1px);
}

.ipb_delete_btn {
    background: #fee2e2;
    color: #991b1b;
}

.ipb_delete_btn:hover {
    background: #fecaca;
    transform: translateY(-1px);
}

/* Empty State */
.ipb_no_data {
    text-align: center;
    padding: 60px 20px;
}

.ipb_empty_state {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    color: #64748b;
}

.ipb_empty_state i {
    font-size: 48px;
    color: #cbd5e1;
    margin-bottom: 8px;
}

.ipb_empty_state h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 600;
    color: #475569;
}

.ipb_empty_state p {
    margin: 0;
    font-size: 14px;
}

/* Enhanced Pagination */
.ipb_pagination_wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 40px;
    background: #f8fafc;
    border-top: 1px solid #e5e7eb;
}

.ipb_pagination_info {
    font-size: 14px;
    color: #64748b;
}

.ipb_pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    margin: 0 2px;
    border: 1px solid #e5e7eb;
    border-radius: 6px;
    text-decoration: none;
    color: #374151;
    font-size: 14px;
    transition: all 0.2s ease;
}

.ipb_pagination .page-numbers:hover,
.ipb_pagination .page-numbers.current {
    background: #4f46e5;
    color: white;
    border-color: #4f46e5;
}

.ipb_pagination .page-numbers.dots {
    border: none;
    background: none;
    color: #9ca3af;
}

/* Responsive Design */
@media (max-width: 1200px) {
    .ipb_subscription_wrapper {
        padding: 10px;
    }

    .ipb_subscribers_header {
        padding: 20px 25px;
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }

    .ipb_filters_section {
        padding: 15px 25px;
    }

    .ipb_filters_row {
        grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        gap: 12px;
    }

    .ipb_pagination_wrapper {
        flex-direction: column;
        gap: 15px;
        text-align: center;
    }
}

@media (max-width: 768px) {
    .ipb_filters_row {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .ipb_filter_actions {
        justify-content: center;
        grid-column: 1 / -1;
    }

    .ipb_filters_section {
        padding: 12px 20px;
    }

    .ipb_subscribers_header {
        padding: 15px 20px;
    }

    .ipb_subscribers_header h1 {
        font-size: 22px;
    }

    .ipb_header_actions {
        flex-wrap: wrap;
        justify-content: center;
        gap: 8px;
    }

    .ipb_bulk_actions {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .ipb_subscribers_table {
        font-size: 11px;
    }

    .ipb_subscribers_table th,
    .ipb_subscribers_table td {
        padding: 8px 6px;
    }

    .ipb_subscriber_info {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }

    .ipb_subscriber_avatar {
        width: 28px;
        height: 28px;
        font-size: 11px;
    }

    .ipb_action_buttons {
        flex-direction: column;
        gap: 3px;
    }
}

@media (max-width: 480px) {
    .ipb_table_container {
        font-size: 11px;
    }

    .ipb_subscribers_table th,
    .ipb_subscribers_table td {
        padding: 8px 4px;
    }

    .ipb_subscriber_avatar {
        width: 28px;
        height: 28px;
        font-size: 10px;
    }

    .ipb_action_btn {
        width: 28px;
        height: 28px;
        font-size: 10px;
    }
}

.input_field {
    position: relative;
    flex: 0 0 30%;
    /* justify-content: center; */
}

.input_fields {
    flex-wrap: wrap;
    margin-bottom: 100px;
}

div#ipb_new_subscriber_ {
    margin: 100px 0;
    background: white;
    /* padding: 30px; */
    width: 98%;
    box-sizing: border-box;
    padding: 50px 100px 30px 30px;
}

#ipb_new_subscribe_ .ipb_sub_wrapper {
    display: flex !important;
}

.ipb_sub_wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 40px;
    justify-content: space-between;
}

.ipb_sub_wrapper .ipb_sub_fields {
    display: flex;
    width: 49%;
    flex: 1 0 48%;
    gap: 20px;
}

.ipb_sub_wrapper .ipb_sub_fields label {
    width: 150px;
    color: black;
    /* flex: 0 0 20%; */
    font-size: 20px;
}

.ipb_sub_wrapper .ipb_sub_fields input,
.ipb_sub_wrapper .ipb_sub_fields select {
    padding: 2px 15px;
    border-radius: 6px;
    font-weight: 400;
    max-width: 100%;
    border: 1px solid #E0E0E0;
    width: 100% !important;
    font-size: 18px;
}

.ipb_sub_wrapper .ipb_sub_fields input::placeholder {
    color: black;
}

.ipb_sub_fields.check_sub_field {
    padding: 10px 0 20px 0;
    gap: 30px;
    flex: 0 0 50% !important;
}

.ipb_sub_fields.check_sub_field .check_field {
    display: flex;
    width: 48%;
    gap: 30px;
    align-items: center;
}

.check_sub_field .check_field label {
    width: 74%;
    flex: 0 0 58%;
}

.check_sub_field .check_field .input.ipb_tog {
    width: 30% !important;
}

.ipb_sub_fields.check_sub_field .check_field:nth-child(2) label {
    text-align: right;
}

.ipb_submit_scriber {
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 20px;
}

.popup_lists svg {
    position: relative;
    width: 10%;
    top: 3px;
}

.sub_message p.success {
    display: none;
    font-size: 18px;
    background: #00c700;
    width: fit-content;
    padding: 5px 30px;
    color: white;
    border-radius: 5px;
}

.sub_message a {

    color: yellow;
    font-weight: bold;
}

.sub_message p.error {

    background-color: red;
}

#sub_cancel_btn,
#ipb_new_user_btn,.sub_btn {
    text-decoration: none;
    cursor: pointer;
    color: #1E1F21;
    padding: 10px 35px;
    border: none;
    background: #D8E7FB;
    border-radius: 6px;
    font-size: 18px;
}
button.sub_btn {
    display: flex;
    margin: 0 auto;
}

input#ipb_new_user_btn,.sub_btn  {
    background: #1A73E8;
    color: white;
}

.check_sub_field .slider:before {
    width: 32px;
    background: #00000042;
    height: 32px;
    bottom: 1px;
    left: 2px;
}

input#ipb_privacy_policy:after {
    content: '';
    width: 6px;
    height: 14px;
    border-width: 0px 3px 3px 0px;
    position: absolute;
    display: block;
    border-style: solid;
    border-color: #fdfdfd;
    transform: rotate(46deg);
    top: 0px;
    left: 4px;
}

input#ipb_privacy_policy:before {
    position: absolute;
    content: '';
    width: 25px !important;
    height: 25px !important;
    background: #03e334;
    border-radius: 0px;
    left: 0;
}

input#ipb_privacy_policy {
    pointer-events: none;
    appearance: none;
    position: relative;
    width: 25px;
    border: none;
    height: 25px;
    background: transparent !important;
    box-shadow: none !important;
}

.ipb_sub_import a{

    color:black;
}

input#ipb_privacy_policy:after:checked:after {
    left: 6px;
    opacity: 1;
}

td.is_sub {
    color: #1a73e8;
}

div#ipb_sub_import_csv {
    max-width: 400px !important;
}

/* #ipb_new_subscriber_{

    display: none;
} */

/**
 * Template Selection Modal Styles
 */
#subscription-template-modal {
    position: fixed !important;
    top: 10% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 800px !important;
    height: auto !important;
    background: none !important;
    z-index: 999999 !important;
    display: none !important;
    transition: all 0.3s ease !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    /* Override blocker styles from main modal.css */
    right: auto !important;
    bottom: auto !important;
    padding: 0 !important;
    box-sizing: content-box !important;
    overflow: visible !important;
    text-align: left !important;
}

/* Ensure no blocker overlay is applied */
#subscription-template-modal:before {
    display: none !important;
    content: none !important;
}

/* Override any modal library blocker styles */
.blocker #subscription-template-modal,
#subscription-template-modal.blocker {
    position: fixed !important;
    top: 10% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 800px !important;
    height: auto !important;
    background: none !important;
    background-color: transparent !important;
    right: auto !important;
    bottom: auto !important;
    padding: 0 !important;
    box-sizing: content-box !important;
    overflow: visible !important;
    text-align: left !important;
}

/* Prevent blocker pseudo-element */
.blocker #subscription-template-modal:before,
#subscription-template-modal.blocker:before {
    display: none !important;
    content: none !important;
}

#subscription-template-modal.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    background: none !important;
    background-color: transparent !important;
}

.template-selection-modal .modal-content {
    background: #ffffff;
    border-radius: 8px;
    max-width: 800px;
    max-height: 85vh;
    width: 800px;
    position: relative;
    overflow: hidden;
    box-shadow: none;
    border: 1px solid #ddd;
    transition: transform 0.3s ease;
}

#subscription-template-modal.show .modal-content {
    transform: none;
}

.template-selection-modal .modal-header {
    padding: 20px 25px;
    border-bottom: 1px solid #eee;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #fff;
}

.template-selection-modal .modal-header h3 {
    margin: 0;
    font-size: 20px;
    color: #333;
    font-weight: 600;
}

.template-selection-modal .close-modal {
    font-size: 24px;
    cursor: pointer;
    color: #999;
    background: none;
    border: none;
    padding: 0;
    line-height: 1;
    transition: color 0.3s ease;
}

.template-selection-modal .close-modal:hover {
    color: #333;
}

.template-selection-modal .modal-body {
    padding: 0;
    max-height: calc(85vh - 80px);
    overflow-y: auto;
    background: #fff;
}

/* Template Selection Content */
.template-selection-modal .template_selection_wrapper {
    margin: 0;
    padding: 25px;
    max-width: none;
}

.template-selection-modal .ipb_new_heading {
    margin-bottom: 20px;
    text-align: center;
}

.template-selection-modal .ipb_new_heading h3 {
    display: none; /* Hide since we have it in modal header */
}

.template-selection-modal .ipb_new_heading p {
    font-size: 14px;
    color: #666;
    margin: 0;
}

.template-selection-modal .ipb_template_search {
    margin-bottom: 25px;
    display: flex;
    justify-content: center;
}

.template-selection-modal .ipb_ext_search {
    max-width: 300px;
    width: 100%;
}

.template-selection-modal .ipb_ext_search input {
    padding: 10px 15px;
    font-size: 14px;
    border-radius: 6px;
    border: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
}

/* Force exactly 3 columns */
.template-selection-modal .subscription_templates_grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Exactly 3 columns */
    gap: 20px;
    margin-bottom: 25px;
}

.template-selection-modal .template_card {
    background: #fff;
    border-radius: 8px;
    box-shadow: none;
    transition: transform 0.3s ease;
    overflow: hidden;
    cursor: pointer;
    border: 1px solid #e5e5e5;
}

.template-selection-modal .template_card:hover {
    transform: translateY(-2px);
    box-shadow: none;
    border-color: #007cba;
}

.template-selection-modal .template_preview {
    height: 160px;
    overflow: hidden;
    position: relative;
    background: #f8f9fa;
}

.template-selection-modal .template-preview-img {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.template-selection-modal .preview-content {
    text-align: center;
    width: 80%;
    transform: scale(0.75);
}

.template-selection-modal .preview-title {
    font-size: 11px;
    font-weight: 600;
    margin-bottom: 8px;
    color: #333;
}

.template-selection-modal .preview-form {
    display: flex;
    flex-direction: column;
    gap: 5px;
    align-items: center;
}

.template-selection-modal .preview-input {
    width: 100%;
    height: 8px;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.1);
}

.template-selection-modal .preview-button {
    width: 60%;
    height: 12px;
    border-radius: 6px;
    background: #007cba;
    margin-top: 4px;
}

.template-selection-modal .template_overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.75);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.template-selection-modal .template_card:hover .template_overlay {
    opacity: 1;
}

.template-selection-modal .preview_btn,
.template-selection-modal .select_btn {
    padding: 8px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 600;
    font-size: 12px;
    transition: all 0.3s ease;
    text-decoration: none;
}

.template-selection-modal .preview_btn {
    background: #fff;
    color: #333;
}

.template-selection-modal .select_btn {
    background: #007cba;
    color: #fff;
}

.template-selection-modal .template_info {
    padding: 15px;
    background: #fff;
}

.template-selection-modal .template_info h4 {
    margin: 0 0 6px 0;
    font-size: 15px;
    color: #333;
    font-weight: 600;
}

.template-selection-modal .template_info p {
    margin: 0 0 10px 0;
    color: #666;
    line-height: 1.4;
    font-size: 12px;
}

.template-selection-modal .template_features {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.template-selection-modal .feature_tag {
    background: #f0f8ff;
    color: #007cba;
    padding: 3px 7px;
    border-radius: 12px;
    font-size: 10px;
    font-weight: 500;
}

.template-selection-modal .blank_template_section {
    border-top: 1px solid #eee;
    padding-top: 20px;
    margin-top: 10px;
    display: flex;
    justify-content: center;
}

.template-selection-modal .blank_template .template_preview {
    background: #f9f9f9;
    display: flex;
    align-items: center;
    justify-content: center;
}

.template-selection-modal .blank_icon {
    font-size: 32px;
    color: #ccc;
}

.template-selection-modal .blank_template:hover .blank_icon {
    color: #007cba;
}

/* Make sure modal appears above everything */
body.modal-open {
    /* overflow: hidden; */ /* Removed to allow background interaction */
}

.template-selection-modal .template_preview_modal {
    z-index: 1000000;
}

/* Responsive - stack to 2 columns on tablets, 1 on mobile */
@media (max-width: 900px) {
    .template-selection-modal .subscription_templates_grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }
}

@media (max-width: 600px) {
    .template-selection-modal .modal-content {
        width: 95%;
        max-width: 500px;
    }

    .template-selection-modal .subscription_templates_grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .template-selection-modal .template_selection_wrapper {
        padding: 20px 15px;
    }
}

/* Animation classes */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

/* @keyframes slideIn {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(-20px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
} */

#subscription-template-modal .modal-content {
    /* animation: slideIn 0.3s ease-out; */ /* Removed animation */
}

/* Enhanced Form styles moved to admin/css/forms.css */

/* Enhanced Form Styles */
.ipb_form_header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px 40px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    border-bottom: 1px solid #e5e7eb;
}

.ipb_form_header h1 {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    color: white;
}

.ipb_form_container {
    padding: 40px;
    background: #fafbfc;
}

.ipb_enhanced_form {
    background: white;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.ipb_form_sections {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ipb_form_section {
    padding: 30px 40px;
    border-bottom: 1px solid #f1f5f9;
}

.ipb_form_section:last-child {
    border-bottom: none;
}

.ipb_section_header {
    margin-bottom: 24px;
    padding-bottom: 16px;
    border-bottom: 2px solid #f1f5f9;
}

.ipb_section_header h3 {
    margin: 0 0 8px 0;
    font-size: 20px;
    font-weight: 600;
    color: #1e293b;
    display: flex;
    align-items: center;
    gap: 10px;
}

.ipb_section_header h3 i {
    color: #4f46e5;
    font-size: 18px;
}

.ipb_section_header p {
    margin: 0;
    font-size: 14px;
    color: #64748b;
}

.ipb_form_grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 24px;
}

.ipb_form_group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ipb_form_group_full {
    grid-column: 1 / -1;
}

.ipb_form_label {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 4px;
}

.ipb_form_label .required {
    color: #dc2626;
    margin-left: 2px;
}

.ipb_form_input,
.ipb_form_select {
    padding: 12px 16px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    transition: all 0.3s ease;
    background: white;
    font-family: inherit;
}

.ipb_form_input:focus,
.ipb_form_select:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.ipb_form_input.ipb_field_invalid,
.ipb_form_select.ipb_field_invalid {
    border-color: #dc2626;
    box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.1);
}

.ipb_form_input[readonly] {
    background: #f8fafc;
    color: #64748b;
    cursor: not-allowed;
}

.ipb_field_error {
    font-size: 12px;
    color: #dc2626;
    margin-top: 4px;
    display: none;
}

.ipb_field_help {
    font-size: 12px;
    color: #64748b;
    margin-top: 4px;
}

/* Enhanced Toggle Switches */
.ipb_toggle_container {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ipb_toggle_switch {
    position: relative;
    display: inline-block;
    width: 48px;
    height: 24px;
}

.ipb_toggle_switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.ipb_toggle_label {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #cbd5e1;
    transition: 0.3s;
    border-radius: 24px;
    display: block;
}

.ipb_toggle_slider {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background: white;
    transition: 0.3s;
    border-radius: 50%;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.ipb_toggle_switch input:checked + .ipb_toggle_label {
    background: #4f46e5;
}

.ipb_toggle_switch input:checked + .ipb_toggle_label .ipb_toggle_slider {
    transform: translateX(24px);
}

.ipb_toggle_text {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
}

/* Form Actions */
.ipb_form_actions {
    display: flex;
    justify-content: flex-end;
    gap: 16px;
    padding: 30px 40px;
    background: #f8fafc;
    border-top: 1px solid #e5e7eb;
}

/* Messages */
.ipb_form_messages {
    padding: 0 40px 30px 40px;
}

.ipb_message {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 16px;
}

.ipb_message_success {
    background: #d1fae5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.ipb_message_error {
    background: #fee2e2;
    color: #991b1b;
    border: 1px solid #fca5a5;
}

.ipb_message i {
    font-size: 16px;
}

/* Responsive Form Styles */
@media (max-width: 768px) {
    .ipb_form_header {
        flex-direction: column;
        gap: 16px;
        text-align: center;
        padding: 20px 30px;
    }

    .ipb_form_container {
        padding: 20px;
    }

    .ipb_form_section {
        padding: 20px 30px;
    }

    .ipb_form_grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .ipb_form_actions {
        flex-direction: column;
        padding: 20px 30px;
    }

    .ipb_form_actions .ipb_btn {
        width: 100%;
        justify-content: center;
    }

    .ipb_form_messages {
        padding: 0 30px 20px 30px;
    }
}

@media (max-width: 480px) {
    .ipb_form_header h1 {
        font-size: 24px;
    }

    .ipb_form_section {
        padding: 16px 20px;
    }

    .ipb_section_header h3 {
        font-size: 18px;
    }

    .ipb_form_actions {
        padding: 16px 20px;
    }

    .ipb_form_messages {
        padding: 0 20px 16px 20px;
    }
}

/* Integration Platform Styles */

/* Integration Platform Styles */
.integration-header {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    padding: 30px 40px;
    border-radius: 12px 12px 0 0;
    margin-bottom: 0;
}

.integration-title {
    margin: 0;
    font-size: 28px;
    font-weight: 600;
    color: white;
    display: flex;
    align-items: center;
    gap: 12px;
}

.integration-subtitle {
    margin: 8px 0 0 0;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.9);
}

.integration-container {
    background: white;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    padding: 30px 40px;
}

.integration-section {
    margin-bottom: 40px;
}

.section-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 25px;
    font-size: 22px;
    font-weight: 600;
    color: #1e293b;
}

.platform-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.platform-card {
    position: relative;
    border: 2px solid #e5e7eb;
    border-radius: 12px;
    padding: 0;
    background: white;
    transition: all 0.3s ease;
    cursor: pointer;
    overflow: hidden;
}

.platform-card:hover {
    border-color: #667eea;
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.15);
    transform: translateY(-2px);
}

.platform-card.active {
    border-color: #667eea;
    background: linear-gradient(135deg, #f8faff 0%, #f1f5ff 100%);
    box-shadow: 0 8px 25px rgba(102, 126, 234, 0.2);
}

.platform-card input[type="radio"] {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.platform-label {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 30px 20px;
    height: 100%;
    cursor: pointer;
    margin: 0;
}

.platform-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border-radius: 50%;
    margin-bottom: 20px;
    transition: all 0.3s ease;
}

.platform-card:hover .platform-icon {
    transform: scale(1.1);
}

.platform-icon .dashicons {
    font-size: 24px;
    color: white;
    line-height: 1;
}

.platform-info {
    text-align: center;
}

.platform-info h3 {
    margin: 0 0 8px 0;
    font-size: 18px;
    font-weight: 600;
    color: #1e293b;
    line-height: 1.3;
}

.platform-info p {
    margin: 0;
    font-size: 14px;
    color: #64748b;
    line-height: 1.4;
}

.platform-card.active .platform-info h3 {
    color: #667eea;
}

.platform-card.active .platform-info p {
    color: #475569;
}

/* Integration Settings Styles */
.integration-settings {
    background: #f8fafc;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 25px;
}

.settings-title {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 600;
    color: #1e293b;
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 15px;
}

.settings-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.form-group label {
    font-size: 14px;
    font-weight: 600;
    color: #374151;
}

.form-group input,
.form-group select {
    padding: 12px 15px;
    border: 2px solid #e5e7eb;
    border-radius: 8px;
    font-size: 14px;
    transition: all 0.3s ease;
    background: white;
}

.form-group input:focus,
.form-group select:focus {
    outline: none;
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.help-text {
    font-size: 13px;
    color: #64748b;
    margin: 0;
    font-style: italic;
}

.form-actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 20px;
    border-top: 1px solid #e5e7eb;
    margin-top: 30px;
}

.form-actions .button {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.form-actions .button-primary {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    color: white;
}

.form-actions .button-primary:hover {
    background: linear-gradient(135deg, #5a67d8 0%, #6b46c1 100%);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
}

/* Responsive Design */
@media (max-width: 768px) {
    .integration-header {
        padding: 20px;
    }

    .integration-container {
        padding: 20px;
    }

    .platform-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .settings-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    .integration-title {
        font-size: 24px;
    }

    .platform-label {
        padding: 25px 15px;
    }

    .platform-icon {
        width: 50px;
        height: 50px;
        margin-bottom: 15px;
    }

    .platform-icon .dashicons {
        font-size: 20px;
    }
}

@media (max-width: 480px) {
    .integration-header {
        padding: 15px;
    }

    .integration-container {
        padding: 15px;
    }

    .integration-title {
        font-size: 20px;
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }

    .platform-label {
        padding: 20px 10px;
    }

    .platform-info h3 {
        font-size: 16px;
    }

    .platform-info p {
        font-size: 13px;
    }
}

/* Settings Modal styles moved to admin/css/settings-modal.css */

/* Settings Modal Styles */
.ipb_settings_form {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.ipb_settings_section {
    margin-bottom: 25px;
    padding: 20px;
    background: #f8fafc;
    border-radius: 8px;
    border: 1px solid #e5e7eb;
}

.ipb_settings_section:last-child {
    margin-bottom: 0;
}

.ipb_settings_section h4 {
    margin: 0 0 15px 0;
    font-size: 16px;
    color: #1e293b;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ipb_settings_section h4 i {
    color: #667eea;
}

.ipb_setting_group {
    margin-bottom: 15px;
}

.ipb_setting_group:last-child {
    margin-bottom: 0;
}

.ipb_setting_group label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #374151;
    margin-bottom: 8px;
}

.ipb_setting_group select {
    width: 100%;
    max-width: 200px;
    padding: 8px 12px;
    border: 2px solid #e5e7eb;
    border-radius: 6px;
    font-size: 14px;
    background: white;
    transition: all 0.3s ease;
}

.ipb_setting_group select:focus {
    outline: none;
    border-color: #4f46e5;
    box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.1);
}

.ipb_setting_description {
    margin: 6px 0 0 0;
    font-size: 12px;
    color: #6b7280;
    line-height: 1.4;
}

.ipb_checkbox_label {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    cursor: pointer;
    padding: 8px 0;
}

.ipb_checkbox_label input[type="checkbox"] {
    margin: 0;
    width: 16px;
    height: 16px;
    accent-color: #4f46e5;
}

.ipb_checkbox_label span {
    font-size: 14px;
    font-weight: 500;
    color: #374151;
    line-height: 1.4;
}

/* Settings icon hover effect */
.ipb_header_actions .ipb_btn[title="Settings"]:hover {
    background: #f3f4f6;
    border-color: #9ca3af;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Responsive settings modal */
@media (max-width: 768px) {
    .ipb_settings_section {
        padding: 15px;
        margin-bottom: 20px;
    }

    .ipb_setting_group select {
        max-width: 100%;
    }

    .ipb_checkbox_label {
        align-items: center;
    }
}

/* Column visibility improvements */
.ipb_subscribers_table th,
.ipb_subscribers_table td {
    transition: all 0.3s ease;
}

.ipb_subscribers_table th:not(.ipb_checkbox_column),
.ipb_subscribers_table td:not(:first-child) {
    min-width: 120px;
}

.ipb_subscribers_table .ipb_checkbox_column {
    width: 40px;
    min-width: 40px;
}

.ipb_subscribers_table .ipb_actions_column {
    width: 120px;
    min-width: 120px;
}

/* Settings modal improvements */
.ipb_settings_section .ipb_setting_group {
    border-bottom: 1px solid #e5e7eb;
    padding-bottom: 12px;
    margin-bottom: 12px;
}

.ipb_settings_section .ipb_setting_group:last-child {
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.ipb_settings_section .ipb_setting_description {
    margin-top: 8px;
    padding-left: 26px; /* Align with checkbox text */
}

/* Column visibility section styling */
.ipb_settings_section h4 i.fa-columns {
    color: #8b5cf6;
}

.ipb_settings_section .ipb_setting_group .ipb_checkbox_label {
    margin-bottom: 0;
}

.ipb_settings_section .ipb_setting_group .ipb_checkbox_label span {
    font-weight: 500;
}

/* Bulk actions campaign selection */
.ipb_campaign_selection {
    display: inline-block;
    margin-left: 10px;
    vertical-align: middle;
}

.ipb_campaign_selection select {
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    background-color: #ffffff;
    font-size: 14px;
    min-width: 200px;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
}

.ipb_campaign_selection select:focus {
    outline: none;
    border-color: #3b82f6;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
}

.ipb_campaign_selection select:hover {
    border-color: #9ca3af;
}

.ipb_campaign_help {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: #6b7280;
    font-style: italic;
}

/* Enhanced bulk actions layout */
.ipb_bulk_actions {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    padding: 15px;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 8px;
    margin-bottom: 20px;
}

.ipb_bulk_actions select[name="bulk_action"] {
    min-width: 150px;
}

.ipb_bulk_actions .ipb_btn {
    white-space: nowrap;
}

/* Responsive bulk actions */
@media (max-width: 768px) {
    .ipb_bulk_actions {
        flex-direction: column;
        align-items: stretch;
    }

    .ipb_campaign_selection {
        margin-left: 0;
        margin-top: 10px;
    }

    .ipb_campaign_selection select {
        width: 100%;
        min-width: auto;
    }
}

.hover-button {
  position: relative;
  overflow: hidden;
}

.hover-button span {
  transition: transform 0.3s ease;
}

.hover-button::after {
  content: "Upgrade Pro";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.hover-button:hover span {
  transform: translateY(-100%);
  opacity: 0;
}

.hover-button:hover::after {
  opacity: 1;
  transform: translateY(0);
}

.wrap.instant-popup-configuration table {
    table-layout : unset !important;
}
button#create-new-campaign{
    padding: 4px 10px !important;
}
/*button#create-new-campaign span.dashicons.dashicons-plus-alt {*/
/*    position: relative;*/
/*    top: 5px;*/
/*}*/
.newsletter-section .section-title {
    display: block !important;
}
