/* ============================================
   FLASH SALE ADMIN STYLES
   Gộp từ admin.css và admin-enhancements.css
   ============================================ */

/* Recurring slot styles */
.recurring-slot {
    background   : #f9f9f9;
    padding      : 15px;
    margin-bottom: 15px;
    border       : 1px solid #ddd;
    border-radius: 4px;
}

.time-inputs {
    margin-bottom: 10px;
}

.day-checkboxes {
    margin-bottom: 10px;
}

.day-checkbox {
    margin-right: 10px;
    display     : inline-block;
}

.remove-slot {
    margin-top: 10px;
}

/* Timeslot styles */
.timeslot {
    background   : #f9f9f9;
    padding      : 15px;
    margin-bottom: 15px;
    border       : 1px solid #ddd;
    border-radius: 4px;
}

.remove-timeslot {
    margin-top: 10px;
}

/* Variations management styles */
.variations-container {
    background   : #f9f9f9;
    border       : 1px solid #ddd;
    border-radius: 4px;
    margin-top   : 10px;
}

.variations-container h4 {
    margin-top   : 0;
    margin-bottom: 10px;
    color        : #333;
}

.variations-table {
    margin-top: 15px;
}

.variations-table th,
.variations-table td {
    padding       : 8px 12px;
    vertical-align: middle;
}

.variation-attributes {
    font-size : 12px;
    color     : #666;
    margin-top: 4px;
}

.variation-attributes .attribute {
    display      : inline-block;
    margin-right : 10px;
    background   : #e0e0e0;
    padding      : 2px 6px;
    border-radius: 3px;
}

.status-specific {
    color      : #46b450;
    font-weight: bold;
}

.status-parent {
    color     : #666;
    font-style: italic;
}

/* Improved variations panel layout */
.variations-panel {
    display   : none;
    margin-top: 0;
    border    : none;
    padding   : 0;
    background: transparent;
}

.variations-panel.show {
    display: block;
}

.manage-variations {
    margin-bottom: 5px;
}

.not-applicable {
    color     : #999;
    font-style: italic;
}

.variation-discount-type,
.variation-discount-value,
.variation-limit-quantity {
    width    : 100%;
    max-width: 120px;
}

.variation-row input[type="number"] {
    padding: 4px 6px;
}

.variation-row select {
    padding: 4px 6px;
}

/* Admin notice styles for variations */
.notice.notice-success {
    border-left-color: #46b450;
}

.notice.notice-error {
    border-left-color: #dc3232;
}

/* Product table improvements */
.product-table th:nth-child(6),
.product-table td:nth-child(6) {
    text-align: center;
    width     : 120px;
}

.product-table .manage-variations {
    white-space: nowrap;
}

/* Product table with expandable variations */
.product-table {
    border-collapse: separate;
    border-spacing : 0;
}

.product-row.has-variations {
    border-bottom: none;
}

.variations-row {
    display    : none;
    background : #f8f9fa;
    border-left: 4px solid #0073aa;
}

.variations-row.show {
    display: table-row;
}

.variations-row td {
    border-bottom: 1px solid #f0f0f1;
}

.variations-row .variations-container {
    margin       : 0;
    border       : none;
    border-radius: 0;
    background   : transparent;
}

.variations-row .variations-container h4 {
    background    : linear-gradient(135deg, #0073aa, #005a87);
    color         : white;
    padding       : 10px 16px;
    margin        : 0 0 15px 0;
    border-radius : 6px;
    font-size     : 14px;
    font-weight   : 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.variations-row .variations-table {
    background   : white;
    border       : 1px solid #dee2e6;
    border-radius: 6px;
    overflow     : hidden;
    box-shadow   : 0 2px 4px rgba(0, 0, 0, 0.05);
}

.variations-row .variations-table th {
    background   : linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-bottom: 2px solid #dee2e6;
    padding      : 12px;
    font-weight  : 600;
    color        : #495057;
}

.variations-row .variations-table td {
    padding      : 12px;
    border-bottom: 1px solid #f0f0f1;
    background   : white;
}

.variations-row .variations-table .variation-row:hover {
    background: #f8fcff;
}

/* Loading states */
.variations-container .loading {
    text-align: center;
    padding   : 20px;
    color     : #666;
}

.variations-container .error {
    color        : #dc3232;
    font-weight  : bold;
    padding      : 10px;
    background   : #fbeaea;
    border       : 1px solid #dc3232;
    border-radius: 3px;
}

/* ============================================
   ACCORDION INTERFACE STYLES (DASHBOARD)
   Đã loại bỏ các hiệu ứng animations/transitions
   ============================================ */

/* Container for all campaigns */
.campaigns-accordion-container {
    margin-top: 20px;
}

/* No campaigns state */
.no-campaigns {
    text-align   : center;
    padding      : 60px 20px;
    background   : #fff;
    border       : 1px solid #ddd;
    border-radius: 8px;
    box-shadow   : 0 1px 3px rgba(0, 0, 0, 0.1);
}

.no-campaigns p {
    font-size    : 16px;
    color        : #666;
    margin-bottom: 20px;
}

/* Individual campaign accordion item - NO ANIMATIONS */
.campaign-accordion-item {
    background   : #fff;
    border       : 1px solid #ddd;
    border-radius: 8px;
    margin-bottom: 16px;
    box-shadow   : 0 1px 3px rgba(0, 0, 0, 0.1);
}

.campaign-accordion-item:hover {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}

.campaign-accordion-item.expanded {
    box-shadow  : 0 4px 20px rgba(0, 115, 170, 0.15);
    border-color: #0073aa;
}

/* Campaign header - always visible */
.campaign-header {
    padding      : 20px;
    cursor       : pointer;
    border-radius: 8px 8px 0 0;
    position     : relative;
}

.campaign-header:hover {
    background-color: #f8f9fa;
}

.campaign-header-content {
    display        : flex;
    justify-content: space-between;
    align-items    : center;
    gap            : 20px;
}

/* Basic campaign info section */
.campaign-basic-info {
    flex     : 1;
    min-width: 0;
}

.campaign-title-section {
    display      : flex;
    align-items  : center;
    gap          : 12px;
    margin-bottom: 8px;
}

.accordion-toggle-icon {
    color    : #666;
    font-size: 16px;
}

.campaign-accordion-item.expanded .accordion-toggle-icon {
    transform: rotate(90deg);
}

.campaign-name {
    margin     : 0;
    font-size  : 18px;
    font-weight: 600;
    color      : #333;
    flex       : 1;
    background : transparent !important;
}

.campaign-status {
    padding       : 4px 12px;
    border-radius : 20px;
    font-size     : 12px;
    font-weight   : 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.campaign-status.status-active {
    background: #d4edda;
    color     : #155724;
    border    : 1px solid #c3e6cb;
}

.campaign-status.status-inactive {
    background: #f8d7da;
    color     : #721c24;
    border    : 1px solid #f5c6cb;
}

.campaign-meta {
    display  : flex;
    gap      : 20px;
    flex-wrap: wrap;
}

.meta-item {
    display      : flex;
    align-items  : center;
    gap          : 6px;
    color        : #666;
    font-size    : 14px;
    background   : rgba(255, 255, 255, 0.5);
    padding      : 6px 10px;
    border-radius: 15px;
    border       : 1px solid rgba(0, 0, 0, 0.1);
}

.meta-item:hover {
    background: rgba(255, 255, 255, 0.8);
}

.meta-item .dashicons {
    font-size: 16px;
}

/* Campaign actions section */
.campaign-actions {
    display       : flex;
    flex-direction: column;
    gap           : 12px;
    align-items   : flex-end;
}

.shortcode-section {
    display    : flex;
    align-items: center;
    gap        : 8px;
}

.shortcode-display {
    background   : #f1f1f1;
    padding      : 6px 10px;
    border-radius: 4px;
    font-family  : 'Courier New', monospace;
    font-size    : 12px;
    color        : #333;
    border       : 1px solid #ddd;
    max-width    : 300px;
    overflow     : hidden;
    text-overflow: ellipsis;
    white-space  : nowrap;
}

.copy-shortcode {
    min-width      : auto;
    width          : 32px;
    height         : 32px;
    display        : flex !important;
    align-items    : center;
    justify-content: center;
}

.copy-shortcode:focus {
    box-shadow: 0 0 0 2px #0073aa;
}

.copy-shortcode.success {
    background-color: #46b450;
    border-color    : #46b450;
    color           : #fff;
}

.copy-shortcode.error {
    background-color: #dc3232;
    border-color    : #dc3232;
    color           : #fff;
}

.action-buttons {
    display: flex;
    gap    : 8px;
}

/* Expandable content - NO ANIMATIONS */
.campaign-details {
    border-top   : 1px solid #eee;
    background   : #fafafa;
    border-radius: 0 0 8px 8px;
    overflow     : hidden;
}

.campaign-accordion-item.expanded .campaign-details {
    display: block;
}

.campaign-details-content {
    padding: 24px;
}

/* Detail sections */
.detail-section {
    margin-bottom: 28px;
    border-radius: 8px;
    overflow     : hidden;
    box-shadow   : 0 2px 4px rgba(0, 0, 0, 0.05);
}

.detail-section:last-child {
    margin-bottom: 0;
}

.detail-section h4 {
    margin        : 0;
    font-size     : 14px;
    font-weight   : 600;
    color         : white;
    padding       : 12px 16px;
    background    : linear-gradient(135deg, #0073aa, #005a87);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    display       : block;
    position      : relative;
}

.detail-content {
    background   : #fff;
    border       : 1px solid #ddd;
    border-radius: 0;
    padding      : 16px;
    margin       : 0;
}

/* Schedule section */
.schedule-item {
    display      : flex;
    align-items  : center;
    gap          : 12px;
    margin-bottom: 12px;
    padding      : 12px 16px;
    background   : linear-gradient(90deg, #f8f9fa, #ffffff);
    border-radius: 6px;
    border       : 1px solid #e9ecef;
}

.schedule-item:last-child {
    margin-bottom: 0;
    border-bottom: none;
}

.schedule-item strong {
    min-width: 60px;
    color    : #333;
}

.timeslots-list {
    display: grid;
    gap    : 12px;
}

.timeslot-item {
    display      : flex;
    align-items  : center;
    gap          : 12px;
    padding      : 12px;
    background   : linear-gradient(135deg, #f8f9fa, #e9ecef);
    border       : 1px solid #dee2e6;
    border-radius: 6px;
    position     : relative;
}

.timeslot-item::before {
    content   : '';
    position  : absolute;
    left      : 0;
    top       : 0;
    width     : 4px;
    height    : 100%;
    background: linear-gradient(180deg, #0073aa, #005a87);
}

.time-range {
    font-weight: 600;
    color      : #333;
    min-width  : 120px;
}

.active-days {
    color    : #666;
    font-size: 14px;
}

/* Products section */
.products-table-wrapper {
    overflow-x: auto;
}

.products-detail-table {
    margin         : 0;
    border-collapse: collapse;
    box-shadow     : 0 2px 8px rgba(0, 0, 0, 0.1);
    border-radius  : 8px;
    overflow       : hidden;
}

.products-detail-table th,
.products-detail-table td {
    padding       : 12px;
    text-align    : left;
    border-bottom : 1px solid #eee;
    vertical-align: middle;
}

.products-detail-table th {
    background   : linear-gradient(135deg, #f8f9fa, #e9ecef);
    font-weight  : 600;
    color        : #333;
    border-bottom: 2px solid #dee2e6;
    position     : relative;
}

.products-detail-table th::after {
    content   : '';
    position  : absolute;
    bottom    : 0;
    left      : 0;
    width     : 100%;
    height    : 2px;
    background: linear-gradient(90deg, #0073aa, #005a87);
}

.products-detail-table tbody tr:hover {
    background: linear-gradient(90deg, #f8f9fa, #ffffff);
}

.product-info {
    display       : flex;
    flex-direction: column;
    gap           : 4px;
}

.product-sku {
    font-size: 12px;
    color    : #666;
}

.discount-value {
    font-weight  : 600;
    color        : #dc3545;
    background   : #fff5f5;
    padding      : 4px 8px;
    border-radius: 4px;
    border       : 1px solid #fecaca;
    display      : inline-block;
}

.limit-quantity,
.sold-quantity {
    font-weight: 500;
    color      : #333;
}

/* Progress bar */
.progress-bar {
    width        : 100px;
    height       : 20px;
    background   : linear-gradient(180deg, #e9ecef, #dee2e6);
    border-radius: 10px;
    position     : relative;
    overflow     : hidden;
    box-shadow   : inset 0 1px 3px rgba(0, 0, 0, 0.2);
}

.progress-fill {
    height       : 100%;
    background   : linear-gradient(135deg, #28a745, #20c997, #17a2b8);
    border-radius: 10px;
    position     : relative;
    box-shadow   : inset 0 1px 2px rgba(255, 255, 255, 0.3);
}

.progress-text {
    position   : absolute;
    top        : 50%;
    left       : 50%;
    transform  : translate(-50%, -50%);
    font-size  : 11px;
    font-weight: 600;
    color      : #333;
    text-shadow: 0 1px 2px rgba(255, 255, 255, 0.8);
}

.no-limit,
.no-products {
    color     : #6c757d;
    font-style: italic;
}

/* Settings section */
.settings-grid {
    display              : grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap                  : 16px;
}

.setting-item {
    display      : flex;
    align-items  : center;
    gap          : 12px;
    padding      : 12px;
    background   : linear-gradient(135deg, #f8f9fa, #ffffff);
    border-radius: 6px;
    border       : 1px solid #dee2e6;
    position     : relative;
}

.setting-item label {
    font-weight: 600;
    color      : #495057;
    min-width  : 100px;
    margin     : 0;
}

.setting-item span {
    color      : #333;
    font-weight: 500;
}

.campaign-id {
    font-family  : 'Courier New', monospace;
    font-size    : 12px;
    background   : #e9ecef;
    padding      : 4px 8px;
    border-radius: 4px;
}

/* Bulk toggle buttons */
.bulk-toggle-buttons {
    display      : flex;
    gap          : 8px;
    margin-bottom: 16px;
    background   : linear-gradient(135deg, #ffffff, #f8f9fa);
    padding      : 12px;
    border-radius: 8px;
    border       : 1px solid #dee2e6;
    box-shadow   : 0 2px 4px rgba(0, 0, 0, 0.05);
}

.bulk-toggle-buttons .button {
    display    : flex;
    align-items: center;
    gap        : 6px;
    font-size  : 13px;
    background : linear-gradient(135deg, #ffffff, #f8f9fa);
    border     : 1px solid #dee2e6;
}

.bulk-toggle-buttons .dashicons {
    font-size: 16px;
}

/* Hover effects for interactive elements */
.campaign-header[data-toggle="accordion"]:hover .accordion-toggle-icon {
    color: #0073aa;
}

.campaign-header[data-toggle="accordion"]:hover .campaign-name {
    color: #0073aa;
}

/* Loading and error states */
.campaign-details .loading {
    text-align: center;
    padding   : 40px;
    color     : #666;
}

.campaign-details .error {
    text-align   : center;
    padding      : 20px;
    color        : #dc3545;
    background   : #f8d7da;
    border-radius: 6px;
    margin       : 16px;
}

/* Responsive design */
@media (max-width: 768px) {
    .campaign-header-content {
        flex-direction: column;
        align-items   : stretch;
        gap           : 16px;
    }

    .campaign-actions {
        align-items: stretch;
    }

    .action-buttons {
        justify-content: stretch;
    }

    .action-buttons .button {
        flex      : 1;
        text-align: center;
    }

    .shortcode-display {
        max-width: 100%;
    }

    .campaign-meta {
        flex-direction: column;
        gap           : 8px;
    }

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

    .setting-item {
        flex-direction: column;
        align-items   : flex-start;
        gap           : 8px;
    }

    .setting-item label {
        min-width: auto;
    }
}

/* Enhanced responsive design for mobile */
@media (max-width: 480px) {
    .campaign-header {
        padding: 16px;
    }

    .campaign-header-content {
        gap: 12px;
    }

    .campaign-title-section {
        gap: 8px;
    }

    .campaign-name {
        font-size: 16px;
    }

    .campaign-meta {
        gap: 12px;
    }

    .meta-item {
        font-size: 13px;
    }

    .shortcode-display {
        font-size: 11px;
        padding  : 4px 8px;
    }

    .bulk-toggle-buttons {
        flex-direction: column;
    }

    .bulk-toggle-buttons .button {
        justify-content: center;
    }
}

/* Focus indicators for better accessibility */
.campaign-header[data-toggle="accordion"]:focus-visible {
    outline       : 3px solid #0073aa;
    outline-offset: 2px;
}

.copy-shortcode:focus-visible {
    outline       : 3px solid #0073aa;
    outline-offset: 2px;
}

.bulk-toggle-buttons .button:focus-visible {
    outline       : 3px solid #0073aa;
    outline-offset: 2px;
}

/* Dark mode support */
@media (prefers-color-scheme: dark) {
    .campaign-accordion-item {
        background  : #2c3338;
        border-color: #3c434a;
    }

    .campaign-header:hover {
        background-color: #32373c;
    }

    .campaign-details {
        background: #23282d;
    }

    .detail-content {
        background  : #2c3338;
        border-color: #3c434a;
    }

    .shortcode-display {
        background  : linear-gradient(135deg, #3c434a, #32373c);
        border-color: #4a5055;
        color       : #f0f0f1;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .campaign-accordion-item {
        border: 2px solid #000;
    }

    .campaign-status.status-active {
        background: #00ff00;
        color     : #000;
        border    : 2px solid #000;
    }

    .campaign-status.status-inactive {
        background: #ff0000;
        color     : #fff;
        border    : 2px solid #000;
    }

    .detail-section h4 {
        background: #000;
        color     : #fff;
    }

    .progress-fill {
        background: #00ff00;
    }
}

/* ============================================
   EDIT/ADD CAMPAIGN PAGE STYLES
   ============================================ */

/* Main wrapper improvements */

.wrap h1.wp-heading-inline {
    font-size    : 24px;
    font-weight  : 600;
    color        : #333;
    margin-bottom: 8px;
}

.page-title-action {
    background     : linear-gradient(135deg, #0073aa, #005a87);
    border         : none;
    border-radius  : 6px;
    padding        : 8px 16px;
    color          : white;
    text-decoration: none;
    font-weight    : 500;
}

/* Form styling */
#campaign-form {
    background   : #fff;
    border-radius: 12px;
    box-shadow   : 0 2px 16px rgba(0, 0, 0, 0.08);
    overflow     : hidden;
    margin-top   : 20px;
    position     : relative;
}

/* Form table improvements */
.form-table {
    margin    : 0;
    background: linear-gradient(135deg, #fafafa, #ffffff);
}

.form-table th {
    background    : linear-gradient(135deg, #f8f9fa, #e9ecef);
    border-bottom : 1px solid #dee2e6;
    padding       : 20px;
    font-weight   : 600;
    color         : #495057;
    width         : 200px;
    vertical-align: top;
    position      : relative;
}

.form-table td {
    border-bottom: 1px solid #f0f0f1;
    background   : #fff;
}

.form-table tr:hover td {
    background: #f8f9fa;
}

/* Checkbox styling */
input[type="checkbox"] {
    width        : 18px;
    height       : 18px;
    accent-color : #0073aa;
    border-radius: 4px;
}

/* Description text */
.description {
    color        : #666;
    font-size    : 13px;
    font-style   : italic;
    margin-top   : 8px;
    padding      : 8px 12px;
    background   : rgba(0, 115, 170, 0.05);
    border-left  : 3px solid #0073aa;
    border-radius: 0 4px 4px 0;
}

/* Timeslot container */
#timeslots-container {
    background   : #f8f9fa;
    border-radius: 8px;
    padding      : 20px;
    border       : 1px solid #dee2e6;
}

.timeslot {
    background   : linear-gradient(135deg, #ffffff, #f8f9fa);
    border       : 1px solid #dee2e6;
    border-radius: 8px;
    padding      : 16px;
    margin-bottom: 16px;
    box-shadow   : 0 2px 8px rgba(0, 0, 0, 0.08);
    position     : relative;
}

.timeslot:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.timeslot::before {
    content      : '';
    position     : absolute;
    left         : 0;
    top          : 0;
    bottom       : 0;
    width        : 4px;
    background   : linear-gradient(180deg, #0073aa, #005a87);
    border-radius: 4px 0 0 4px;
}

.time-inputs {
    display              : grid;
    grid-template-columns: auto 1fr auto 1fr;
    gap                  : 12px;
    align-items          : center;
    margin-bottom        : 16px;
}

.time-inputs label {
    font-weight: 600;
    color      : #333;
}

.day-checkboxes {
    margin-bottom: 16px;
}

.day-checkboxes label {
    font-weight  : 600;
    color        : #333;
    margin-bottom: 8px;
    display      : block;
}

.day-checkbox {
    display      : inline-flex;
    align-items  : center;
    gap          : 6px;
    margin-right : 16px;
    padding      : 6px 12px;
    background   : linear-gradient(135deg, #f8f9fa, #e9ecef);
    border       : 2px solid #dee2e6;
    border-radius: 20px;
    cursor       : pointer;
}

.day-checkbox:hover {
    background: #e9ecef;
}

.day-checkbox input[type="checkbox"]:checked+span {
    color      : #0073aa;
    font-weight: 700;
    text-shadow: 0 1px 2px rgba(0, 115, 170, 0.3);
}

.add-timeslot,
.remove-timeslot {
    background    : linear-gradient(135deg, #28a745, #20c997);
    border        : none;
    border-radius : 6px;
    color         : white;
    padding       : 8px 16px;
    font-weight   : 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    cursor        : pointer;
    position      : relative;
    overflow      : hidden;
}

.remove-timeslot {
    background: linear-gradient(135deg, #dc3545, #c82333);
}

.add-timeslot:hover {
    background: linear-gradient(135deg, #218838, #1e7e34);
}

.remove-timeslot:hover {
    background: linear-gradient(135deg, #c82333, #bd2130);
}

/* Product section styling */
.product-container {
    background: #fff;
    padding   : 20px;
}

.product-table {
    margin         : 0;
    border-collapse: collapse;
    width          : 100%;
    position       : relative;
    overflow       : hidden;
}

.product-table::before {
    content   : '';
    position  : absolute;
    top       : 0;
    left      : 0;
    right     : 0;
    height    : 3px;
    background: linear-gradient(90deg, #0073aa, #005a87, #28a745, #dc3545);
    z-index   : 1;
}

.product-table th {
    background   : linear-gradient(135deg, #f8f9fa, #e9ecef);
    padding      : 16px 12px;
    font-weight  : 600;
    color        : #495057;
    border-bottom: 2px solid #dee2e6;
    text-align   : left;
}

.product-table td {
    border-bottom : 1px solid #f0f0f1;
    vertical-align: middle;
}

.product-table select,
.product-table input {
    width        : 100%;
    max-width    : 200px;
    padding      : 8px 12px;
    border       : 1px solid #dee2e6;
    border-radius: 6px;
    font-size    : 13px;
}

.product-table .button {
    padding      : 6px 12px;
    font-size    : 12px;
    border-radius: 4px;
    font-weight  : 500;
}

.add-product {
    background   : linear-gradient(135deg, #0073aa, #005a87);
    border       : none;
    color        : white;
    padding      : 12px 20px;
    border-radius: 6px;
    font-weight  : 500;
    cursor       : pointer;
    margin       : 16px;
}

.add-product:hover {
    background: linear-gradient(135deg, #005a87, #004166);
}

.remove-product {
    background: linear-gradient(135deg, #dc3545, #c82333);
    border    : none;
    color     : white;
}

.remove-product:hover {
    background: linear-gradient(135deg, #c82333, #bd2130);
}

.button-primary {
    background    : linear-gradient(135deg, #0073aa, #005a87);
    border        : none;
    border-radius : 8px;
    padding       : 12px 24px;
    font-size     : 14px;
    font-weight   : 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color         : white;
    cursor        : pointer;
    position      : relative;
    overflow      : hidden;
}

/* Select2 integration */
.select2-container {
    width: 100% !important;
}

.select2-container .select2-selection--single {
    height       : 40px;
    border       : 2px solid #e0e0e0;
    border-radius: 8px;
    background   : linear-gradient(135deg, #ffffff, #fafafa);
}

.select2-container .select2-selection--single .select2-selection__rendered {
    line-height : 36px;
    padding-left: 16px;
    color       : #333;
}

.select2-container .select2-selection--single .select2-selection__arrow {
    height: 36px;
    right : 16px;
}

.select2-container--default.select2-container--focus .select2-selection--single {
    border-color: #0073aa;
    box-shadow  : 0 0 0 3px rgba(0, 115, 170, 0.1);
    background  : linear-gradient(135deg, #ffffff, #f8fcff);
}

.select2-dropdown {
    border       : 2px solid #0073aa;
    border-radius: 8px;
    box-shadow   : 0 8px 25px rgba(0, 115, 170, 0.2);
}

.select2-results__option--highlighted {
    background: linear-gradient(135deg, #0073aa, #005a87);
    color     : white;
}

/* Loading overlay for form submission */
#campaign-form.submitting::after {
    content        : '';
    position       : absolute;
    top            : 0;
    left           : 0;
    right          : 0;
    bottom         : 0;
    background     : rgba(255, 255, 255, 0.9);
    display        : flex;
    align-items    : center;
    justify-content: center;
    z-index        : 1000;
}

#campaign-form.submitting::before {
    content      : '';
    width        : 40px;
    height       : 40px;
    border       : 4px solid #f3f3f3;
    border-top   : 4px solid #0073aa;
    border-radius: 50%;
    animation    : spin 1s linear infinite;
    z-index      : 1001;
    position     : absolute;
    top          : 50%;
    left         : 50%;
    transform    : translate(-50%, -50%);
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Success message styling */
.notice.notice-success {
    background   : linear-gradient(135deg, #d4edda, #c3e6cb);
    border-left  : 4px solid #28a745;
    border-radius: 8px;
    box-shadow   : 0 2px 8px rgba(40, 167, 69, 0.2);
}

/* Error message styling */
.notice.notice-error {
    background   : linear-gradient(135deg, #f8d7da, #f5c6cb);
    border-left  : 4px solid #dc3545;
    border-radius: 8px;
    box-shadow   : 0 2px 8px rgba(220, 53, 69, 0.2);
}

/* Responsive design for edit/add pages */
@media (max-width: 768px) {

    .form-table th,
    .form-table td {
        display: block;
        width  : 100%;
    }

    .form-table th {
        border-bottom: none;
        background   : linear-gradient(135deg, #0073aa, #005a87);
        color        : white;
        font-weight  : 600;
    }

    .time-inputs {
        grid-template-columns: 1fr;
        gap                  : 8px;
    }

    .day-checkbox {
        margin-bottom: 8px;
        margin-right : 8px;
    }

    .product-table {
        font-size: 12px;
    }

    .product-table th,
    .product-table td {
        padding: 8px;
    }
}

/* Focus states for accessibility */
.add-timeslot:focus,
.remove-timeslot:focus,
.add-product:focus,
.remove-product:focus,
.button-primary:focus {
    outline       : 3px solid rgba(0, 115, 170, 0.3);
    outline-offset: 2px;
}

/* Loading states */
.product-table .loading {
    opacity       : 0.6;
    pointer-events: none;
}

.product-table .loading::after {
    content      : '';
    position     : absolute;
    top          : 50%;
    left         : 50%;
    width        : 20px;
    height       : 20px;
    margin       : -10px 0 0 -10px;
    border       : 2px solid #f3f3f3;
    border-top   : 2px solid #0073aa;
    border-radius: 50%;
    animation    : spin 1s linear infinite;
}

/* Dark mode enhancements for edit page */
@media (prefers-color-scheme: dark) {
    #campaign-form {
        background  : #2c3338;
        border-color: #3c434a;
    }

    .form-table th {
        background: linear-gradient(135deg, #32373c, #2c3338);
        color     : #f0f0f1;
    }

    .form-table td {
        background  : #2c3338;
        border-color: #3c434a;
    }

    .timeslot {
        background  : linear-gradient(135deg, #32373c, #2c3338);
        border-color: #3c434a;
    }

    .product-table th {
        background: linear-gradient(135deg, #32373c, #2c3338);
        color     : #f0f0f1;
    }

    .product-table td {
        background  : #2c3338;
        border-color: #3c434a;
    }
}

/* Print styles */
@media print {
    .campaign-accordion-item {
        break-inside : avoid;
        box-shadow   : none;
        border       : 2px solid #000;
        margin-bottom: 20px;
    }

    .campaign-details {
        display: block !important;
    }

    .detail-section h4 {
        background                : #000 !important;
        color                     : #fff !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust        : exact;
    }

    .campaign-status {
        border                    : 1px solid #000 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust        : exact;
    }

    .action-buttons,
    .bulk-toggle-buttons {
        display: none;
    }

    .copy-shortcode {
        display: none;
    }

    .wrap {
        margin: 0;
    }

    .page-title-action,
    .add-timeslot,
    .remove-timeslot,
    .add-product,
    .remove-product {
        display: none;
    }

    #campaign-form {
        box-shadow: none !important;
        border    : 2px solid #000 !important;
        background: #fff !important;
    }

    .form-table th {
        background                : #f0f0f0 !important;
        color                     : #000 !important;
        -webkit-print-color-adjust: exact;
        print-color-adjust        : exact;
    }
}