/*
--- START: "My Submitted Quotes" Page Styles ---
*/

/* 1. Fix the invisible "View Overall Status" link */
.woocommerce-MyAccount-content .rsp-quote-group-header a {
    color: #555 !important;
    font-weight: normal;
    font-size: 13px;
    text-decoration: none;
    transition: color 0.2s ease-in-out;
}
.woocommerce-MyAccount-content .rsp-quote-group-header a:hover {
    color: #000 !important;
}

/* 2. Refine the Action Buttons on the Quotes Table */
.woocommerce-MyAccount-content .rsp-dashboard-table td[data-label="Action"] {
    display: flex;
    align-items: center; 
    gap: 8px;
}

/* Base style for ALL buttons in the table */
.woocommerce-MyAccount-content .rsp-dashboard-table .rsp-button {
    padding: 6px 14px !important;  
    font-size: 13px !important;   
    margin: 0 !important;        
    line-height: 1.5 !important;
    width: auto;
    background-color: #3b82f6 !important;
    border-color: #3b82f6 !important;
    color: #ffffff !important;
}
.woocommerce-MyAccount-content .rsp-dashboard-table .rsp-button:hover {
    background-color: #2563eb !important;
    border-color: #2563eb !important;
}

/* Override for the "Withdraw" button */
.woocommerce-MyAccount-content .rsp-dashboard-table .rsp-button.rsp-button-delete {
    background-color: #d63638 !important;
    border-color: #d63638 !important;
}
.woocommerce-MyAccount-content .rsp-dashboard-table .rsp-button.rsp-button-delete:hover {
    background-color: #b02a2c !important;
    border-color: #b02a2c !important;
}

/* Status badge for "Withdrawn" */
.woocommerce-MyAccount-content .rsp-quote-status.status-withdrawn {
    background-color: #e5e7eb !important;
    color: #4b5563 !important;
}

/* 3. Style the Totals Summary Footer */
.woocommerce-MyAccount-content .rsp-quote-group-footer {
    padding: 15px;
    text-align: left;
    background-color: transparent;
    border-top: none;
}
.woocommerce-MyAccount-content .rsp-quote-totals span {
    font-size: 14px;
    font-weight: 500;
}
.woocommerce-MyAccount-content .rsp-quote-totals .total-pending strong {
    color: #c90000;
}
.woocommerce-MyAccount-content .rsp-quote-totals .total-accepted strong {
    color: #008a20;
}

/* 4. Improve overall table alignment */
.woocommerce-MyAccount-content .rsp-dashboard-table th,
.woocommerce-MyAccount-content .rsp-dashboard-table td {
    vertical-align: middle !important; 
    text-align: center;
}
.woocommerce-MyAccount-content .rsp-dashboard-table th:first-child,
.woocommerce-MyAccount-content .rsp-dashboard-table td:first-child {
    text-align: left;
}
.woocommerce-MyAccount-content .rsp-dashboard-table td[data-label="Your Price"],
.woocommerce-MyAccount-content .rsp-dashboard-table td[data-label="Shipping"] {
    text-align: right;
}

/*
--- END: "My Submitted Quotes" Page Styles ---
*/

/*
==========================================================================
--- START: "My Alerts" Page Styles (V2 - Refined Layout) ---
==========================================================================
*/

/* 1. Style the alert item card itself */
.woocommerce-MyAccount-content .rsp-alert-item {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    background-color: #ffffff;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    margin-bottom: 15px;
    /* This rule is for the Edit form, we keep it here */
    padding: 20px; 
}

/* 2. Make the main content display area a flex container */
/* THIS IS THE KEY FIX TO ALIGN EVERYTHING HORIZONTALLY */
.woocommerce-MyAccount-content .rsp-alert-display-view {
    display: flex;
    align-items: center; /* Vertically center all items in the row */
    gap: 15px;
}

/* 3. Style the Alert Details (Name and Criteria) */
.woocommerce-MyAccount-content .rsp-alert-details {
    flex-grow: 1; /* This makes the details take up all available space */
}
.woocommerce-MyAccount-content .rsp-alert-details h5 {
    margin: 0 0 5px 0;
    font-size: 1.2em;
    font-weight: 600;
}
.woocommerce-MyAccount-content .rsp-alert-details .alert-criteria {
    font-size: 13px;
    color: #555;
    line-height: 1.5;
}

/* 4. Style the "New Matches" status badge */
.woocommerce-MyAccount-content .rsp-alert-status {
    flex-shrink: 0; /* Prevent this from shrinking */
}
.woocommerce-MyAccount-content .matches-indicator {
    background-color: #e6ffe3 !important;
    color: #52c41a !important;
    padding: 6px 14px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

/* 5. Style the Action Buttons container */
.woocommerce-MyAccount-content .rsp-alert-actions {
    display: flex;
    gap: 8px;
    flex-shrink: 0; /* Prevent this from shrinking */
}
.woocommerce-MyAccount-content .rsp-alert-actions .button {
    padding: 6px 14px !important;  
    font-size: 13px !important;   
    margin: 0 !important;        
    line-height: 1.5 !important;
    font-weight: 600 !important;
    text-decoration: none;
    border: 1px solid transparent;
}
.woocommerce-MyAccount-content .rsp-alert-actions .button.edit {
    background-color: #3b82f6 !important;
    border-color: #3b82f6 !important;
    color: #ffffff !important;
}
.woocommerce-MyAccount-content .rsp-alert-actions .button.edit:hover {
    background-color: #2563eb !important;
}
.woocommerce-MyAccount-content .rsp-alert-actions .button.delete {
    background-color: #d63638 !important;
    border-color: #d63638 !important;
    color: #ffffff !important;
}
.woocommerce-MyAccount-content .rsp-alert-actions .button.delete:hover {
    background-color: #b02a2c !important;
}

/*
==========================================================================
--- END: "My Alerts" Page Styles ---
==========================================================================
*/
/*
==========================================================================
--- START: Tabbed Interface Styles for "My Submitted Quotes" ---
==========================================================================
*/

/* 1. Style the tab navigation bar */
.rsp-tabs-nav {
    display: flex;
    gap: 5px;
    border-bottom: 2px solid #e0e0e0;
    margin-bottom: 25px;
}

/* 2. Style each individual tab link */
.rsp-tabs-nav .rsp-tab-link {
    padding: 10px 20px;
    font-size: 15px;
    font-weight: 600;
    color: #555;
    text-decoration: none;
    background-color: transparent;
    border: 2px solid transparent;
    border-bottom: none; /* Remove bottom border from the link itself */
    border-radius: 8px 8px 0 0; /* Rounded top corners */
    margin-bottom: -2px; /* This makes the active tab's border connect seamlessly */
    transition: all 0.2s ease-in-out;
}

/* 3. Style for when a tab is hovered over */
.rsp-tabs-nav .rsp-tab-link:hover {
    background-color: #f1f3f5;
    color: #000;
}

/* 4. The "active" state for the currently selected tab */
.rsp-tabs-nav .rsp-tab-link.active {
    color: #3b82f6; /* Blue for the active tab text */
    border-color: #e0e0e0;
    background-color: #ffffff;
    border-bottom-color: #ffffff; /* Hide the bottom part of the border */
}

/*
==========================================================================
--- END: Tabbed Interface Styles ---
==========================================================================
*/
/*
==========================================================================
--- START: NEW "My Part Requests" Page (V3 - Part-Centric Grid) ---
==========================================================================
*/

/* Main container for the part list */
.woocommerce-MyAccount-content .rsp-part-requests-list {
    background-color: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
    overflow: hidden;
}

/* A single row in the list (header or data) */
.woocommerce-MyAccount-content .rsp-part-request-item {
    display: grid;
    /* Defines our new column layout */
    grid-template-columns: 90px 2.5fr 1fr 1fr 1fr 80px 1.2fr;
    align-items: center;
    border-bottom: 1px solid #f2f4f6;
    width: 100%;
}
.woocommerce-MyAccount-content .rsp-part-requests-list > .rsp-part-request-item:last-child {
    border-bottom: none;
}
.woocommerce-MyAccount-content .rsp-part-request-item:not(.is-header):hover {
    background-color: #fcfdff;
}

/* Header-specific styles */
.woocommerce-MyAccount-content .rsp-part-request-item.is-header {
    background: #f8f9fa;
    font-weight: 600;
    color: #6c757d;
    font-size: 0.85em;
    text-transform: uppercase;
}

/* Styling for each individual cell (column) */
.woocommerce-MyAccount-content .rsp-part-request-item .part-col {
    padding: 12px 15px;
    font-size: 0.95em;
    color: #333;
}
.woocommerce-MyAccount-content .rsp-part-request-item.is-header .part-col {
    padding: 15px;
}

/* --- Column-specific alignments and styles --- */
.part-col.part-details { font-weight: 500; }
.part-col.quotes, .part-col.request-id, .part-col.status { text-align: center; }
.part-col.expires-on { text-align: center; }
.part-col.action { text-align: right; }

/* Action buttons styling */
.part-col.action {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
}
.part-col.action .rsp-button-link-danger {
    color: #dc3545;
    text-decoration: none;
    font-size: 0.9em;
    font-weight: 500;
}
.part-col.action .rsp-button-link-danger:hover {
    text-decoration: underline;
}

/* Colored date styles (re-integrating from your old file) */
.rsp-date-active { color: #008a20; font-weight: 500; }
.rsp-date-expiring-soon { color: #c90000; font-weight: 700; }
.rsp-date-expired { color: #6c757d; }

/*
==========================================================================
--- RESPONSIVE DESIGN FOR "My Part Requests" (MOBILE VIEW) ---
==========================================================================
*/
@media (max-width: 992px) {
    .woocommerce-MyAccount-content .rsp-part-request-item.is-header { display: none; }

    .woocommerce-MyAccount-content .rsp-part-request-item {
        grid-template-columns: 1fr; /* Stack items */
        padding: 15px;
        gap: 10px;
    }

    .woocommerce-MyAccount-content .rsp-part-request-item .part-col {
        display: flex;
        justify-content: space-between;
        padding: 8px 0;
        text-align: right;
        border-bottom: 1px dotted #ccc;
    }
    .woocommerce-MyAccount-content .rsp-part-request-item .part-col:last-child { border-bottom: none; }
    
    .part-col.action { justify-content: flex-end; }

    .woocommerce-MyAccount-content .part-col::before {
        content: attr(data-label);
        font-weight: 600;
        text-align: left;
        margin-right: 15px;
        color: #555;
    }
}
/*
==========================================================================
--- END: NEW "My Part Requests" Page (V3) ---
==========================================================================
*/
/*
==========================================================================
--- START: FINAL "My Part Requests" Page (V4 - Framed Group) ---
==========================================================================
*/

/* Add a gap between each request group frame */
.rsp-request-group-frame {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 20px;
    overflow: hidden; /* Important for border-radius */
    box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

/* We only need a bottom border for items inside a frame, not the frame itself */
.rsp-request-group-frame .rsp-part-request-item {
    border-bottom: 1px solid #f2f4f6;
}
.rsp-request-group-frame .rsp-part-request-item:last-child {
    border-bottom: none; /* No border for the last item in a group */
}
.rsp-requests-group-list > .is-header {
    border: none; /* Remove border from the main header */
    margin-bottom: 10px;
}

/* Style the status "Quoted" to be green */
.part-col.status.status-quoted {
    color: #28a745;
    font-weight: 600;
}

/* Fix the action button size and text */
.part-col.action .rsp-button.rsp-button-small {
    padding: 5px 12px !important;
    font-size: 13px !important;
    min-width: 60px;
    text-align: center;
}
/*
==========================================================================
--- FINAL STYLES for "My Part Requests" (Framed, Grouped View) ---
==========================================================================
*/

/* Hides the default list structure to allow our frames to work */
.rsp-requests-group-list > .is-header { display: none; }
.rsp-dashboard-container .rsp-part-requests-list {
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
}

/* The frame around each group of parts from the same request */
.rsp-request-group-frame {
    background-color: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 8px;
    margin-bottom: 25px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

/* Header for each frame */
.rsp-request-group-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
}
.rsp-request-group-header h5 {
    margin: 0;
    font-size: 1.1em;
}
.rsp-request-group-header .date {
    font-size: 0.9em;
    color: #6c757d;
}

/* The table of parts inside each frame */
.rsp-request-group-frame table.rsp-parts-table {
    width: 100%;
    border-collapse: collapse;
}
.rsp-request-group-frame table.rsp-parts-table th,
.rsp-request-group-frame table.rsp-parts-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #f2f4f6;
    vertical-align: middle;
}
.rsp-request-group-frame table.rsp-parts-table tr:last-child td {
    border-bottom: none;
}
.rsp-request-group-frame table.rsp-parts-table th {
    font-weight: 600;
    font-size: 0.85em;
    color: #6c757d;
    text-transform: uppercase;
}
.rsp-request-group-frame table.rsp-parts-table td {
    font-size: 0.95em;
}

/* Column-specific alignments */
td.col-status, td.col-quotes { text-align: center; }
td.col-action { text-align: right; }
td.col-action .rsp-button.rsp-button-small {
    padding: 5px 12px !important;
    font-size: 13px !important;
    min-width: 60px;
    text-align: center;
}
td.col-action .rsp-button-withdraw {
    margin-left: 8px;
    font-size: 0.9em;
}

/* Colored Status Badge */
.status-badge {
    padding: 4px 10px;
    border-radius: 15px;
    font-weight: 600;
    font-size: 0.85em;
    display: inline-block;
}
.status-badge.status-quoted {
    background-color: #e3f9e9;
    color: #28a745;
}
.status-badge.status-pending-quotes {
    background-color: #e9ecef;
    color: #495057;
}
/* Styles for Completed Deal Cards */
.rsp-completed-deal-card {
    background: #fff; border: 1px solid #e0e0e0; border-radius: 6px; margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04); display: flex; flex-direction: column;
}
.rsp-deal-card-body { padding: 20px; }
.rsp-deal-card-body .part-description { margin-top: 0; margin-bottom: 5px; font-size: 1.2em; }
.rsp-deal-card-body .supplier-info { margin: 0; color: #555; }
.rsp-deal-card-footer {
    display: flex; justify-content: space-between; align-items: center;
    padding: 15px 20px; background-color: #f9f9f9; border-top: 1px solid #e0e0e0;
}
.rsp-deal-card-footer .final-price { font-size: 1.1em; color: #1e85be; }

/* Styles for Completed Deal Modal */
.rsp-modal-overlay {
    position: fixed; top: 0; left: 0; width: 100%; height: 100%;
    background-color: rgba(0,0,0,0.6); z-index: 1000;
}
.rsp-deal-details-modal {
    position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%);
    background: #fff; border-radius: 8px; z-index: 1001;
    width: 90%; max-width: 800px; max-height: 90vh; overflow-y: auto;
}
.rsp-modal-content { padding: 30px; }
.rsp-modal-close {
    position: absolute; top: 15px; right: 20px; font-size: 28px;
    font-weight: bold; cursor: pointer; color: #888;
}
.rsp-modal-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.rsp-modal-section h4 { border-bottom: 2px solid #eee; padding-bottom: 10px; margin-top: 0; }
@media (max-width: 768px) { .rsp-modal-grid { grid-template-columns: 1fr; }
