.elementor-36 .elementor-element.elementor-element-fe4bcbf{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}.elementor-36 .elementor-element.elementor-element-fe4bcbf:not(.elementor-motion-effects-element-type-background), .elementor-36 .elementor-element.elementor-element-fe4bcbf > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-36 .elementor-element.elementor-element-fe4bcbf.e-con{--align-self:flex-start;}.elementor-36 .elementor-element.elementor-element-d282df5{text-align:center;}.elementor-36 .elementor-element.elementor-element-d282df5 .elementor-heading-title{color:#FFFFFF;}.elementor-36 .elementor-element.elementor-element-d806f8a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:center;--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-36 .elementor-element.elementor-element-e31be3f{--display:flex;border-style:solid;--border-style:solid;border-width:2px 2px 2px 2px;--border-top-width:2px;--border-right-width:2px;--border-bottom-width:2px;--border-left-width:2px;--border-radius:10px 10px 10px 10px;--padding-top:20px;--padding-bottom:20px;--padding-left:20px;--padding-right:20px;}.elementor-36 .elementor-element.elementor-element-e31be3f:not(.elementor-motion-effects-element-type-background), .elementor-36 .elementor-element.elementor-element-e31be3f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-36 .elementor-element.elementor-element-16f3b0d img{width:100px;}.elementor-36 .elementor-element.elementor-element-9513570{text-align:center;}.elementor-36 .elementor-element.elementor-element-9513570 .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:13px;font-weight:normal;color:var( --e-global-color-secondary );}.elementor-36 .elementor-element.elementor-element-2e36856{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:40px;--padding-left:0px;--padding-right:0px;}.elementor-36 .elementor-element.elementor-element-2e36856:not(.elementor-motion-effects-element-type-background), .elementor-36 .elementor-element.elementor-element-2e36856 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-secondary );}.elementor-36 .elementor-element.elementor-element-2e36856.e-con{--align-self:flex-start;}.elementor-36 .elementor-element.elementor-element-3451148{text-align:center;}.elementor-36 .elementor-element.elementor-element-3451148 .elementor-heading-title{color:#FFFFFF;}.elementor-36 .elementor-element.elementor-element-46c7bba{--display:flex;--min-height:80vh;--justify-content:center;--padding-top:40px;--padding-bottom:40px;--padding-left:20px;--padding-right:20px;}.elementor-36 .elementor-element.elementor-element-6b59a33 > .elementor-widget-container{background-color:#FFFFFFD1;padding:40px 0px 40px 0px;}@media(min-width:768px){.elementor-36 .elementor-element.elementor-element-d806f8a{--content-width:600px;}}/* Start custom CSS for shortcode, class: .elementor-element-6b59a33 *//* Wrapper styling */
.responsive-table-wrapper {
    overflow-x: auto;
    background-color: #f9fbfc;
    border: 1px solid #e1e8ed;
    border-radius: 8px;
    padding: 15px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

/* Table layout */
.responsive-data-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 8px;
    font-family: 'Segoe UI', sans-serif;
    font-size: 14px;
}

.responsive-data-table thead th {
    text-align: left;
    padding: 12px 15px;
    background-color: #f1f5f9;
    color: #333;
    border-bottom: 2px solid #d8dee4;
    font-weight: 600;
}

.responsive-data-table tbody tr {
    background-color: #ffffff;
    transition: box-shadow 0.2s;
}

.responsive-data-table tbody tr:hover {
    box-shadow: 0 2px 6px rgba(0,0,0,0.07);
}

.responsive-data-table td {
    padding: 12px 15px;
    border-bottom: 1px solid #edf2f7;
    color: #444;
}

.responsive-data-table td a {
    color: #0073aa;
    text-decoration: none;
    font-weight: 500;
}

.responsive-data-table td a:hover {
    text-decoration: underline;
}

/* Search and buttons */
.support-ticket-tools {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 15px;
}

#ticketSearch {
    flex: 1;
    max-width: 250px;
    padding: 8px 12px;
    border: 1px solid #ccd0d4;
    border-radius: 4px;
}

button,
.view-more-btn {
    background-color: #2b57a1;
    color: #fff !important;
    border: none;
    padding: 8px 14px;
    border-radius: 4px;
    font-size: 13px;
    cursor: pointer;
    transition: background-color 0.2s;
    text-decoration: none;
    display: inline-block;
}

button:hover,
.view-more-btn:hover {
    background-color: #000;
}

/* Filters */
#ticket-filter-form select {
    padding: 7px 10px;
    border: 1px solid #ccd0d4;
    border-radius: 4px;
    background: #fff;
    font-size: 13px;
    min-width: 150px;
}


.new-ticket-btn {
    background-color: #2b57a1;
    color: #fff;
    padding: 8px 14px;
    border-radius: 4px;
    text-decoration: none;
    font-size: 13px;
    transition: background-color 0.2s;
        font-size: var(--e-global-typography-53bbb24-font-size);
    font-weight: var(--e-global-typography-53bbb24-font-weight);
    border-style: solid;
    border-width: 2px 2px 2px 2px;
  
    border-radius: 5px 5px 5px 5px;
    padding: 13px 38px 13px 38px;
}

.new-ticket-btn:hover {
    background-color: #218838;
}



.status-badge {
    display: inline-block;
    padding: 4px 8px;
    color: #fff;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}



.priority-badge {
    display: inline-block;
    padding: 4px 8px;
    color: #fff;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
}




.ticket-status-summary {
    display: flex;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
    font-size: 14px;
}

.badge-status {
    padding: 6px 12px;
    border-radius: 20px;
    color: white;
    font-weight: 500;
    text-decoration: none;
    transition: background 0.2s;
}

.badge-status:hover {
    opacity: 0.9;
}

/* Colors for each status */
.badge-status.open {
    background-color: #007bff;
}

.badge-status.in-progress {
    background-color: #fd7e14;
}

.badge-status.awaiting-customer-reply {
    background-color: #dc3545;
}

.badge-status.resolved-closed {
    background-color: #28a745;
}

/* Highlight active status */
.badge-status.active {
    box-shadow: 0 0 0 2px #fff, 0 0 0 4px rgba(0,0,0,0.1);
    font-weight: 700;
}/* End custom CSS */