/* Edwiser Store Dashboard Styles */

/* Override Moodle container for full-width layout - MUST BE FIRST */

#page-local-edwiserstore-dashboard #topofscroll,
#page-local-edwiserstore-products #topofscroll,
#page-local-edwiserstore-orders #topofscroll,
#page-local-edwiserstore-subscriptions #topofscroll,
#page-local-edwiserstore-coupons #topofscroll,
#page-local-edwiserstore-reviews #topofscroll,
#page-local-edwiserstore-shopsettings #topofscroll,
#page-local-edwiserstore-paymentsettings #topofscroll,
#page-local-edwiserstore-emailtemplates #topofscroll,
#page-local-edwiserstore-shop #topofscroll,
#page-local-edwiserstore-productview #topofscroll,
#page-local-edwiserstore-cart #topofscroll,
#page-local-edwiserstore-checkout #topofscroll,
#page-local-edwiserstore-myorders #topofscroll,
#page-local-edwiserstore-mysubscriptions #topofscroll {
    margin-top: 0 !important;
    padding-top: 0 !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}

#page-local-edwiserstore-dashboard #topofscroll > .container,
#page-local-edwiserstore-products #topofscroll >.container,
#page-local-edwiserstore-orders #topofscroll >.container,
#page-local-edwiserstore-subscriptions #topofscroll>.container,
#page-local-edwiserstore-coupons #topofscroll>.container,
#page-local-edwiserstore-reviews #topofscroll>.container,
#page-local-edwiserstore-shopsettings #topofscroll>.container,
#page-local-edwiserstore-paymentsettings #topofscroll>.container,
#page-local-edwiserstore-emailtemplates #topofscroll>.container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
}

/* Shop page container - full width with background */
#page-local-edwiserstore-shop #topofscroll > .container,
#page-local-edwiserstore-productview #topofscroll > .container,
#page-local-edwiserstore-cart #topofscroll > .container,
#page-local-edwiserstore-myorders #topofscroll > .container,
#page-local-edwiserstore-mysubscriptions #topofscroll > .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    background: #f5f8ff !important;
}

/* Shop page main content area - same background */
#page-local-edwiserstore-shop #topofscroll > .container #page-header {
    margin-left: 32px;
    margin-right: 32px;
}

#page-local-edwiserstore-productview #topofscroll>.container #page-header,
#page-local-edwiserstore-cart #topofscroll>.container #page-header,
#page-local-edwiserstore-myorders #topofscroll>.container #page-header,
#page-local-edwiserstore-mysubscriptions #topofscroll>.container #page-header {
    display: none !important;
}

#page-local-edwiserstore-productview #topofscroll>.container #page-content,
#page-local-edwiserstore-cart #topofscroll>.container #page-content,
#page-local-edwiserstore-myorders #topofscroll>.container #page-content,
#page-local-edwiserstore-mysubscriptions #topofscroll>.container #page-content {
    padding-bottom: 0 !important;
}

#page-local-edwiserstore-shop #topofscroll > .container div[role="main"],
#page-local-edwiserstore-productview #topofscroll > .container div[role="main"],
#page-local-edwiserstore-cart #topofscroll>.container div[role="main"],
#page-local-edwiserstore-checkout #topofscroll>.container div[role="main"] {
    background: #f5f8ff !important;
}

#page-local-edwiserstore-dashboard #topofscroll>.container .page-content,
#page-local-edwiserstore-products #topofscroll>.container .page-content,
#page-local-edwiserstore-orders #topofscroll>.container .page-content,
#page-local-edwiserstore-subscriptions #topofscroll>.container .page-content,
#page-local-edwiserstore-coupons #topofscroll>.container .page-content,
#page-local-edwiserstore-reviews #topofscroll>.container .page-content,
#page-local-edwiserstore-shopsettings #topofscroll>.container .page-content,
#page-local-edwiserstore-paymentsettings #topofscroll>.container .page-content,
#page-local-edwiserstore-emailtemplates #topofscroll>.container .page-content {
    padding-bottom: 0 !important;
}

#page-local-edwiserstore-dashboard #topofscroll>.container div[role="main"],
#page-local-edwiserstore-products #topofscroll>.container div[role="main"],
#page-local-edwiserstore-orders #topofscroll>.container div[role="main"],
#page-local-edwiserstore-subscriptions #topofscroll>.container div[role="main"],
#page-local-edwiserstore-coupons #topofscroll>.container div[role="main"],
#page-local-edwiserstore-reviews #topofscroll>.container div[role="main"],
#page-local-edwiserstore-shopsettings #topofscroll>.container div[role="main"],
#page-local-edwiserstore-paymentsettings #topofscroll>.container div[role="main"],
#page-local-edwiserstore-emailtemplates #topofscroll>.container div[role="main"] {
    margin-top: 0 !important;
    padding: 0 !important;
}

/* Hide page heading - menu should start directly below header */
#page-local-edwiserstore-dashboard h1,
#page-local-edwiserstore-dashboard h2,
#page-local-edwiserstore-dashboard .page-header-headings,
#page-local-edwiserstore-dashboard #page-header,
#page-local-edwiserstore-products h1,
#page-local-edwiserstore-products h2,
#page-local-edwiserstore-products .page-header-headings,
#page-local-edwiserstore-products #page-header,
#page-local-edwiserstore-orders h1,
#page-local-edwiserstore-orders h2,
#page-local-edwiserstore-orders .page-header-headings,
#page-local-edwiserstore-orders #page-header,
#page-local-edwiserstore-subscriptions h1,
#page-local-edwiserstore-subscriptions h2,
#page-local-edwiserstore-subscriptions .page-header-headings,
#page-local-edwiserstore-subscriptions #page-header,
#page-local-edwiserstore-coupons h1,
#page-local-edwiserstore-coupons .page-header-headings h2,
#page-local-edwiserstore-coupons .page-header-headings,
#page-local-edwiserstore-coupons #page-header,
#page-local-edwiserstore-reviews h1,
#page-local-edwiserstore-reviews h2,
#page-local-edwiserstore-reviews .page-header-headings,
#page-local-edwiserstore-reviews #page-header,
#page-local-edwiserstore-shopsettings h1,
#page-local-edwiserstore-shopsettings h2,
#page-local-edwiserstore-shopsettings .page-header-headings,
#page-local-edwiserstore-shopsettings #page-header,
#page-local-edwiserstore-paymentsettings h1,
#page-local-edwiserstore-paymentsettings h2,
#page-local-edwiserstore-paymentsettings .page-header-headings,
#page-local-edwiserstore-paymentsettings #page-header,
#page-local-edwiserstore-emailtemplates h1,
#page-local-edwiserstore-emailtemplates h2,
#page-local-edwiserstore-emailtemplates .page-header-headings,
#page-local-edwiserstore-emailtemplates #page-header,
#page-local-edwiserstore-checkout #page-header {
    display: none !important;
}

/* Dashboard Layout - FIX: Use 100% instead of 100vw to prevent horizontal scroll */
.local-edwiserstore-dashboard-layout {
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background-color: #f5f7fa;
    min-height: calc(100vh - 120px);
    position: relative;
    display: flex;
    overflow-x: hidden;
}

/* Ensure footer is NOT inside our layout container - Footer should be outside and unaffected by our styling */

/* FIX: Prevent body/html horizontal scroll */
body#page-local-edwiserstore-dashboard,
body#page-local-edwiserstore-products,
body#page-local-edwiserstore-orders,
body#page-local-edwiserstore-subscriptions,
body#page-local-edwiserstore-coupons,
body#page-local-edwiserstore-reviews,
body#page-local-edwiserstore-shopsettings,
body#page-local-edwiserstore-paymentsettings,
body#page-local-edwiserstore-emailtemplates {
    overflow-x: hidden !important;
    max-width: 100% !important;
}

.local-edwiserstore-dashboard-layout .row {
    margin: 0 !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: nowrap !important;
}

/* Sidebar Wrapper - White Theme - FIX: Align with content container */
.local-edwiserstore-sidebar-wrapper {
    width: 280px;
    min-height: calc(100vh - 120px);
    transition: width 0.3s ease;
    flex-shrink: 0;
    background-color: #fff;
    position: relative;
    z-index: 100;
    display: flex;
    flex-direction: column;
}

/* Sidebar - White Theme */
.local-edwiserstore-sidebar {
    background-color: #fff;
    flex: 1;
    padding: 20px 16px;
    position: relative;
    transition: all 0.3s ease;
    width: 100%;
    display: flex;
    flex-direction: column;
}

/* Sidebar Toggle Section - Positioned above menu items */
/* Title row with inline toggle icon */
.sidebar-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-bottom: 8px;
}

.sidebar-title-row .sidebar-title {
    margin: 0;
}

/* Inline toggle icon (no button appearance) */
.sidebar-toggle-icon {
    color: #6c757d;
    cursor: pointer;
    padding: 4px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.sidebar-toggle-icon:hover {
    color: #212529;
}

.sidebar-toggle-icon i {
    font-size: 16px;
    line-height: 1;
}

.sidebar-toggle-icon .sidebar-toggle-icon-expand img {
    width: 16px;
    height: 16px;
}

/* Collapsed: align toggle icon with menu icons */
.local-edwiserstore-dashboard-layout.sidebar-collapsed .sidebar-title-row {
    margin: 0;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed #sidebar-toggle {
    width: 100%;
    padding: 12px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Content Wrapper - FIX: Align with sidebar, prevent horizontal overflow */
.local-edwiserstore-content-wrapper {
    flex: 1;
    min-height: calc(100vh - 120px);
    transition: margin-left 0.3s ease;
    padding: 24px;
    background-color: #f5f7fa;
    overflow-x: hidden;
    overflow-y: auto;
    max-width: calc(100% - 280px);
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
}

.local-edwiserstore-dashboard-layout .local-edwiserstore-content-wrapper, .local-edwiserstore-dashboard-layout .local-edwiserstore-content-wrapper .local-edwiserstore-content-card {
    background-color: #f5f7fa;
}

.local-edwiserstore-dashboard-layout .local-edwiserstore-content-wrapper {
    margin: 0;
    padding: 0;
}

/* Content Card - FIX: Prevent overflow */
.local-edwiserstore-content-card {
    background-color: #fff;
    border-radius: 0;
    box-shadow: none;
    padding: 32px;
    min-height: calc(100vh - 140px);
    width: 100%;
    max-width: 100%;
    margin: 0;
    overflow-x: hidden;
    box-sizing: border-box;
}

/* Collapsed state */
.local-edwiserstore-dashboard-layout.sidebar-collapsed .local-edwiserstore-sidebar-wrapper {
    width: 70px;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .sidebar-title {
    display: none;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link span {
    display: none;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link {
    justify-content: center;
    align-items: center;
    padding: 12px 10px;
    width: 100%;
    min-width: 50px;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link i,
.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link .menu-icon-svg {
    margin-right: 0;
    margin-left: 0;
    width: 20px;
    height: 20px;
    text-align: center;
    display: block;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link.active i,
.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link.active .menu-icon-svg {
    color: #fff;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-link.active .menu-icon-svg {
    filter: brightness(0) invert(1);
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .nav-item {
    display: flex;
    justify-content: center;
    width: 100%;
}

/* Toggle button icon - show/hide based on state */
/* When sidebar is COLLAPSED, show expand icon (chevron-right) */
.local-edwiserstore-dashboard-layout.sidebar-collapsed .sidebar-toggle-icon-collapse {
    display: none !important;
}

.local-edwiserstore-dashboard-layout.sidebar-collapsed .sidebar-toggle-icon-expand {
    display: block !important;
}

/* When sidebar is EXPANDED, show collapse icon (x) */
.local-edwiserstore-dashboard-layout:not(.sidebar-collapsed) .sidebar-toggle-icon-collapse {
    display: block !important;
}

.local-edwiserstore-dashboard-layout:not(.sidebar-collapsed) .sidebar-toggle-icon-expand {
    display: none !important;
}

/* Sidebar Sections */
.local-edwiserstore-sidebar .sidebar-section {
    margin-bottom: 0;
    margin-top: 16px;
    flex-shrink: 0;
}

.local-edwiserstore-sidebar .sidebar-section:first-of-type {
    margin-top: 0;
}

.local-edwiserstore-sidebar .sidebar-section:last-child {
    margin-bottom: 0;
}

/* Sidebar Title - White Theme */
.local-edwiserstore-sidebar .sidebar-title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    color: #a0aec0;
    margin-bottom: 8px;
    margin-top: 0;
    padding: 0;
    letter-spacing: 0.5px;
    border: none;
}

/* Sidebar Nav Links - White Theme */
.local-edwiserstore-sidebar .nav-link {
    padding: 10px 12px;
    color: #495057;
    border-radius: 6px;
    margin-bottom: 2px;
    margin-top: 0;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    text-decoration: none;
    font-size: 14px;
    line-height: 1.5;
}

.local-edwiserstore-sidebar .nav-link i,
.local-edwiserstore-sidebar .nav-link .menu-icon-svg {
    margin-right: 14px;
    width: 20px;
    height: 20px;
    text-align: center;
    font-size: 16px;
    color: #6c757d;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.local-edwiserstore-sidebar .nav-link .menu-icon-svg {
    display: inline-block;
    vertical-align: middle;
}

.local-edwiserstore-sidebar .nav-link span {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
}

.local-edwiserstore-sidebar .nav-link:hover {
    background-color: #f8f9fa;
    color: #007bff;
}

.local-edwiserstore-sidebar .nav-link.active {
    background-color: #007bff;
    color: #fff;
    font-weight: 600;
}

.local-edwiserstore-sidebar .nav-link.active i,
.local-edwiserstore-sidebar .nav-link.active .menu-icon-svg {
    color: #fff;
}

.local-edwiserstore-sidebar .nav-link.active .menu-icon-svg {
    filter: brightness(0) invert(1);
}

/* Products Page Styling */
.local-edwiserstore-products-page .d-flex.justify-content-between {
    align-items: center;
    margin-bottom: 30px;
}

.local-edwiserstore-products-page .d-flex.justify-content-between h2 {
    margin: 0;
}

.local-edwiserstore-products-page .generaltable {
    margin-top: 20px;
}

.local-edwiserstore-products-page .badge {
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 500;
}

.local-edwiserstore-products-page .btn-sm {
    padding: 5px 10px;
    margin-right: 5px;
}

.local-edwiserstore-empty-state {
    padding: 60px 20px;
    text-align: center;
}

.local-edwiserstore-empty-state .empty-illustration {
    margin: 0 auto 30px;
}

.local-edwiserstore-empty-state .empty-illustration svg {
    max-width: 200px;
    height: auto;
}

/* Support img-based empty illustration */
.local-edwiserstore-empty-state .empty-illustration img {
    max-width: 200px;
    height: auto;
    display: block;
}


/* FIX: Products page specific styling */
.local-edwiserstore-content-card .generaltable {
    width: 100%;
    table-layout: auto;
    margin-bottom: 0;
}

.local-edwiserstore-content-card .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
}

.local-edwiserstore-content-card .generaltable th,
.local-edwiserstore-content-card .generaltable td {
    white-space: nowrap;
    padding: 12px 15px;
}

.local-edwiserstore-content-card .generaltable th:last-child,
.local-edwiserstore-content-card .generaltable td:last-child {
    white-space: normal;
}

/* FIX: Ensure search and filter don't cause overflow */
.local-edwiserstore-content-card .d-flex {
    flex-wrap: wrap;
    gap: 10px;
}

.local-edwiserstore-content-card .input-group {
    max-width: 100%;
    flex: 1;
    min-width: 200px;
}

.local-edwiserstore-content-card select.form-control {
    max-width: 100%;
    flex: 0 0 auto;
    min-width: 150px;
}

/* FIX: Collapsed sidebar adjustments */
.local-edwiserstore-dashboard-layout.sidebar-collapsed .local-edwiserstore-content-wrapper {
    max-width: calc(100% - 70px);
}

/* FIX: Products page header styling */
.products-page-header {
    margin-bottom: 24px !important;
}

.products-page-title {
    font-size: 24px;
    font-weight: 600;
    color: #212529;
}

/* FIX: Status badge styling to match design */
.local-edwiserstore-content-card .badge-success {
    background-color: #28a745;
    color: #fff;
}

.local-edwiserstore-content-card .badge-warning {
    background-color: #ffc107;
    color: #212529;
}

.local-edwiserstore-content-card .badge-danger {
    background-color: #dc3545;
    color: #fff;
}

/* FIX: Action buttons styling */
.local-edwiserstore-content-card .btn-sm {
    padding: 6px 10px;
    margin: 0 2px;
    border-radius: 4px;
    min-width: 32px;
}

.local-edwiserstore-content-card .btn-info {
    background-color: #17a2b8;
    border-color: #17a2b8;
}

.local-edwiserstore-content-card .btn-warning {
    background-color: #ffc107;
    border-color: #ffc107;
    color: #212529;
}

.local-edwiserstore-content-card .btn-danger {
    background-color: #dc3545;
    border-color: #dc3545;
}

/* FIX: Products page header styling */
.products-page-header-right {
    display: flex;
    align-items: center;
    gap: 20px;
}

.products-text-label {
    font-size: 16px;
    color: #495057;
    font-weight: 500;
}

/* FIX: Search field styling to match design */
.products-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    max-width: 300px;
}

.products-search-input {
    padding-right: 40px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
}

.products-search-btn {
    position: absolute;
    right: 0;
    background: transparent;
    border: none;
    padding: 8px 12px;
    color: #6c757d;
    cursor: pointer;
}

.products-search-btn:hover {
    color: #495057;
}

/* FIX: Category dropdown styling to match design */
.products-category-wrapper {
    position: relative;
}

.products-category-select {
    padding-right: 30px;
    border: 1px solid #dee2e6;
    border-radius: 4px;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L6 6L11 1' stroke='%236c757d' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    cursor: pointer;
}

/* FIX: Delete confirmation modal */
.local-edwiserstore-delete-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
}

/* Product editor sidebar modal (simplified) */
.edwiser-product-editor-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.5);
    z-index: 10000; /* below Moodle picker */
}
.edwiser-product-editor-panel {
    position: absolute;
    top: 0; right: 0; bottom: 0;
    width: 50vw;
    max-width: 100%;
    background: #fff;
    display: flex;
    flex-direction: column;
}
.edwiser-editor-header { padding: 16px 20px; border-bottom: 1px solid #e2e8f0; }
.edwiser-editor-body { padding: 24px; overflow-y: auto; }
.edwiser-editor-footer { padding: 16px 24px; border-top: 1px solid #e2e8f0; }
.edwiser-editor-close { font-size: 22px; line-height: 1; }

/* Notes/tips styling to match design cues */
.edwiser-note {
    font-size: 12px;
    color: #6c757d;
}

/* Precise layout for Product Editor modal */
.edwiser-product-editor-backdrop .edwiser-product-editor-panel {
    box-shadow: -8px 0 24px rgba(0,0,0,0.15);
}
.edwiser-product-editor-panel .edwiser-editor-header {
    padding-top: 24px;
    padding-bottom: 16px;
}
.edwiser-product-editor-panel .edwiser-editor-header h4 {
    font-weight: 600;
    font-size: 20px;
}

.edwiser-product-editor-panel .edwiser-editor-body .form-control {
    height: auto;
}

.edwiser-product-editor-panel .edwiser-editor-body .form-group {
    margin-bottom: 16px;
}
.edwiser-editor-body .edwiser-note { font-size: 12px; line-height: 1.4; }
.edwiser-editor-body .form-row + .form-row { margin-top: 16px; }

/* Related products chips (core/form-autocomplete) */
.form-autocomplete-selection .form-autocomplete-selection-list {
    display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px;
}
.form-autocomplete-selection .form-autocomplete-selection-list .form-autocomplete-selection-item,
.form-autocomplete-selection .form-autocomplete-token {
    background: #eef5ff; color: #2F80ED; border-radius: 16px; padding: 4px 10px; border: 1px solid #d6e7ff;
}
.form-autocomplete-selection .deleteaction { margin-left: 6px; color: #2F80ED; }

/* Show/Hide section grid - removed duplicate, see below */

/* Footer buttons sizing */
.edwiser-editor-footer .btn { height: 44px; padding: 0 18px; font-weight: 600; }
.edwiser-editor-footer .btn-primary { background:#2F80ED; border-color:#2F80ED; }
.edwiser-editor-footer .btn-primary:hover { background:#1e6fe0; border-color:#1e6fe0; }
.edwiser-editor-footer .btn-link { color:#6c757d; }
.edwiser-editor-footer .btn-link:hover { color:#343a40; }
.edwiser-compact-select { width: 220px; min-width: 200px; max-width: 260px; }
.edwiser-editor-body .form-row {
    gap: 16px;
}
.edwiser-editor-body label {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 6px;
}

.edwiser-editor-body select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%236c757d' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
    padding-left: 12px;
    height: 40px;
    line-height: 24px;
    width: 100%;
}
.edwiser-section-title { font-size: 14px; font-weight: 700; color: #374151; }
.edwiser-inline-default { color:#6c757d; font-size:12px; white-space:nowrap; margin-left: 12px; align-self: center; }
.edwiser-editor-body .form-row.align-items-start .edwiser-inline-default { align-self: flex-end; }
/* Product type section: proper alignment */
.edwiser-editor-body .edwiser-product-type-group {
    margin-bottom: 16px;
}
.edwiser-editor-body .edwiser-product-type-group label {
    margin-bottom: 6px;
    display: block;
}
.edwiser-editor-body .form-row.edwiser-product-type-row {
    align-items: flex-start;
    margin-top: 0;
    gap: 12px;
}
.edwiser-editor-body .edwiser-product-type-row .flex-fill {
    display: flex;
    flex-direction: column;
}
.edwiser-editor-body .edwiser-product-type-row .flex-fill .edwiser-note {
    margin-top: 8px;
    margin-left: 0;
}
.edwiser-editor-body .edwiser-product-type-help {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 120px;
    padding-top: 0;
    flex-shrink: 0;
}
.edwiser-editor-body .edwiser-product-type-help .edwiser-inline-default {
    margin-left: 0;
    margin-bottom: 0;
    padding-top: 0;
    height: 40px;
    line-height: 40px;
    display: flex;
    align-items: center;
}

/* Toggle style for show/hide grid - proper toggle switches matching shop_settings */
.edwiser-showhide-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

.edwiser-showhide-grid .toggle-switch-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.edwiser-showhide-grid .toggle-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}

.edwiser-showhide-grid .toggle-switch input[type="checkbox"] {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
    margin: 0;
    padding: 0;
    border: none;
    outline: none;
}

.edwiser-showhide-grid .toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    transition: background-color 0.2s;
    border-radius: 24px;
}

.edwiser-showhide-grid .toggle-slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: transform 0.2s;
    border-radius: 50%;
}

.edwiser-showhide-grid .toggle-switch input:checked + .toggle-slider {
    background-color: #2F80ED;
}

.edwiser-showhide-grid .toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(20px);
}

.edwiser-showhide-grid .toggle-label-text {
    font-size: 14px;
    color: #374151;
    font-weight: 500;
    white-space: nowrap;
}
.edwiser-editor-body textarea.form-control {
    height: auto;
    min-height: 240px;
}

/* Tiny/Atto editor height parity */
.edwiser-product-editor-panel .tox-tinymce {
    min-height: 280px;
}
.edwiser-product-editor-panel .tox .tox-edit-area__iframe {
    min-height: 220px;
}
.edwiser-product-editor-panel .editor_atto {
    min-height: 280px;
}

/* Filepicker inner text/icon sizing */
/* Use Moodle default styling for core filepicker; do not override typography */
/* Ensure Moodle YUI dialogues (file picker) stack above our side panel */
/* .moodle-dialogue, .moodle-dialogue-base, .moodle-dialogue .moodle-dialogue-wrap {
    z-index: 12050 !important;
} */

/* When Moodle file picker is open, allow clicks to pass through our backdrop */
body.edwiser-picker-open .edwiser-product-editor-backdrop {
    display: block; /* keep modal visible */
    pointer-events: none; /* but do not block clicks intended for the picker */
}
body.edwiser-picker-open .edwiser-product-editor-backdrop .edwiser-product-editor-panel {
    pointer-events: auto; /* keep our editor panel interactive if needed */
}

/* Toggle dimensions exact - removed old conflicting styles */

/* Related product chips size */
.form-autocomplete-selection .form-autocomplete-selection-list .form-autocomplete-selection-item,
.form-autocomplete-selection .form-autocomplete-token {
    height: 28px; line-height: 28px; padding: 0 12px; border-radius: 14px; font-weight: 500;
}

/* Autocomplete dropdown spacing */
.form-autocomplete-suggestions .form-autocomplete-suggestions li,
.form-autocomplete-suggestions .form-autocomplete-suggestion {
    padding: 8px 12px !important; font-size: 14px;
}

/* Footer spacing from content */
.edwiser-product-editor-panel .edwiser-editor-footer { margin-top: 8px; }
.edwiser-editor-body .form-check {
    margin-right: 20px;
}
.edwiser-editor-body .form-check-label {
    font-weight: 500;
}
.edwiser-editor-footer {
    padding-top: 16px;
    padding-bottom: 16px;
}
.edwiser-editor-footer .btn {
    min-width: 140px;
}
.edwiser-product-editor-panel .btn.btn-primary {
    box-shadow: none;
}
.edwiser-product-editor-panel .btn.btn-link {
    color: #6c757d;
}
.edwiser-product-editor-panel .btn.btn-link:hover {
    color: #343a40;
    text-decoration: none;
}

/* Fine spacing for helper notes and icon tips */
.edwiser-note.mt-1 { margin-top: 6px !important; }
.edwiser-product-editor-panel i.fa.fa-info-circle {
    color: #6c757d;
    font-size: 13px;
    margin-left: 4px;
}

/* Filepicker regions alignment */
/* Remove custom dashed-box styling so Moodle's default filepicker UI renders */

/* Autocomplete width & spacing */
.edwiser-product-editor-panel .form-autocomplete-downarrow { right: 10px; }
.edwiser-product-editor-panel .form-autocomplete-suggestions { max-height: 240px; }

/* Hide paid and subscription sections by default - JavaScript will show them based on product type */
.edwiser-product-editor-panel .section-paid,
.edwiser-product-editor-panel .section-subscription {
    display: none;
}

/* Responsive adjustments */
@media (max-width: 1024px) {
    .edwiser-product-editor-panel { width: 92vw; }
}
@media (max-width: 576px) {
    .edwiser-product-editor-panel { width: 100vw; }
    .edwiser-editor-body .form-row { display: block !important; }
}

.local-edwiserstore-delete-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
}

.local-edwiserstore-delete-modal-content {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    min-width: 400px;
    max-width: 90%;
    z-index: 10000;
}

.local-edwiserstore-delete-modal-header {
    padding: 20px 24px 16px;
    border-bottom: 1px solid #e2e8f0;
}

.local-edwiserstore-delete-modal-header h4 {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: #212529;
}

.local-edwiserstore-delete-modal-body {
    padding: 20px 24px;
}

.local-edwiserstore-delete-modal-body p {
    margin: 0;
    color: #495057;
    font-size: 14px;
}

.local-edwiserstore-delete-modal-footer {
    padding: 16px 24px 20px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.local-edwiserstore-delete-modal-footer .btn {
    padding: 8px 20px;
    border-radius: 4px;
    font-weight: 500;
    cursor: pointer;
}

.local-edwiserstore-delete-modal-footer .btn-secondary {
    background: #fff;
    border: 1px solid #dee2e6;
    color: #495057;
}

.local-edwiserstore-delete-modal-footer .btn-secondary:hover {
    background: #f8f9fa;
}

.local-edwiserstore-delete-modal-footer .btn-primary {
    background: #007bff;
    border: 1px solid #007bff;
    color: #fff;
}

.local-edwiserstore-delete-modal-footer .btn-primary:hover {
    background: #0056b3;
    border-color: #0056b3;
}

/* Shop Settings Styles */
.local-edwiserstore-shop-settings {
    padding: 24px;
    background: #fff;
    border-radius: 8px;
}

.shop-settings-form .form-group {
    margin-bottom: 24px;
}

.shop-settings-form .form-group:last-child {
    margin-bottom: 0;
}

.shop-settings-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #374151;
    font-size: 14px;
}

.shop-settings-form .form-control {
    width: 100%;
    max-width: 400px;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

/* Override max-width for payment settings full-width fields */
.local-edwiserstore-payment-settings .shop-settings-form .form-control.payment-field-full-width {
    max-width: 100%;
}

.local-edwiserstore-payment-settings .shop-settings-form .form-control {
    max-width: 100%;
}

.shop-settings-form .form-control:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

/* Toggle Switch Styles */
.toggle-switch-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.toggle-switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
}

.toggle-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.toggle-slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #d1d5db;
    transition: .2s;
    border-radius: 24px;
}

.toggle-slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 3px;
    bottom: 3px;
    background-color: white;
    transition: .2s;
    border-radius: 50%;
}

.toggle-switch input:checked + .toggle-slider {
    background-color: #2F80ED;
}

.toggle-switch input:checked + .toggle-slider:before {
    transform: translateX(20px);
}

.toggle-label-text {
    font-size: 14px;
    color: #6b7280;
    font-weight: 500;
    min-width: 40px;
}

/* Toast Notification Styles */
.shop-settings-toast {
    position: fixed;
    top: 20px;
    right: 20px;
    min-width: 300px;
    max-width: 500px;
    background-color: #10b981;
    color: white;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    z-index: 9999;
    animation: slideInRight 0.3s ease-out;
}

.shop-settings-toast-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 16px 20px;
}

.shop-settings-toast-message {
    flex: 1;
    font-size: 14px;
    font-weight: 500;
}

.shop-settings-toast-close {
    background: none;
    border: none;
    color: white;
    font-size: 20px;
    cursor: pointer;
    padding: 0;
    margin-left: 16px;
    line-height: 1;
    opacity: 0.8;
    transition: opacity 0.2s;
}

.shop-settings-toast-close:hover {
    opacity: 1;
}

@keyframes slideInRight {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Save Button */
.shop-settings-form .btn-primary {
    background-color: #2F80ED;
    border-color: #2F80ED;
    color: white;
    padding: 10px 24px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 6px;
    min-width: 140px;
}

.shop-settings-form .btn-primary:hover {
    background-color: #1e6fe0;
    border-color: #1e6fe0;
}

.shop-settings-form .btn-primary:disabled {
    background-color: #9ca3af;
    border-color: #9ca3af;
    cursor: not-allowed;
}

/* Payment Settings Styles */
.local-edwiserstore-payment-settings {
    padding: 24px;
    background: #fff;
    border-radius: 8px;
}

.local-edwiserstore-payment-settings .shop-settings-form .form-group {
    margin-bottom: 24px;
}


.local-edwiserstore-payment-settings .shop-settings-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #374151;
    font-size: 14px;
}

.local-edwiserstore-payment-settings .shop-settings-form .form-control {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

.local-edwiserstore-payment-settings .shop-settings-form .form-control:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

/* Payment gateway fields - 2x2 grid format */
.payment-gateway-fields {
    margin-top: 16px;
    margin-bottom: 24px;
}

.payment-gateway-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: 100%;
}

.payment-gateway-grid .form-group {
    margin-bottom: 20px;
}

.payment-gateway-grid .form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #374151;
    font-size: 14px;
}

.payment-gateway-grid .form-group .form-control {
    width: 100%;
    max-width: 100%;
}

/* Test connection fields disabled state */
.test-connection-fields.disabled-fields .form-control:disabled,
.test-connection-fields .form-control:disabled {
    background-color: #f3f4f6;
    color: #9ca3af;
    cursor: not-allowed;
    opacity: 0.6;
}

.test-connection-fields.disabled-fields .form-group label {
    color: #9ca3af;
}

.payment-field-full-width {
    max-width: 100% !important;
    width: 100% !important;
}

/* Form row for side-by-side fields */
.payment-form-row {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    margin-bottom: 0;
    width: 100%;
}

.payment-form-group-half {
    flex: 1;
    margin-bottom: 0;
    min-width: 0;
    max-width: calc(50% - 8px);
}

.payment-form-group-button {
    flex: 0 0 auto;
    margin-bottom: 0;
    display: flex;
    align-items: flex-end;
    padding-bottom: 0;
    margin-left: 16px;
}

.payment-form-group-button .btn {
    height: 38px;
    padding: 0 16px;
    white-space: nowrap;
    min-width: 120px;
    display: inline-block;
}

/* Tax fields */
.tax-fields-container {
    margin-top: 16px;
    padding-left: 8px;
}

.tax-field-row {
    margin-bottom: 16px;
    align-items: flex-end;
}

.tax-field-row:last-child {
    margin-bottom: 0;
}

.tax-field-row .form-group {
    margin-bottom: 0;
}

.tax-field-row .form-group label {
    margin-bottom: 8px;
}

.tax-field-row .btn-primary,
.tax-field-row .btn-danger {
    height: 38px;
    padding: 0 16px;
    white-space: nowrap;
    display: inline-block;
}

/* Ensure Add new tax button is always visible */
#add-new-tax-btn {
    visibility: visible !important;
    opacity: 1 !important;
    display: inline-block !important;
}

.tax-field-row .payment-form-group-button {
    visibility: visible !important;
    opacity: 1 !important;
    display: flex !important;
}

.tax-field-row #add-new-tax-btn,
.tax-field-row .remove-tax-btn {
    visibility: visible !important;
    opacity: 1 !important;
    display: inline-block !important;
}

/* Terms & Conditions fields */
.terms-conditions-fields {
    margin-top: 16px;
    padding-left: 8px;
}

.terms-conditions-fields .form-group {
    margin-bottom: 20px;
}

.terms-conditions-fields .form-group:last-child {
    margin-bottom: 0;
}

.terms-conditions-fields textarea.form-control {
    min-height: 300px;
    max-width: 100%;
    width: 100%;
}

.local-edwiserstore-payment-settings .tox-tinymce {
    min-height: 280px;
}

.local-edwiserstore-payment-settings .tox .tox-edit-area__iframe {
    min-height: 220px;
}

.local-edwiserstore-payment-settings .editor_atto {
    min-height: 280px;
}

/* Ensure toggle labels align properly */
.local-edwiserstore-payment-settings .toggle-label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #374151;
    font-size: 14px;
}

.local-edwiserstore-payment-settings .toggle-switch-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .payment-gateway-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .payment-form-row {
        flex-direction: column;
        gap: 0;
    }
    
    .payment-form-group-half {
        width: 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }
    
    .payment-form-group-half:last-child {
        margin-bottom: 0;
    }
    
    .payment-form-group-button {
        width: 100%;
        margin-top: 8px;
        margin-left: 0;
    }
    
    .payment-form-group-button .btn {
        width: 100%;
    }
}

/* Shop Page Styles */
.local-edwiserstore-shop-page {
    padding: 24px;
    width: 100%;
    max-width: 100%;
    margin: 0;
    min-height: calc(100vh - 200px);
}

/* Filters bar - no background or border */
.shop-filters-bar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    flex-wrap: wrap;
    padding: 8px 0px;
}

.shop-search-wrapper {
    position: relative;
    flex: 1;
    min-width: 250px;
    max-width: 400px;
}

.shop-search-input {
    width: 100%;
    padding: 10px 38px 10px 36px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    background: white;
    color: #1f2937;
}

.shop-search-input::placeholder {
    color: #9ca3af;
}

.shop-search-input:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.shop-search-btn {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    padding: 4px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
}

.shop-search-btn:hover {
    color: #2F80ED;
}

.shop-search-clear {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    color: #9ca3af;
    cursor: pointer;
    font-size: 16px;
    padding: 4px;
    line-height: 1;
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: all 0.2s;
}

.shop-search-clear:hover {
    color: #ef4444;
    background: #fee2e2;
}

.shop-category-wrapper {
    min-width: 180px;
}

.shop-category-select,
.shop-sort-select {
    padding: 10px 32px 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
    background: white;
    cursor: pointer;
    appearance: none;
    color: #1f2937;
    min-width: 150px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 8L2 4h8z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 10px;
}

.shop-category-select:focus,
.shop-sort-select:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.shop-controls-right {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-left: auto;
}

.shop-view-toggle {
    display: flex;
    gap: 0;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    padding: 0;
    background: white;
    overflow: hidden;
}

.shop-view-btn {
    background: white;
    border: none;
    padding: 8px 12px;
    cursor: pointer;
    color: #6b7280;
    transition: all 0.2s;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    border-radius: 0;
    margin: 0;
}

.shop-view-icon {
    width: 16px;
    height: 16px;
    display: block;
    pointer-events: none;
    flex-shrink: 0;
}

.shop-view-btn:first-child {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
}

.shop-view-btn:last-child {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.shop-view-btn:not(:last-child) {
    border-right: 1px solid #d1d5db;
}

.shop-view-btn.active {
    background: #2F80ED;
    color: white;
    border-right-color: transparent;
}

.shop-view-btn.active + .shop-view-btn {
    border-left: none;
}

.shop-view-btn:hover:not(.active) {
    background: #f3f4f6;
}

.shop-view-btn:not(.active) .shop-view-icon {
    color: #6b7280;
}

.shop-view-btn:hover:not(.active) .shop-view-icon {
    color: #2F80ED;
}

.shop-view-btn.active .shop-view-icon {
    color: white;
}

.shop-view-btn.active:hover {
    background: #1e6fe0;
}

.shop-view-btn.active:hover .shop-view-icon {
    color: white;
}

.shop-product-count {
    margin-bottom: 24px;
    color: #6b7280;
    font-size: 14px;
    font-weight: 400;
}

/* Empty States */
.shop-empty-state {
    text-align: center;
    padding: 60px 20px 80px;
    margin-top: 40px;
    background: transparent;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.shop-empty-state .empty-icon {
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.shop-empty-state .empty-illustration {
    width: 200px;
    height: 200px;
    max-width: 100%;
    display: block;
}

.shop-empty-state .empty-message {
    font-size: 24px;
    color: #374151;
    font-weight: 600;
    margin-top: 0;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    letter-spacing: -0.015em;
    line-height: 1.4;
}

@media (max-width: 768px) {
    .shop-empty-state {
        padding: 40px 20px 60px;
        margin-top: 30px;
    }
    
    .shop-empty-state .empty-illustration {
        width: 160px;
        height: 160px;
    }
    
    .shop-empty-state .empty-message {
        font-size: 20px;
    }
}

/* Products Container */
.shop-products-container {
    margin-bottom: 40px;
    padding-top: 23px;
    border-top: 1px solid #e0e0e0;
}

/* Card View - Grid Layout */
.shop-products-container.shop-view-card {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(344px, 1fr)); /* Figma: card width 344px */
    gap: 24px;
    width: 100%;
}

/* Card wrapper - should not interfere with grid layout */
.shop-product-card-wrapper {
    width: 100%;
}

/* Responsive grid columns */
@media (min-width: 576px) {
    .shop-products-container.shop-view-card {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 992px) {
    .shop-products-container.shop-view-card {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1200px) {
    .shop-products-container.shop-view-card {
        grid-template-columns: repeat(4, 1fr);
    }
}

.shop-product-card {
    background: white;
    border-radius: 8px;
    border: 1px solid #EBF0F9;
    overflow: hidden;
    transition: transform 0.2s, box-shadow 0.2s;
    width: 100%;
    min-width: 0; /* Prevent flex items from expanding beyond container */
    display: flex;
    flex-direction: column;
    height: 100%;
    box-shadow: none;
}

.shop-product-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.08);
}

.shop-product-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0; /* Prevent flex items from expanding beyond container */
    width: 100%;
}

.shop-product-image-wrapper {
    position: relative;
    width: 100%;
    aspect-ratio: 344 / 200; /* Figma grid view image 344x200 */
    overflow: hidden;
    background: #f3f4f6;
    border-radius: 8px 8px 0 0;
}

.shop-product-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.shop-product-label {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 10px; /* tighter padding */
    border-radius: 3px; /* match Figma tag */
    font-size: 12px; /* slightly smaller text */
    font-weight: 600;
    background-color: #FFFFFF;
    z-index: 10;
    letter-spacing: 0.05em; /* subtle spacing */
    text-transform: uppercase;
    line-height: 1;
}

.shop-label-featured {
    color: #2970F7; /* Figma primary blue */
}

.shop-label-popular {
    color: #FF8A00; /* Figma orange */
}

.shop-label-custom {
    color: #F2994A; /* placeholder secondary */
}

/* Category tag positioned below image, centered */
.shop-product-category-tag {
    background: #EBF0F9;
    color: #313848;
    margin: -12px auto 12px 12px; /* center horizontally */
    padding: 4px 12px;
    border-radius: 3px;
    letter-spacing: 0.5px;
    font-weight: 600;
    z-index: 5;
    position: relative;
    display: block; /* allows auto margins */
    width: fit-content;
    max-width: calc(100% - 32px); /* Safety fallback */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    box-sizing: border-box;
    text-align: center;
    font-size: 12px;
}

.shop-product-info {
    padding: 16px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.shop-product-title {
    font-size: 16px;
    font-weight: 400;
    margin-bottom: 14px;
    margin-top: 0;
    color: #313848;
    line-height: 24px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.shop-product-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 13px;
    color: #6b7280;
    flex-wrap: wrap;
    justify-content: space-between;
}

.shop-meta-item {
    display: flex;
    align-items: center;
    gap: 4px;
}

.shop-meta-item i {
    font-size: 12px;
}

/* Star icon styling for ratings - yellow/gold color */
.shop-meta-item i.fa-star {
    color: #F59E0B; /* Amber/yellow color matching design */
    font-size: 13px;
}

/* Footer section with price and button */
.shop-product-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-top: auto;
    padding-top: 12px;
}

.shop-product-price {
    font-size: 16px;
    font-weight: 700;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 2px;
    align-items: flex-start;
}

.shop-price-free,
.shop-price-enrolled,
.shop-price-actual {
    color: #2F80ED;
}

.shop-price-original {
    color: #9ca3af;
    text-decoration: line-through;
    font-size: 14px;
    font-weight: 400;
    margin-right: 0;
    line-height: 1.2;
}

.shop-product-btn {
    padding: 8px 16px;
    background: white;
    color: #2970F7;
    border: 1px solid #2970F7;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.4;
    height: fit-content;
}

.shop-product-btn:hover {
    background: #2970F7;
    color: white;
    border-color: #2970F7;
}

/* List View */
.shop-products-container.shop-view-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}

/* List wrapper - should not interfere with flex layout */
.shop-product-list-wrapper {
    width: 100%;
}

.shop-product-list-item {
    background: white;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
}

.shop-product-list-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.shop-product-list-link {
    text-decoration: none;
    color: inherit;
    display: flex;
    gap: 20px;
}

/* List view image wrapper fixed size */
.shop-product-list-image-wrapper {
    position: relative;
    width: 390px;
    min-width: 390px;
    height: 208px; /* Figma list view image 390x208 */
    overflow: hidden;
    background: #f3f4f6;
}

.shop-product-list-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.shop-product-list-content {
    flex: 1;
    padding: 20px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.shop-product-description {
    color: #6b7280;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.shop-product-list-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
    font-size: 13px;
    color: #6b7280;
}

.shop-product-list-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: auto;
}

.shop-product-list-footer .shop-product-btn {
    width: auto;
    min-width: 140px;
}

/* Pagination */
.shop-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 40px;
}

.shop-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    color: #374151;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s;
}

.shop-pagination-link:hover {
    background: #f3f4f6;
    border-color: #2F80ED;
    color: #2F80ED;
}

.shop-pagination-link.active {
    background: #2F80ED;
    border-color: #2F80ED;
    color: white;
}

.shop-pagination-ellipsis {
    padding: 0 8px;
    color: #6b7280;
}

/* Convert Courses Pagination - Modern design with rounded buttons */
.convert-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.convert-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #4285f4;
    border-radius: 10px;
    background: #ffffff;
    color: #4285f4;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.convert-pagination-link:hover {
    background: #f8f9fa;
    border-color: #4285f4;
    color: #4285f4;
    text-decoration: none;
}

/* Inactive page numbers - plain text, no border */
.convert-pagination-link:not(.convert-pagination-prev):not(.convert-pagination-next) {
    border: none;
    background: transparent;
    color: #6c757d;
    min-width: auto;
    padding: 0 8px;
}

.convert-pagination-link:not(.convert-pagination-prev):not(.convert-pagination-next):hover {
    background: transparent;
    color: #4285f4;
}

/* Current/Active page - white background with shadow, no border */
.convert-pagination-link.active:not(.convert-pagination-prev):not(.convert-pagination-next) {
    background: #ffffff;
    border: none;
    color: #343a40;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    min-width: 40px;
    padding: 0 12px;
}

.convert-pagination-link.active:not(.convert-pagination-prev):not(.convert-pagination-next):hover {
    background: #ffffff;
    color: #343a40;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Ellipsis - plain text */
.convert-pagination-ellipsis {
    padding: 0 8px;
    color: #6c757d;
    font-size: 14px;
}

/* Convert Products Pagination - Same modern design as convert courses pagination */
.convert-products-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.convert-products-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #4285f4;
    border-radius: 10px;
    background: #ffffff;
    color: #4285f4;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.convert-products-pagination-link:hover {
    background: #f8f9fa;
    border-color: #4285f4;
    color: #4285f4;
    text-decoration: none;
}

/* Inactive page numbers - plain text, no border */
.convert-products-pagination-link:not(.convert-products-pagination-prev):not(.convert-products-pagination-next) {
    border: none;
    background: transparent;
    color: #6c757d;
    min-width: auto;
    padding: 0 8px;
}

.convert-products-pagination-link:not(.convert-products-pagination-prev):not(.convert-products-pagination-next):hover {
    background: transparent;
    color: #4285f4;
}

/* Current/Active page - white background with shadow, no border */
.convert-products-pagination-link.active:not(.convert-products-pagination-prev):not(.convert-products-pagination-next) {
    background: #ffffff;
    border: none;
    color: #343a40;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    min-width: 40px;
    padding: 0 12px;
}

.convert-products-pagination-link.active:not(.convert-products-pagination-prev):not(.convert-products-pagination-next):hover {
    background: #ffffff;
    color: #343a40;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Ellipsis - plain text */
.convert-products-pagination-ellipsis {
    padding: 0 8px;
    color: #6c757d;
    font-size: 14px;
}

/* Products Pagination - Same modern design as convert pagination */
.products-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.products-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #4285f4;
    border-radius: 10px;
    background: #ffffff;
    color: #4285f4;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.products-pagination-link:hover {
    background: #f8f9fa;
    border-color: #4285f4;
    color: #4285f4;
    text-decoration: none;
}

/* Inactive page numbers - plain text, no border */
.products-pagination-link:not(.products-pagination-prev):not(.products-pagination-next) {
    border: none;
    background: transparent;
    color: #6c757d;
    min-width: auto;
    padding: 0 8px;
}

.products-pagination-link:not(.products-pagination-prev):not(.products-pagination-next):hover {
    background: transparent;
    color: #4285f4;
}

/* Current/Active page - white background with shadow, no border */
.products-pagination-link.active:not(.products-pagination-prev):not(.products-pagination-next) {
    background: #ffffff;
    border: none;
    color: #343a40;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    min-width: 40px;
    padding: 0 12px;
}

.products-pagination-link.active:not(.products-pagination-prev):not(.products-pagination-next):hover {
    background: #ffffff;
    color: #343a40;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Ellipsis - plain text */
.products-pagination-ellipsis {
    padding: 0 8px;
    color: #6c757d;
    font-size: 14px;
}

/* Coupons Pagination - Same modern design as convert and products pagination */
.coupons-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 24px;
}

.coupons-pagination-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 12px;
    border: 1px solid #4285f4;
    border-radius: 10px;
    background: #ffffff;
    color: #4285f4;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.coupons-pagination-link:hover {
    background: #f8f9fa;
    border-color: #4285f4;
    color: #4285f4;
    text-decoration: none;
}

/* Inactive page numbers - plain text, no border */
.coupons-pagination-link:not(.coupons-pagination-prev):not(.coupons-pagination-next) {
    border: none;
    background: transparent;
    color: #6c757d;
    min-width: auto;
    padding: 0 8px;
}

.coupons-pagination-link:not(.coupons-pagination-prev):not(.coupons-pagination-next):hover {
    background: transparent;
    color: #4285f4;
}

/* Current/Active page - white background with shadow, no border */
.coupons-pagination-link.active:not(.coupons-pagination-prev):not(.coupons-pagination-next) {
    background: #ffffff;
    border: none;
    color: #343a40;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    font-weight: 600;
    min-width: 40px;
    padding: 0 12px;
}

.coupons-pagination-link.active:not(.coupons-pagination-prev):not(.coupons-pagination-next):hover {
    background: #ffffff;
    color: #343a40;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
}

/* Ellipsis - plain text */
.coupons-pagination-ellipsis {
    padding: 0 8px;
    color: #6c757d;
    font-size: 14px;
}

/* Product Price Cell in Tables */
.product-price-cell {
    white-space: nowrap;
}

.product-price-cell .text-muted {
    text-decoration: line-through;
    margin-right: 8px;
}

/* Responsive */
@media (max-width: 768px) {
    .shop-filters-bar {
        flex-direction: column;
        align-items: stretch;
    }
    
    .shop-search-wrapper {
        max-width: 100%;
    }
    
    .shop-controls-right {
        margin-left: 0;
        width: 100%;
        justify-content: space-between;
    }
    
    .shop-products-container.shop-view-card {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    .shop-product-list-link {
        flex-direction: column;
    }
    
    .shop-product-list-image-wrapper {
        width: 100%;
        height: 200px;
    }
    
    .shop-product-list-footer {
        flex-direction: column;
        align-items: stretch;
        gap: 12px;
    }
    
    .shop-product-list-footer .shop-product-btn {
        width: 100%;
    }
}
/* Product View Page Styles */
.local-edwiserstore-product-view-page {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    background-color: #f5f7fa; /* Light background for contrast */
}

/* Top Wrapper: Header Container and Sidebar Container Side by Side */
.product-view-top-wrapper {
    display: flex;
    flex-direction: row;
    gap: 24px;
    margin-bottom: 24px;
    align-items: flex-start;
}

/* Product Header Container */
.product-view-header-container {
    background: #ffffff;
    border-radius: 12px;
    padding: 32px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    flex: 1;
    min-width: 0;
}

/* Product Header */
.product-view-header {
    margin-bottom: 24px;
}

.product-view-title {
    font-size: 2.5em;
    font-weight: 700;
    color: #2C3E50;
    margin-bottom: 20px;
    line-height: 1.3;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}

.product-view-header-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 48px;
    align-items: flex-start;
}

.product-view-header-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    flex: 0 1 auto;
}

.product-view-header-item:last-child {
    flex: 1 1 auto;
}

.product-view-header-label {
    font-size: 0.9em;
    color: #555555;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
}

.product-view-header-value {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.9em;
    color: #555555;
    font-weight: 400;
    flex-wrap: wrap;
    word-break: break-word;
}

.product-view-instructor-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}

.product-view-instructor-names {
    color: #555555;
    font-weight: 400;
}

.product-view-instructor-names .instructor-count {
    color: #007bff;
    font-weight: 600;
    margin-left: 4px;
}

.product-view-star-icon {
    color: #FFD700;
    font-size: 16px;
    margin-right: 4px;
}

/* Main Content Wrapper - Full Width Below Top Section */
.product-view-main-content-wrapper {
    width: 100%;
    margin-bottom: 48px;
}

/* Content Container (Tabs + Content) */
.product-view-content-container {
    background: #ffffff;
    border-radius: 12px;
    padding: 0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    overflow: hidden;
    min-height: 200px;
    display: block;
    width: 100%;
}

.product-view-sidebar {
    width: 340px;
    flex-shrink: 0;
}

/* Sidebar Container */
.product-view-sidebar-container {
    background: #ffffff;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    height: fit-content;
    width: 340px;
    flex-shrink: 0;
}

/* Product Media Section */
.product-view-media-section {
    margin-top: 0;
}

.product-view-video-wrapper {
    position: relative;
    width: 100%;
    padding-bottom: 56.25%;
    margin-bottom: 0;
    background: #000;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    cursor: pointer;
}

.product-view-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.product-view-video-wrapper:not(.playing)::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 80px;
    height: 80px;
    background: #007bff;
    border-radius: 50%;
    z-index: 10;
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.4);
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.product-view-video-wrapper:not(.playing):hover::before {
    transform: translate(-50%, -50%) scale(1.05);
    box-shadow: 0 6px 16px rgba(0, 123, 255, 0.5);
}

.product-view-video-wrapper:not(.playing)::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-left: 20px solid #ffffff;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    margin-left: 4px;
    z-index: 11;
    pointer-events: none;
}

.product-view-video-wrapper.playing::before,
.product-view-video-wrapper.playing::after {
    display: none;
}

.product-view-image-wrapper,
.product-view-image-wrapper-no-video {
    width: 100%;
    margin-bottom: 0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.product-view-image {
    width: 100%;
    height: auto;
    display: block;
}

.product-view-secondary-image-wrapper {
    width: 100%;
    margin-top: 24px;
    border-radius: 8px;
    overflow: hidden;
}

.product-view-secondary-image {
    width: 100%;
    height: auto;
    display: block;
}

/* Tabs Navigation */
.product-view-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid #e2e8f0;
    margin-bottom: 0;
    background: #ffffff;
    padding: 0 24px;
}

.product-view-tab {
    padding: 16px 24px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    color: #6c757d;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.product-view-tab:hover {
    color: #2F80ED;
    background: #f5f8ff;
}

.product-view-tab.active {
    color: #2F80ED;
    border-bottom-color: #2F80ED;
    background: transparent;
}

/* Tab Content */
.product-view-tab-content {
    min-height: 400px;
    padding: 24px;
    background: #ffffff;
}

.product-view-tab-panel {
    display: none;
}

.product-view-tab-panel.active {
    display: block;
}

/* Description Section */
.product-view-description-content {
    line-height: 1.8;
}

.product-view-section-title {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin-bottom: 24px;
}

.product-view-subsection-title {
    font-size: 18px;
    font-weight: 600;
    color: #374151;
    margin-top: 32px;
    margin-bottom: 16px;
}

.product-view-description-text {
    font-size: 16px;
    color: #374151;
    line-height: 1.8;
    margin-bottom: 24px;
}

.product-view-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.product-view-list li {
    padding: 8px 0;
    padding-left: 24px;
    position: relative;
    font-size: 16px;
    color: #374151;
    line-height: 1.6;
}

.product-view-list li:before {
    content: '•';
    position: absolute;
    left: 8px;
    color: #2F80ED;
    font-weight: bold;
}

/* Course Content Accordion (Remui style) */
.product-view-content-section {
    margin-bottom: 32px;
}

.accordion {
    width: 100%;
}

.accordion-list-group {
    list-style: none;
    padding: 0;
    margin: 0;
}

.accordion-list-item {
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 16px;
    color: #374151;
    transition: background 0.2s;
}

.accordion-list-item:hover {
    background: #f9fafb;
}

.accordion-list-item.collapsed {
    background: #fff;
}

.accordion-list-item:not(.collapsed) {
    background: #f5f8ff;
}

.accordion-list-item.d-flex {
    padding-left: 48px;
    cursor: default;
}

.accordion-list-item.d-flex:hover {
    background: transparent;
}

.accordion-list-item img {
    width: 20px;
    height: 20px;
    margin-right: 12px;
}

.accordion-bb {
    border-bottom: 1px solid #e2e8f0;
}

.p-pl-2 {
    padding-left: 16px;
}

.edw-icon {
    font-size: 16px;
    transition: transform 0.3s;
}

.accordion-list-item.collapsed .edw-icon {
    transform: rotate(-90deg);
}

.collapse {
    display: none;
}

.collapse.show {
    display: block;
}

/* Instructor Section */
.product-view-instructor-section {
    margin-bottom: 32px;
}

.product-view-instructor-card {
    display: flex;
    gap: 24px;
    padding: 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    margin-bottom: 24px;
}

.product-view-instructor-profile {
    flex-shrink: 0;
}

.product-view-instructor-avatar-large {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
}

.product-view-instructor-info {
    flex: 1;
}

.product-view-instructor-name {
    font-size: 20px;
    font-weight: 700;
    color: #212529;
    margin-bottom: 12px;
}

.product-view-instructor-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 16px;
    font-size: 14px;
    color: #6c757d;
}

.product-view-instructor-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
}

.product-view-instructor-meta-item i {
    color: #2F80ED;
}

.product-view-instructor-meta-item a {
    color: #2F80ED;
    text-decoration: none;
}

.product-view-instructor-meta-item a:hover {
    text-decoration: underline;
}

.product-view-instructor-bio {
    font-size: 15px;
    color: #374151;
    line-height: 1.7;
}

/* Reviews Section */
.product-view-reviews-section {
    margin-bottom: 32px;
}

.product-view-reviews-summary {
    display: flex;
    gap: 48px;
    margin-bottom: 32px;
    padding: 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.product-view-reviews-overall {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 200px;
}

.product-view-reviews-average {
    font-size: 48px;
    font-weight: 700;
    color: #212529;
    line-height: 1;
    margin-bottom: 8px;
}

.product-view-reviews-label {
    font-size: 14px;
    color: #6c757d;
    margin-bottom: 12px;
}

.product-view-reviews-stars {
    display: flex;
    gap: 4px;
    margin-bottom: 12px;
}

.product-view-reviews-stars .fa-star {
    font-size: 20px;
    color: #FFD700;
}

.product-view-reviews-stars .fa-star:not(.filled) {
    color: #d1d5db;
}

.product-view-reviews-count {
    font-size: 14px;
    color: #6c757d;
}

.product-view-reviews-distribution {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 12px;
}

.product-view-review-bar-row {
    display: flex;
    align-items: center;
    gap: 12px;
}

.product-view-review-bar-container {
    flex: 1;
    height: 8px;
    background: #e2e8f0;
    border-radius: 4px;
    overflow: hidden;
}

.product-view-review-bar-fill {
    height: 100%;
    background: #FFD700;
    transition: width 0.3s;
}

.product-view-review-bar-stars {
    display: flex;
    gap: 2px;
    min-width: 80px;
}

.product-view-review-bar-stars .fa-star {
    font-size: 12px;
    color: #FFD700;
}

.product-view-review-bar-stars .fa-star:not(.filled) {
    color: #d1d5db;
}

.product-view-review-bar-percentage {
    font-size: 14px;
    color: #374151;
    min-width: 40px;
    text-align: right;
}

.product-view-reviews-list {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.product-view-review-item {
    padding: 24px;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
}

.product-view-review-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 16px;
}

.product-view-review-user {
    display: flex;
    gap: 12px;
    align-items: flex-start;
}

.product-view-review-user .userpicture {
    width: 48px;
    height: 48px;
    border-radius: 50%;
}

.product-view-review-user-info {
    flex: 1;
}

.product-view-review-user-name {
    font-size: 16px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 4px;
}

.product-view-review-rating {
    font-size: 14px;
}

.product-view-review-date {
    font-size: 14px;
    color: #6c757d;
}

.product-view-review-text {
    font-size: 15px;
    color: #374151;
    line-height: 1.7;
}

/* Sidebar Styles */
.product-view-sidebar-image {
    width: 100%;
    margin-bottom: 24px;
    border-radius: 8px;
    overflow: hidden;
}

.product-view-sidebar-image img {
    width: 100%;
    height: auto;
    display: block;
}

.product-view-pricing {
    padding: 0 24px;
    background: transparent;
    border: none;
    border-radius: 0;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e2e8f0;
}

.product-view-price-row {
    display: flex;
    align-items: baseline;
    gap: 12px;
    margin-bottom: 20px;
    flex-wrap: wrap;
}

.product-view-price-original {
    font-size: 18px;
    color: #9ca3af;
    text-decoration: line-through;
}

.product-view-price-actual {
    font-size: 32px;
    font-weight: 700;
    color: #2F80ED;
}

.product-view-sale-tag {
    display: inline-block;
    padding: 4px 8px;
    background: #FFD700;
    color: #212529;
    font-size: 12px;
    font-weight: 600;
    border-radius: 4px;
    text-transform: uppercase;
}

.product-view-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.product-view-btn {
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    border: none;
}

.product-view-btn-cart {
    background: #fff;
    color: #2F80ED;
    border: 2px solid #2F80ED;
}

.product-view-btn-cart:hover {
    background: #f5f8ff;
}

.product-view-btn-buy {
    background: #2F80ED;
    color: #fff;
}

.product-view-btn-buy:hover {
    background: #1e6fe0;
}

/* Course Info Sidebar */
.product-view-course-info {
    padding: 0 24px;
    background: transparent;
    border: none;
    border-radius: 0;
}

.course-info-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #f3f4f6;
}

.course-info-item:last-child {
    border-bottom: none;
}

.course-info-item i {
    color: #2F80ED;
    font-size: 18px;
    margin-right: 12px;
    width: 24px;
    text-align: center;
}

.course-info-label {
    flex: 1;
    font-size: 14px;
    color: #6c757d;
}

.course-info-value {
    font-size: 14px;
    color: #212529;
    font-weight: 500;
}

/* Related Products Section */
.product-view-related-products {
    margin-top: 48px;
    padding-top: 48px;
    border-top: 1px solid #e2e8f0;
}

.related-products-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px;
}

.related-products-header h3 {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.related-products-view-all {
    background: transparent;
    border: none;
    color: #2F80ED;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    padding: 0;
    text-decoration: none;
}

.related-products-view-all:hover {
    text-decoration: underline;
}

.related-products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 24px;
}

/* Responsive Design */
@media (max-width: 1024px) {
    .product-view-top-wrapper {
        flex-direction: column;
    }
    
    .product-view-sidebar-container {
        width: 100%;
    }
    
    .product-view-header-container {
        width: 100%;
    }
    
    .product-view-reviews-summary {
        flex-direction: column;
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .local-edwiserstore-product-view-page {
        padding: 16px;
    }
    
    .product-view-header-container {
        padding: 24px;
    }
    
    .product-view-title {
        font-size: 24px;
    }
    
    .product-view-header-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    
    .product-view-tabs {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0 16px;
    }
    
    .product-view-tab {
        white-space: nowrap;
        padding: 12px 16px;
    }
    
    .product-view-tab-content {
        padding: 16px;
    }
    
    .product-view-instructor-card {
        flex-direction: column;
    }
    
    .related-products-grid {
        grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
        gap: 16px;
    }
}

/* Cart Page Styles */
.local-edwiserstore-cart-page {
    padding: 24px 0;
    max-width: 1400px;
    margin: 0 auto;
}

.cart-page-container {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    padding: 24px;
    background-color: #ffffff;
}

.cart-items-section {
    flex: 1;
    min-width: 0;
}

.cart-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.cart-header-bottom {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
}

.cart-title {
    font-size: 32px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.cart-item-count {
    font-size: 16px;
    color: #6c757d;
    font-weight: 400;
    white-space: nowrap;
}

.cart-delete-all {
    background-color: #2F80ED !important;
    color: #fff !important;
    border: 1px solid #2F80ED !important;
    font-size: 14px;
    padding: 8px 16px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 400;
    transition: background-color 0.2s ease, border-color 0.2s ease;
    box-shadow: none;
}

.cart-delete-all:hover,
.cart-delete-all:focus {
    background-color: #1e6fe0 !important;
    border-color: #1e6fe0 !important;
    color: #fff !important;
    text-decoration: none;
    box-shadow: none;
}

.cart-delete-all:active {
    background-color: #1a5fc7 !important;
    border-color: #1a5fc7 !important;
    box-shadow: none;
}

.cart-delete-all i {
    color: #fff !important;
    font-size: 14px;
}

.cart-items-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.cart-item-card {
    display: flex;
    gap: 20px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid #e2e8f0;
}

.cart-item-image-wrapper {
    flex-shrink: 0;
    width: 240px;
    height: auto;
    border-radius: 8px;
    overflow: hidden;
    background: #f5f7fa;
}

.cart-item-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cart-item-details {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 20px 0;
}

.cart-item-category-tag {
    display: inline-block;
    padding: 4px 12px;
    background: #f3f4f6;
    color: #374151;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 8px;
    width: fit-content;
}

.cart-item-title {
    font-size: 18px;
    font-weight: 600;
    color: #212529;
    margin: 0;
    line-height: 1.4;
}

.cart-item-meta {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 4px;
}

.cart-meta-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #6c757d;
}

.cart-meta-item i {
    color: #FFD700;
}

.cart-meta-item i.fa-users {
    color: #6c757d;
}

.cart-item-price {
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
    margin-top: 8px;
}

.cart-price-original {
    font-size: 16px;
    color: #9ca3af;
    text-decoration: line-through;
}

.cart-price-actual {
    font-size: 20px;
    font-weight: 700;
    color: #2F80ED;
}

.cart-sale-tag {
    display: inline-block;
    padding: 4px 10px;
    background: #FFD700;
    color: #212529;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.cart-item-actions {
    flex-shrink: 0;
    display: flex;
    align-items: flex-end;
    padding: 20px;
}

.cart-item-delete {
    background-color: #2F80ED;
    color: #fff;
    border-color: #2F80ED;
    font-size: 14px;
    padding: 6px 12px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.cart-item-delete:hover,
.cart-item-delete:focus {
    background-color: #1e6fe0;
    border-color: #1e6fe0;
    color: #fff;
}

.cart-item-delete i {
    color: #fff;
}

.cart-order-summary-section {
    flex-shrink: 0;
    width: 380px;
}

.order-summary-card {
    background: #fff;
    padding: 24px;
    padding-bottom: 0;
    top: 20px;
}

.order-summary-title {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 0 0 24px 0;
}

.order-summary-details {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-bottom: 24px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.summary-label {
    font-size: 16px;
    color: #374151;
    font-weight: 500;
}

.summary-value {
    font-size: 16px;
    color: #212529;
    font-weight: 600;
}

.summary-row.total-row {
    padding-top: 16px;
    border-top: 2px solid #e2e8f0;
    margin-top: 8px;
}

.summary-row.total-row .summary-label,
.summary-row.total-row .summary-value {
    font-size: 20px;
    font-weight: 700;
}

.total-value {
    color: #212529;
}

.coupon-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.coupon-input-container {
    flex: 1;
    display: flex;
    flex-direction: row;
    align-items: flex-end;
    gap: 4px;
}

.coupon-input-wrapper {
    display: flex;
    gap: 8px;
    width: 100%;
    max-width: 300px;
    margin-left: auto;
}

.coupon-input {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 14px;
}

.coupon-input:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.coupon-apply-btn {
    padding: 8px 16px;
    background: #2F80ED;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.coupon-apply-btn:hover {
    background: #1e6fe0;
}

.order-summary-actions {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.proceed-checkout-btn {
    width: 100%;
    padding: 14px 24px;
    background: #2F80ED;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    display: block;
}

.proceed-checkout-btn:hover {
    background: #1e6fe0;
    color: #fff;
    text-decoration: none;
}

.continue-shopping-btn,
.continue-shopping-btn-empty {
    width: 100%;
    padding: 10px 24px;
    background: transparent;
    color: #2F80ED;
    border: none;
    font-size: 14px;
    text-align: center;
    text-decoration: none;
    display: block;
}

.continue-shopping-btn:hover,
.continue-shopping-btn-empty:hover {
    color: #1e6fe0;
    text-decoration: underline;
}

/* Empty Cart State */
.cart-empty-state {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 80px 24px;
    text-align: center;
}

.cart-empty-illustration {
    margin-bottom: 32px;
}

.empty-cart-image {
    max-width: 400px;
    width: 100%;
    height: auto;
}

.cart-empty-content {
    max-width: 500px;
}

.cart-empty-title {
    font-size: 28px;
    font-weight: 700;
    color: #212529;
    margin: 0 0 16px 0;
}

.cart-empty-message {
    font-size: 16px;
    color: #6c757d;
    margin: 0 0 32px 0;
    line-height: 1.6;
}

/* Delete Confirmation Modal */
.cart-delete-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.cart-delete-modal-content {
    background: #fff;
    border-radius: 8px;
    width: 90%;
    max-width: 500px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
}

.cart-delete-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.cart-delete-modal-header h4 {
    font-size: 20px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.cart-delete-modal-close {
    background: none;
    border: none;
    font-size: 28px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.cart-delete-modal-close:hover {
    color: #212529;
}

.cart-delete-modal-body {
    padding: 24px;
}

.cart-delete-modal-body p {
    font-size: 16px;
    color: #374151;
    margin: 0;
    line-height: 1.6;
}

.cart-delete-modal-footer {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
}

.cart-delete-modal-footer .btn {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    min-width: 80px;
}

.cart-delete-cancel {
    background: #fff;
    color: #2F80ED;
    border: 1px solid #2F80ED;
}

.cart-delete-cancel:hover {
    background: #f5f8ff;
}

.cart-delete-confirm {
    background: #2F80ED;
    color: #fff;
}

.cart-delete-confirm:hover {
    background: #1e6fe0;
}

/* Responsive Cart Page */
@media (max-width: 1024px) {
    .cart-page-container {
        flex-direction: column;
    }
    
    .cart-order-summary-section {
        width: 100%;
    }
    
    .order-summary-card {
        position: static;
    }
}

@media (max-width: 768px) {
    .local-edwiserstore-cart-page {
        padding: 16px;
    }
    
    .cart-item-card {
        flex-direction: column;
        padding: 16px;
    }
    
    .cart-item-image-wrapper {
        width: 100%;
        height: 200px;
    }
    
    .cart-header-bottom {
        flex-wrap: wrap;
    }
    
    .cart-title {
        font-size: 24px;
    }
    
    .cart-empty-title {
        font-size: 24px;
    }
    
    .cart-empty-illustration {
        margin-bottom: 24px;
    }
    
    .empty-cart-image {
        max-width: 300px;
    }
}

@media (max-width: 576px) {
    .cart-item-meta {
        flex-direction: column;
        gap: 8px;
    }
    
    .coupon-input-wrapper {
        flex-direction: column;
    }
    
    .coupon-apply-btn {
        width: 100%;
    }
}

/* Coupons Page Styles */
.local-edwiserstore-coupons-page {
    padding: 24px;
    background: #fff;
    border-radius: 8px;
}

.coupons-page-header {
    margin-bottom: 24px;
}

.coupons-page-title {
    font-size: 24px;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.coupons-search-wrapper {
    margin-bottom: 20px;
}

.coupons-search-form {
    display: flex;
    align-items: center;
    gap: 12px;
}

.coupons-search-input-wrapper {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.coupons-search-input {
    width: 100%;
    padding: 10px 40px 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

.coupons-search-btn {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    background: transparent;
    border: none;
    padding: 0 12px;
    color: #6c757d;
    cursor: pointer;
}

.coupons-search-btn:hover {
    color: #495057;
}

.coupons-count-message {
    font-size: 14px;
    color: #6c757d;
}

/* Coupon Editor Modal Styles - Using Moodle ModalFactory */
.modal-sidebar.modal-dialog {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: auto !important;
    margin: 0 !important;
    max-width: 50vw !important;
    width: 50vw !important;
    transform: none !important;
}

.modal-sidebar .modal-content {
    height: 100vh;
    border-radius: 0;
    display: flex;
    flex-direction: column;
}

.modal-sidebar .modal-header {
    padding: 16px 20px;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.modal-sidebar .modal-body {
    flex: 1;
    overflow-y: auto;
    padding: 24px;
}

.modal-sidebar .modal-footer {
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
}

/* Product editor styles in ModalFactory sidebar */
.modal-sidebar .edwiser-editor-body {
    padding: 0; /* Remove padding since modal-body already has it */
}

.modal-sidebar .edwiser-editor-footer {
    padding: 0; /* Remove padding since modal-footer already has it */
}

/* Ensure product editor form styles work in modal-sidebar */

/* Orders Page Styles */
.local-edwiserstore-orders-page {
    padding: 24px;
    background: #fff;
    border-radius: 8px;
}

.orders-page-header {
    margin-bottom: 24px;
}

.orders-page-title {
    font-size: 24px;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.orders-search-wrapper {
    margin-bottom: 20px;
}

.orders-search-form {
    display: flex;
    align-items: center;
    gap: 12px;
}

.orders-search-input-wrapper {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.orders-search-input {
    width: 100%;
    padding: 10px 40px 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

.orders-search-btn {
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    background: transparent;
    border: none;
    padding: 0 12px;
    color: #6c757d;
    cursor: pointer;
}

.orders-search-btn:hover {
    color: #495057;
}

.orders-count-message {
    font-size: 14px;
    color: #6c757d;
}

.orders-empty-state {
    padding: 60px 20px;
}

.orders-empty-illustration {
    margin-bottom: 20px;
}

.orders-empty-title {
    font-size: 20px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 10px;
}

.orders-empty-message {
    font-size: 14px;
    color: #6c757d;
}

/* Order Details Modal Styles */
.order-details-body {
    padding: 0;
}

.order-details-section {
    margin-bottom: 32px;
}

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

.order-details-section-title {
    font-size: 16px;
    font-weight: 600;
    color: #212529;
    margin: 0;
    padding: 12px 16px;
    background-color: #f8f9fa;
    border-radius: 4px 4px 0 0;
    margin-bottom: 0;
}

.order-details-summary {
    display: flex;
    flex-direction: column;
    padding: 16px;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-top: none;
    border-radius: 0 0 4px 4px;
}

.order-details-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    border-bottom: 1px solid #f1f3f5;
}

.order-details-row:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.order-details-label {
    font-weight: 500;
    color: #495057;
    font-size: 14px;
    flex: 1;
}

.order-details-value {
    color: #212529;
    text-align: right;
    font-size: 14px;
    flex: 1;
}

.order-details-customer {
    padding: 16px;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-top: none;
    border-radius: 0 0 4px 4px;
}

.order-customer-name {
    font-size: 14px;
    color: #212529;
    margin-bottom: 8px;
}

.order-customer-name strong {
    font-weight: 600;
    color: #212529;
}

.order-customer-email {
    font-size: 14px;
    color: #666666;
    font-weight: 400;
}

/* Purchased Products Section - Unified Card Design */
.order-products-section {
    background-color: #ffffff;
    border: 1px solid #e0e6ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.order-products-section .order-details-section-title {
    background-color: #f8fafc;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e6ed;
    border-radius: 8px 8px 0 0;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

.order-products-container {
    background-color: #ffffff;
    padding: 0;
}

.order-products-list {
    margin: 0;
    padding: 20px;
    background-color: transparent;
    border: none;
    border-radius: 0;
}

.order-product-item {
    padding: 0;
    margin-bottom: 16px;
    background: transparent;
}

.order-product-item:last-child {
    margin-bottom: 0;
}

.order-product-content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 16px;
}

.order-product-title {
    font-weight: 400;
    color: #212529;
    font-size: 14px;
    line-height: 1.5;
    flex: 1;
}

.order-product-price {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

.order-product-original-price {
    text-decoration: line-through;
    color: #6c757d;
    font-size: 14px;
    font-weight: 400;
}

.order-product-actual-price {
    font-weight: 400;
    color: #212529;
    font-size: 14px;
}

.order-cost-breakdown {
    border-top: 1px solid #e2e8f0;
    padding: 16px 20px 0 20px;
    margin: 0;
}

.order-cost-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    font-size: 14px;
}

.order-cost-row.order-cost-discount .order-cost-value {
    color: #28a745;
    font-weight: 400;
}

.order-cost-row.order-cost-total {
    background-color: #f5f5f5;
    padding: 12px 20px;
    border-radius: 0;
    margin: 16px -20px 0 -20px;
    border-top: 1px solid #e2e8f0;
}

.order-cost-label {
    color: #212529;
    font-weight: 400;
}

.order-cost-value {
    color: #212529;
    font-weight: 400;
}

.order-cost-row.order-cost-total .order-cost-label,
.order-cost-row.order-cost-total .order-cost-value {
    font-weight: 600;
    font-size: 16px;
    color: #212529;
}

/* Status Badges for Orders */
.order-details-body .badge-success,
.modal-sidebar .badge-success {
    background-color: #28a745;
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.order-details-body .badge-danger,
.modal-sidebar .badge-danger {
    background-color: #dc3545;
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.order-details-body .badge-warning,
.modal-sidebar .badge-warning {
    background-color: #ffc107;
    color: #212529;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.order-details-body .badge-dark,
.modal-sidebar .badge-dark {
    background-color: #343a40;
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.order-details-body .badge-secondary,
.modal-sidebar .badge-secondary {
    background-color: #6c757d;
    color: white;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

/* Order Summary Container - Admin Orders Page Design */
#page-local-edwiserstore-orders .modal-body .order-details-section:first-child {
    background-color: #ffffff;
    border: 1px solid #e0e6ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-section-title {
    background-color: #f8fafc;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e6ed;
    border-radius: 8px 8px 0 0;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

#page-local-edwiserstore-orders .order-details-section:first-child .order-details-summary {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    padding: 20px;
    background-color: #ffffff;
    border-top: none;
    border-radius: 0 0 8px 8px;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row {
    display: contents;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row > * {
    padding: 0 8px;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row:first-child > * {
    padding-bottom: 16px;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-label {
    font-weight: 600;
    color: #495057;
    font-size: 1rem;
    text-align: left;
    flex: none;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row:first-child .order-details-label:last-child {
    text-align: right;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-value {
    font-weight: 400;
    color: #212529;
    font-size: 0.9rem;
    text-align: left;
    flex: none;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row:last-child .order-details-value:last-child {
    text-align: right;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-summary-container {
    background-color: #ffffff;
    border: 1px solid #e0e6ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.order-details-body .order-summary-header {
    background-color: #f8fafc;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e6ed;
    border-radius: 8px 8px 0 0;
}

.order-details-body .order-summary-title {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
    line-height: 1.5;
}

.order-details-body .order-summary-content {
    padding: 20px;
    background-color: #ffffff;
    border-radius: 0 0 8px 8px;
}

.order-details-body .order-summary-labels-row,
.order-details-body .order-summary-values-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
    gap: 20px;
    align-items: start;
}

.order-details-body .order-summary-labels-row {
    margin-bottom: 16px;
}

.order-details-body .order-summary-cell {
    font-size: 0.9rem;
    color: #212529;
    word-break: break-word;
    text-align: left;
}

.order-details-body .order-summary-labels-row .order-summary-cell {
    font-weight: 600;
    color: #495057;
    font-size: 1rem;
}

.order-details-body .order-summary-values-row .order-summary-cell {
    font-weight: 400;
    color: #212529;
}

/* Total column should be right-aligned */
.order-details-body .order-summary-labels-row .order-summary-cell:last-child,
.order-details-body .order-summary-values-row .order-summary-cell:last-child {
    text-align: right;
}

.order-details-body .order-date-line {
    line-height: 1.5;
    margin-bottom: 2px;
    color: #212529;
    font-size: 0.9rem;
}

.order-details-body .order-time-line {
    line-height: 1.5;
    color: #6c757d;
    font-size: 0.875rem;
    margin-top: 0;
}

.order-details-body .order-summary-cell .badge {
    padding: 4px 12px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.875rem;
    display: inline-block;
    white-space: nowrap;
}

/* Related Subscription Section - Admin Orders */
/* Apply same grid layout as Order Summary to subscription section */
#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-summary {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    padding: 20px;
    background-color: #ffffff;
    border: 1px solid #e0e8ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row {
    display: contents;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row > * {
    padding: 0 8px;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row:first-child > * {
    padding-bottom: 16px;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-label {
    font-weight: 600;
    color: #495057;
    font-size: 1rem;
    text-align: left;
    flex: none;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row:first-child .order-details-label:last-child {
    text-align: right;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-value {
    font-weight: 400;
    color: #212529;
    font-size: 0.9rem;
    text-align: left;
    flex: none;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row:last-child .order-details-value:last-child {
    text-align: right;
}

/* Subscription ID link styling */
.subscription-id-link {
    color: #0d6efd;
    text-decoration: underline;
    cursor: pointer;
}

.subscription-id-link:hover {
    color: #0a58ca;
    text-decoration: underline;
}

/* Responsive adjustments for Order Summary - Admin Orders */
@media (max-width: 768px) {
    #page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-summary {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row:first-child > * {
        padding-bottom: 8px;
        border-bottom: 1px solid #e0e6ed;
        margin-bottom: 8px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:first-child .order-details-row > * {
        padding: 4px 0;
        text-align: left !important;
    }
    
    /* Responsive adjustments for Subscription Section */
    #page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-summary {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row:first-child > * {
        padding-bottom: 8px;
        border-bottom: 1px solid #e0e6ed;
        margin-bottom: 8px;
    }
    
    #page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-summary):not(:first-child) .order-details-row > * {
        padding: 4px 0;
        text-align: left !important;
    }
}

/* Customer Section - Admin Orders Page */
#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) {
    background-color: #ffffff;
    border: 1px solid #e0e6ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) .order-details-section-title {
    background-color: #f8fafc;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e6ed;
    border-radius: 8px 8px 0 0;
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
    color: #212529;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) .order-details-customer {
    padding: 16px 20px;
    background-color: #ffffff;
    border: none;
    border-top: none;
    border-radius: 0 0 8px 8px;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) .order-customer-name {
    font-size: 14px;
    color: #212529;
    margin-bottom: 10px;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) .order-customer-name strong {
    font-weight: 600;
    color: #212529;
}

#page-local-edwiserstore-orders .modal-body .order-details-section:has(.order-details-customer) .order-customer-email {
    font-size: 14px;
    color: #666666;
    font-weight: 400;
}

/* Order Details Modal Header */
.modal-sidebar .modal-header .modal-title {
    font-size: 24px;
    font-weight: 600;
    color: #212529;
    margin: 0;
    flex: 1;
}

/* Icon-only download button (admin Orders modal) */
.modal-sidebar .order-download-icon-btn {
    appearance: none;
    background: transparent;
    border: 0;
    color: #495057;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px;
    margin-right: 6px; /* keep a small gap from the close icon */
    cursor: pointer;
}

.modal-sidebar .order-download-icon-btn:hover,
.modal-sidebar .order-download-icon-btn:focus {
    color: #212529;
    text-decoration: none;
}

.modal-sidebar .order-download-icon-btn i {
    font-size: 16px;
    line-height: 1;
}

.modal-sidebar .edwiser-editor-body .form-group {
    margin-bottom: 16px;
}

.modal-sidebar .edwiser-editor-body .form-control {
    height: auto;
}

.modal-sidebar .edwiser-editor-body textarea.form-control {
    height: auto;
    min-height: 240px;
}

.modal-sidebar .edwiser-editor-body .tox-tinymce {
    min-height: 280px;
}

.modal-sidebar .edwiser-editor-body .tox .tox-edit-area__iframe {
    min-height: 220px;
}

.modal-sidebar .edwiser-editor-body .editor_atto {
    min-height: 280px;
}

/* When file picker is open, allow interactions */
.modal-sidebar.edwiser-picker-open {
    pointer-events: none;
}

.modal-sidebar.edwiser-picker-open .modal-content {
    pointer-events: auto;
}

.coupon-editor-body .form-group {
    margin-bottom: 20px;
}

/* Container for half-width fields to display side by side */
.coupon-editor-body .coupon-fields-row {
    display: flex;
    gap: 16px;
    margin-bottom: 20px;
}

/* Half-width fields (50% of modal) */
#coupon-editor-form .coupon-field-half-width {
    width: 50%;
    flex: 0 0 50%;
}

.coupon-editor-body label {
    display: block;
    margin-bottom: 8px;
    font-weight: 500;
    color: #374151;
    font-size: 14px;
}

.coupon-editor-body .required {
    color: #dc3545;
}

.coupon-editor-body .form-control {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 6px;
    font-size: 14px;
}

/* Usage limit field wrapper */
.coupon-usage-limit-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
}

.coupon-usage-limit-input {
    width: 100px !important;
    flex-shrink: 0;
}

.coupon-usage-limit-default-text {
    font-size: 12px;
    color: #6c757d;
    white-space: nowrap;
}

.coupon-editor-body .form-control:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.coupon-editor-body .form-text {
    font-size: 12px;
    color: #6c757d;
    margin-top: 4px;
}

.coupon-editor-body .form-check {
    display: inline-block;
    margin-right: 20px;
}

#coupon-editor-form .form-check-input[type="radio"] {
    margin-right: 10px;
}

.coupon-editor-footer {
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    justify-content: flex-end;
    gap: 12px;
}

.coupon-editor-footer .btn {
    padding: 10px 20px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
    font-size: 14px;
}

.coupon-editor-footer .btn-link {
    background: none;
    border: none;
    color: #6c757d;
}

.coupon-editor-footer .btn-link:hover {
    color: #495057;
    text-decoration: none;
}

.coupon-editor-footer .btn-primary {
    background: #2F80ED;
    border: 1px solid #2F80ED;
    color: #fff;
}

.coupon-editor-footer .btn-primary:hover:not(:disabled) {
    background: #1e5fbf;
    border-color: #1e5fbf;
}

.coupon-editor-footer .btn-primary:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Coupon Table Styles */
.local-edwiserstore-coupons-page .generaltable {
    width: 100%;
    border-collapse: collapse;
}

.local-edwiserstore-coupons-page .generaltable th,
.local-edwiserstore-coupons-page .generaltable td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid #e2e8f0;
}

.local-edwiserstore-coupons-page .generaltable th {
    font-weight: 600;
    color: #374151;
    background: #f9fafb;
    font-size: 14px;
}

.local-edwiserstore-coupons-page .generaltable td {
    color: #495057;
    font-size: 14px;
}

.local-edwiserstore-coupons-page .badge {
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.local-edwiserstore-coupons-page .badge-success {
    background: #28A745;
    color: #fff;
}

.local-edwiserstore-coupons-page .badge-secondary {
    background: #D9DEE3;
    color: #374151;
}

.local-edwiserstore-coupons-page .badge-danger {
    background: #B60011;
    color: #fff;
}

/* Applied Coupon Styles in Cart */
.coupon-input-wrapper-applied {
    position: relative;
    width: 100%;
    max-width: 300px;
}

.coupon-input-applied {
    padding-right: 40px;
    width: 100%;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    padding: 8px 12px;
    font-size: 14px;
}

.coupon-remove-btn-inline {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    color: #6c757d;
    font-size: 16px;
    line-height: 1;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.coupon-remove-btn-inline:hover {
    color: #dc3545;
}

.coupon-remove-btn-inline i {
    font-size: 14px;
}

.coupon-applied-message {
    margin-top: 4px;
    font-size: 12px;
    color: #059669;
    font-weight: 400;
    width: 100%;
    max-width: 300px;
    text-align: left;
}

.coupon-remove-btn {
    padding: 0;
    margin-left: auto;
    color: #6c757d;
    font-size: 16px;
    line-height: 1;
}

.coupon-remove-btn:hover {
    color: #dc3545;
    text-decoration: none;
}

.coupon-discount-row {
    color: #059669;
}

.coupon-discount-value {
    color: #059669;
    font-weight: 600;
}

/* Empty State Styles */
.local-edwiserstore-empty-state {
    padding: 60px 20px;
}

.local-edwiserstore-empty-state .empty-illustration img {
    max-width: 300px;
    width: 100%;
    height: auto;
}

.local-edwiserstore-empty-state p {
    margin-top: 24px;
    color: #6c757d;
}

/* Checkout Page Styles */
#page-local-edwiserstore-checkout #topofscroll > .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    background: #f8f9fa !important;
}

.local-edwiserstore-checkout-page {
    padding: 0;
    max-width: 1400px;
    margin: 0 auto;
    min-height: calc(100vh - 120px);
}

.checkout-page-container {
    display: flex;
    gap: 32px;
    align-items: flex-start;
    padding: 24px;
    max-width: 1400px;
    margin: 0 auto;
}

/* Left Column: Billing Details */
.checkout-billing-section {
    flex: 1;
    min-width: 0;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid #e2e8f0;
    padding: 32px;
}

.checkout-header {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
}

.checkout-title {
    font-size: 32px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.checkout-login-prompt {
    font-size: 16px;
    color: #374151;
}

.checkout-login-link {
    color: #2F80ED;
    text-decoration: none;
    font-weight: 500;
    margin-left: 4px;
}

.checkout-login-link:hover {
    color: #1e6fe0;
    text-decoration: underline;
}

.checkout-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.order-note-section {
    margin-bottom: 8px;
}

.checkout-section-title {
    margin: 8px 0 16px 0;
}

.checkout-section-title h2 {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

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

.checkout-form .form-row-name-fields,
.checkout-form .form-row-phone,
.checkout-form .form-row-city-postcode {
    display: flex;
    flex-direction: row;
    gap: 16px;
    margin-bottom: 0;
}

.checkout-form .form-row-name-fields .form-group-half,
.checkout-form .form-row-phone .form-group-half,
.checkout-form .form-row-city-postcode .form-group-half {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

@media (max-width: 768px) {
    .checkout-form .form-row-name-fields,
    .checkout-form .form-row-phone,
    .checkout-form .form-row-city-postcode {
        flex-direction: column;
        gap: 20px;
    }
    
    .checkout-form .form-row-name-fields .form-group-half,
    .checkout-form .form-row-phone .form-group-half,
    .checkout-form .form-row-city-postcode .form-group-half {
        flex: none;
        width: 100%;
    }
}

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

.checkout-form .form-label.required::after {
    content: '*';
    color: #dc3545;
    margin-left: 4px;
}

.checkout-form .form-control {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 14px;
    color: #212529;
    background: #fff;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.checkout-form .form-control:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.checkout-form .form-control.is-invalid {
    border-color: #dc3545;
}

.checkout-form .form-control.is-valid {
    border-color: #28a745;
}

.checkout-form textarea.form-control {
    resize: vertical;
    min-height: 80px;
}

.invalid-feedback {
    display: none;
    font-size: 12px;
    color: #dc3545;
    margin-top: 4px;
}

.form-control.is-invalid ~ .invalid-feedback,
.form-control.is-invalid ~ .invalid-feedback.email-error,
.form-control.is-invalid ~ .invalid-feedback.firstname-error,
.form-control.is-invalid ~ .invalid-feedback.lastname-error,
.form-control.is-invalid ~ .invalid-feedback.phone-error,
.form-control.is-invalid ~ .invalid-feedback.country-error,
.form-control.is-invalid ~ .invalid-feedback.city-error,
.form-control.is-invalid ~ .invalid-feedback.postcode-error,
.form-control.is-invalid ~ .invalid-feedback.streetaddress-error {
    display: block;
}

.email-validation-message {
    font-size: 14px;
    margin-top: 4px;
}

.password-field {
    margin-top: 8px;
}

/* Right Column: Order Summary & Payment */
.checkout-order-section {
    flex-shrink: 0;
    width: 420px;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: stretch;
    top: 20px;
    align-self: flex-start;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgb(0 0 0 / .1);
    border: 1px solid #e2e8f0;
    /* max-height: calc(100vh - 40px); */
}

.order-summary-card {
    background: #ffffff;
    padding: 24px;
}

.order-summary-title {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 0 0 24px 0;
}

.order-summary-items {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: 24px;
    padding-bottom: 24px;
    border-bottom: 1px solid #e2e8f0;
}

.order-summary-item {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
}

.order-summary-item .item-name {
    flex: 1;
    font-size: 14px;
    color: #212529;
    font-weight: 500;
    line-height: 1.4;
}

.order-summary-item .item-price {
    font-size: 14px;
    color: #212529;
    font-weight: 600;
    white-space: nowrap;
}

.order-summary-details {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.summary-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.summary-label {
    font-size: 16px;
    color: #374151;
    font-weight: 500;
    flex: 1;
}

.summary-label .coupon-code-display {
    color: #2F80ED;
    font-weight: 600;
    margin-left: 4px;
}

.summary-label .coupon-edit-link-inline {
    color: #2F80ED;
    text-decoration: none;
    font-size: 14px;
    margin-left: 8px;
    font-weight: 400;
}

.summary-label .coupon-edit-link-inline:hover {
    text-decoration: underline;
}

.summary-value {
    font-size: 16px;
    color: #212529;
    font-weight: 600;
    white-space: nowrap;
}

.summary-row.total-row {
    padding-top: 16px;
    border-top: 2px solid #e2e8f0;
    margin-top: 8px;
}

.summary-row.total-row .summary-label,
.summary-row.total-row .summary-value {
    font-size: 20px;
    font-weight: 700;
}

.total-value {
    color: #212529;
}

.coupon-discount-value {
    color: #28a745;
}

.coupon-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.coupon-input-container {
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 8px;
}

.coupon-input-wrapper {
    display: flex;
    gap: 8px;
    width: 100%;
}

.coupon-input-wrapper-applied {
    display: flex;
    gap: 8px;
    width: 100%;
    align-items: center;
}

.coupon-input,
.coupon-input-applied {
    flex: 1;
    padding: 8px 12px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    font-size: 14px;
}

.coupon-input-applied {
    background: #f3f4f6;
    color: #6c757d;
}

.coupon-input:focus {
    outline: none;
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

.coupon-apply-btn {
    padding: 8px 16px;
    background: #2F80ED;
    color: #fff;
    border: none;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.coupon-apply-btn:hover {
    background: #1e6fe0;
}

.coupon-remove-btn-inline {
    background: transparent;
    border: none;
    color: #dc3545;
    cursor: pointer;
    padding: 4px 8px;
    font-size: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.coupon-remove-btn-inline:hover {
    color: #c82333;
}

.coupon-applied-message {
    font-size: 12px;
    color: #28a745;
    font-weight: 500;
}

.coupon-edit-link {
    font-size: 14px;
    color: #2F80ED;
    text-decoration: none;
}

.coupon-edit-link:hover {
    text-decoration: underline;
}

.coupon-apply-link {
    font-size: 14px;
    color: #2F80ED;
    text-decoration: none;
    display: inline-block;
}

.coupon-apply-link:hover {
    text-decoration: underline;
}

/* Payment Section */
.payment-section {
    background: #F5F9FD;
    padding: 24px;
}

.payment-method-selection {
    margin-bottom: 20px;
}

.payment-method-selection .form-check {
    display: flex;
    align-items: center;
    gap: 8px;
}

.payment-method-selection .form-check-input {
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
}

.payment-method-selection .form-check-label {
    font-size: 16px;
    color: #212529;
    font-weight: 500;
    cursor: pointer;
    margin: 0;
}

.stripe-payment-form {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.stripe-card-number-group {
    width: 100%;
}

.stripe-card-details-row {
    display: flex;
    gap: 16px;
    width: 100%;
}

.stripe-expiry-group {
    flex: 1;
    min-width: 0; /* Allow flex item to shrink below content size */
}

.stripe-cvc-group {
    flex: 0 0 120px; /* Fixed width for CVV field */
    min-width: 0;
}

.stripe-element {
    padding: 10px 12px;
    border: 1px solid #d1d5db;
    border-radius: 4px;
    background: #fff;
    height: 42px; /* Fixed height to match form-control */
    width: 100%;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    box-sizing: border-box;
    /* Ensure Stripe Elements are visible and interactive */
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    position: relative !important;
    overflow: hidden; /* Contain iframes within container */
    display: block; /* Change from flex to block for proper iframe containment */
}

/* Ensure Stripe Elements wrapper divs are properly contained */
.stripe-element > div {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    min-height: 22px !important;
}

.stripe-element > div > div,
.stripe-element [class*="StripeElement"] {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    display: block !important;
}

/* Ensure Stripe Elements iframes are visible and match container height */
.stripe-element iframe {
    opacity: 1 !important;
    pointer-events: auto !important;
    visibility: visible !important;
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 22px !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
}

/* Prevent any hidden fallback inputs from interfering - More aggressive selectors */
.stripe-element input[style*="opacity: 0"],
.stripe-element input[style*="pointer-events: none"],
.stripe-element input._PrivateStripeElement-input,
.stripe-element input[aria-hidden="true"],
.stripe-element input[style*="height: 1px"],
.stripe-element input[style*="height: 2px"],
.stripe-element input[style*="width: 1px"],
.stripe-element input[style*="width: 2px"] {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    left: -9999px !important;
    width: 0 !important;
    height: 0 !important;
}

/* Hide any hidden spans that Stripe creates */
.stripe-element span[style*="opacity: 0"],
.stripe-element span[style*="pointer-events: none"] {
    display: none !important;
}

/* Remove conflicting rules - handled by more specific rules above */

.stripe-element:focus-within {
    border-color: #2F80ED;
    box-shadow: 0 0 0 3px rgba(47, 128, 237, 0.1);
}

/* Responsive adjustments for payment fields */
@media (max-width: 768px) {
    .stripe-card-details-row {
        flex-direction: column;
        gap: 20px;
    }
    
    .stripe-cvc-group {
        flex: 1;
        width: 100%;
    }
}

.terms-checkbox-section {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #e2e8f0;
}

.terms-checkbox-section .form-check {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.terms-checkbox-section .form-check-input {
    margin-top: 4px;
    cursor: pointer;
}

.terms-checkbox-section .form-check-label {
    font-size: 14px;
    color: #374151;
    cursor: pointer;
    line-height: 1.5;
}

.terms-checkbox-section .terms-link {
    color: #2F80ED;
    text-decoration: none;
}

.terms-checkbox-section .terms-link:hover {
    text-decoration: underline;
}

.checkout-submit-btn,
.free-order-btn {
    width: 100%;
    padding: 14px 24px;
    background: #2F80ED;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 20px;
    transition: background-color 0.2s ease;
}

.checkout-submit-btn:hover,
.free-order-btn:hover {
    background: #1e6fe0;
}

.checkout-submit-btn:disabled,
.free-order-btn:disabled {
    background: #9ca3af;
    cursor: not-allowed;
}

.payment-disabled-message {
    margin-top: 20px;
}

.payment-disabled-message .alert {
    padding: 12px 16px;
    border-radius: 4px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    color: #856404;
}

.free-order-section {
    background: #F5F9FD;
    padding: 24px;
}

/* Responsive Checkout Page */
@media (max-width: 1024px) {
    .checkout-page-container {
        flex-direction: column;
    }
    
    .checkout-order-section {
        width: 100%;
        position: static;
        max-height: none;
        overflow-y: visible;
    }
}

@media (max-width: 768px) {
    .local-edwiserstore-checkout-page {
        padding: 16px;
    }
    
    .checkout-page-container {
        padding: 16px;
    }
    
    .checkout-billing-section {
        padding: 24px;
    }
    
    .checkout-title {
        font-size: 24px;
    }
    
    /* Stripe payment form responsive styles handled by .stripe-card-details-row */
}

/* Terms & Conditions Modal */
.checkout-terms-modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 10000;
}

.checkout-terms-modal-content {
    background: #fff;
    border-radius: 8px;
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
}

.checkout-terms-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.checkout-terms-modal-header h4 {
    font-size: 20px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.checkout-terms-modal-close {
    background: none;
    border: none;
    font-size: 28px;
    color: #6c757d;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.checkout-terms-modal-close:hover {
    color: #212529;
}

.checkout-terms-modal-body {
    padding: 24px;
    overflow-y: auto;
    flex: 1;
}

.checkout-terms-modal-body div {
    font-size: 14px;
    color: #374151;
    line-height: 1.6;
}

.checkout-terms-modal-footer {
    display: flex;
    justify-content: flex-end;
    padding: 16px 24px;
    border-top: 1px solid #e2e8f0;
}

.checkout-terms-modal-footer .btn {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    background: #2F80ED;
    color: #fff;
}

.checkout-terms-modal-footer .btn:hover {
    background: #1e6fe0;
}

/* Dashboard Styles */
.local-edwiserstore-dashboard {
    padding: 24px;
}

/* KPI Cards */
.dashboard-kpis {
    margin-bottom: 32px;
}

.dashboard-kpis .col-md-4 {
    padding-left: 12px;
    padding-right: 12px;
}

.dashboard-kpis .col-md-4:first-child {
    padding-left: 0;
}

.dashboard-kpis .col-md-4:last-child {
    padding-right: 0;
}

.dashboard-kpi-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 24px;
    height: 100%;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.2s ease;
}

.dashboard-kpi-card:hover {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}

.dashboard-kpi-label {
    font-size: 13px;
    color: #6c757d;
    font-weight: 600;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.dashboard-kpi-value {
    font-size: 32px;
    font-weight: 700;
    color: #212529;
    line-height: 1.2;
}

/* Dashboard Sections */
.dashboard-section {
    border-radius: 8px;
    margin-bottom: 32px;
    margin-top: 32px;
}

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

.dashboard-section-header {
    padding: 20px 24px;
    border-bottom: 1px solid #e2e8f0;
}

.dashboard-section-title {
    font-size: 24px;
    font-weight: 700;
    color: #212529;
    margin: 0;
}

.dashboard-section-content {
    padding: 24px;
}

/* Monthly Sales Chart */
.dashboard-chart-container {
    position: relative;
    height: 400px;
    width: 100%;
}

#dashboard-monthly-sales-chart {
    max-height: 400px;
    height: 400px;
    width: 100% !important;
}

/* Top Products Table */
.dashboard-products-table {
    width: 100%;
    margin: 0;
}

.dashboard-products-table thead th {
    background-color: #f8f9fa;
    border-bottom: 2px solid #dee2e6;
    font-weight: 600;
    color: #495057;
    padding: 12px 16px;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.dashboard-products-table tbody td {
    padding: 16px;
    vertical-align: middle;
    border-bottom: 1px solid #e9ecef;
    font-size: 14px;
    color: #212529;
}

.dashboard-products-table tbody tr:last-child td {
    border-bottom: none;
}

.dashboard-products-table tbody tr:hover {
    background-color: #f8f9fa;
}

.dashboard-product-link {
    color: #2F80ED;
    text-decoration: none;
    font-weight: 500;
}

.dashboard-product-link:hover {
    color: #1e6fe0;
    text-decoration: underline;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .local-edwiserstore-dashboard {
        padding: 15px;
    }
    
    .dashboard-kpi-value {
        font-size: 24px;
    }
    
    .dashboard-section-header {
        padding: 16px;
    }
    
    .dashboard-section-content {
        padding: 16px;
    }
    
    .dashboard-products-table {
        font-size: 12px;
    }
    
    .dashboard-products-table thead th,
    .dashboard-products-table tbody td {
        padding: 10px;
    }
}

/* Thank You Page Styles */
.local-edwiserstore-thankyou-page {
    min-height: calc(100vh - 200px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    background: #f5f8ff;
}

.thankyou-container {
    max-width: 800px;
    width: 100%;
    background: #ffffff;
    border-radius: 12px;
    padding: 40px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
    border: 1px solid #e0e0e0;
}

/* Icon Styles */
.thankyou-icon-wrapper {
    display: flex;
    justify-content: center;
    margin-bottom: 30px;
}

.thankyou-icon {
    position: relative;
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.thankyou-cart-icon {
    width: 100%;
    height: 100%;
    color: #2F80ED;
    stroke: #2F80ED;
    fill: none;
}

.thankyou-cart-icon-failed {
    width: 100%;
    height: 100%;
    color: #2F80ED;
    stroke: #2F80ED;
    fill: none;
    opacity: 0.7;
}

.thankyou-success-checkmark {
    position: absolute;
    bottom: -10px;
    left: -10px;
    width: 60px;
    height: 60px;
    z-index: 10;
}

.thankyou-failed-x {
    position: absolute;
    bottom: -10px;
    left: -10px;
    width: 60px;
    height: 60px;
    z-index: 10;
}

/* Title and Message */
.thankyou-title {
    font-size: 32px;
    font-weight: 700;
    color: #333;
    text-align: center;
    margin-bottom: 16px;
}

.thankyou-message {
    font-size: 16px;
    color: #666;
    text-align: center;
    margin-bottom: 40px;
    line-height: 1.6;
}

/* Order Details Table */
.thankyou-order-details {
    margin: 30px 0;
}

.thankyou-order-table {
    width: 100%;
    border-collapse: collapse;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.thankyou-order-table thead {
    background: #f0f4ff;
}

.thankyou-order-table thead th {
    padding: 16px;
    text-align: left;
    font-weight: 600;
    color: #333;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.thankyou-order-table tbody td {
    padding: 16px;
    background: #ffffff;
    border-top: 1px solid #e0e0e0;
    color: #333;
    font-size: 15px;
}

.thankyou-order-table tbody tr:last-child td {
    border-bottom: none;
}

.thankyou-order-table .badge {
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.thankyou-order-table .badge-success {
    background: #4CAF50;
    color: #ffffff;
}

.thankyou-order-table .badge-danger {
    background: #f44336;
    color: #ffffff;
}

.thankyou-order-table .badge-warning {
    background: #ff9800;
    color: #ffffff;
}

.thankyou-order-table .badge-secondary {
    background: #9e9e9e;
    color: #ffffff;
}

/* Email Message */
.thankyou-email-message {
    text-align: center;
    color: #666;
    font-size: 14px;
    margin: 20px 0 30px;
    line-height: 1.6;
}

/* Action Buttons */
.thankyou-actions {
    display: flex;
    gap: 16px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 30px;
}

.thankyou-btn-continue,
.thankyou-btn-view-order,
.thankyou-btn-retry {
    padding: 12px 32px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 6px;
    text-decoration: none;
    display: inline-block;
    transition: all 0.3s ease;
    border: 2px solid;
    cursor: pointer;
}

.thankyou-btn-continue {
    background: #ffffff;
    color: #2F80ED;
    border-color: #2F80ED;
}

.thankyou-btn-continue:hover {
    background: #f0f4ff;
    color: #1e6fe0;
    border-color: #1e6fe0;
    text-decoration: none;
}

.thankyou-btn-view-order,
.thankyou-btn-retry {
    background: #2F80ED;
    color: #ffffff;
    border-color: #2F80ED;
}

.thankyou-btn-view-order:hover,
.thankyou-btn-retry:hover {
    background: #1e6fe0;
    border-color: #1e6fe0;
    color: #ffffff;
    text-decoration: none;
}

/* Success State Specific */
.thankyou-success {
    text-align: center;
}

/* Failed State Specific */
.thankyou-failed {
    text-align: center;
}

.thankyou-failed .thankyou-title {
    color: #f44336;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .thankyou-container {
        padding: 30px 20px;
        margin: 20px;
    }
    
    .thankyou-icon {
        width: 120px;
        height: 120px;
    }
    
    .thankyou-success-checkmark,
    .thankyou-failed-x {
        width: 50px;
        height: 50px;
    }
    
    .thankyou-title {
        font-size: 24px;
    }
    
    .thankyou-message {
        font-size: 14px;
    }
    
    .thankyou-order-table {
        font-size: 13px;
    }
    
    .thankyou-order-table thead th,
    .thankyou-order-table tbody td {
        padding: 12px 8px;
    }
    
    .thankyou-actions {
        flex-direction: column;
    }
    
    .thankyou-btn-continue,
    .thankyou-btn-view-order,
    .thankyou-btn-retry {
        width: 100%;
        padding: 14px 24px;
    }
}

/* Thank You Page Container Override */
#page-local-edwiserstore-thankyou #topofscroll > .container {
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    background: #f5f8ff !important;
}

#page-local-edwiserstore-thankyou #topofscroll > .container div[role="main"] {
    background: #f5f8ff !important;
    padding: 0 !important;
}

#page-local-edwiserstore-thankyou #topofscroll > .container #page-header {
    display: none !important;
}

/* Hide password field for logged-in users (server-side check) */
body.userloggedin .password-field,
#page-local-edwiserstore-checkout body.userloggedin .password-field {
    display: none !important;
}

/* Disable email field styling for logged-in users */
#checkout-email:disabled {
    background-color: #e9ecef;
    cursor: not-allowed;
    opacity: 0.7;
}

/* My Orders Page Styles */
.local-edwiserstore-myorders-page {
    padding: 20px;
    /* max-width: 1200px; // Removed for the sake of consistency with My subscriptions page*/
    margin: 0 auto;
}

.myorders-page-title {
    font-size: 28px;
    font-weight: 600;
    color: #212529;
    margin: 0;
}

.myorders-search-wrapper {
    margin-bottom: 20px;
}

.myorders-search-form {
    display: flex;
    align-items: center;
    gap: 12px;
}

.myorders-search-input-wrapper {
    position: relative;
    flex: 1;
    max-width: 400px;
}

.myorders-search-input {
    padding-right: 45px;
    border-radius: 4px;
    border: 1px solid #dee2e6;
}

.myorders-search-btn {
    position: absolute;
    right: 0;
    top: 0;
    height: 100%;
    border: none;
    background: transparent;
    color: #6c757d;
    padding: 0 15px;
    cursor: pointer;
}

.myorders-search-btn:hover {
    color: #495057;
}

.myorders-count-message {
    font-size: 14px;
    color: #6c757d;
}

.myorders-table-wrapper {
    margin-bottom: 24px;
}

.myorders-table {
    width: 100%;
    border-collapse: collapse;
}

.myorders-table thead th {
    background-color: #e3f2fd;
    color: #212529;
    font-weight: 600;
    padding: 12px 16px;
    text-align: left;
    border: 1px solid #dee2e6;
    font-size: 14px;
}

.myorders-table tbody td {
    padding: 16px;
    border: 1px solid #dee2e6;
    vertical-align: middle;
    font-size: 14px;
    color: #212529;
}

.myorders-table tbody tr {
    background-color: #fff;
}

.myorders-table tbody tr:hover {
    background-color: #f8f9fa;
}

.myorders-order-link,
.myorders-invoice-link {
    color: #007bff;
    text-decoration: none;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.myorders-order-link:hover,
.myorders-invoice-link:hover {
    color: #0056b3;
    text-decoration: underline;
}

.myorders-empty-state {
    padding: 60px 20px;
}

.myorders-empty-illustration {
    margin-bottom: 20px;
}

.myorders-empty-title {
    font-size: 20px;
    font-weight: 600;
    color: #212529;
    margin-bottom: 10px;
}

.myorders-empty-message {
    font-size: 14px;
    color: #6c757d;
}

.myorders-pagination {
    margin-top: 24px;
}

.myorders-pagination .pagination {
    margin: 0;
}

.myorders-pagination .page-link {
    color: #007bff;
    border: 1px solid #dee2e6;
    padding: 8px 12px;
}

.myorders-pagination .page-item.active .page-link {
    background-color: #007bff;
    border-color: #007bff;
    color: #fff;
}

.myorders-pagination .page-link:hover {
    color: #0056b3;
    background-color: #e9ecef;
}

/* Order Details Modal Styles for My Orders */
.order-details-modal-body {
    padding: 24px;
}

.order-details-modal-body .order-details-section {
    margin-bottom: 24px;
}

.order-details-modal-body .order-details-section:last-child {
    margin-bottom: 0;
}

.order-details-modal-body .order-details-summary {
    padding: 0;
    background-color: transparent;
    border: none;
}

.order-details-modal-body .order-details-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #e9ecef;
}

.order-details-modal-body .order-details-row:last-child {
    border-bottom: none;
}

.order-details-modal-body .order-details-label {
    font-weight: 500;
    color: #495057;
    font-size: 14px;
}

.order-details-modal-body .order-details-value {
    color: #212529;
    text-align: right;
    font-size: 14px;
    font-weight: 400;
}

.order-details-modal-body .order-details-customer {
    padding: 16px;
    background-color: #fff;
    border: 1px solid #e2e8f0;
    border-top: none;
    border-radius: 0 0 4px 4px;
}

.order-details-modal-body .order-customer-name {
    font-size: 14px;
    color: #212529;
    margin-bottom: 8px;
}

.order-details-modal-body .order-customer-name strong {
    font-weight: 600;
    color: #212529;
}

.order-details-modal-body .order-customer-email {
    font-size: 14px;
    color: #666666;
    font-weight: 400;
}

.order-details-modal-body .order-products-table {
    margin-top: 0;
    width: 100%;
}

.order-details-modal-body .order-products-table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    padding: 12px 16px;
    border: 1px solid #dee2e6;
    font-size: 14px;
    text-align: left;
}

.order-details-modal-body .order-products-table thead th:not(:first-child) {
    text-align: right;
}

.order-details-modal-body .order-products-table tbody td {
    padding: 12px 16px;
    border: 1px solid #dee2e6;
    font-size: 14px;
    vertical-align: middle;
}

.order-details-modal-body .order-products-table tbody td:not(:first-child) {
    text-align: right;
}

.order-details-modal-body .order-products-table tbody td:last-child {
    font-weight: 600;
}

.order-details-modal-body .order-details-section-title {
    font-size: 16px;
    font-weight: 600;
    color: #212529;
    margin: 0 0 16px 0;
    padding: 0;
    background-color: transparent;
    border-radius: 0;
}

/* Responsive Styles for My Orders Page */
@media (max-width: 768px) {
    .local-edwiserstore-myorders-page {
        padding: 15px;
    }
    
    .myorders-page-title {
        font-size: 24px;
    }
    
    .myorders-search-input-wrapper {
        max-width: 100%;
    }
    
    .myorders-table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .myorders-table {
        min-width: 600px;
    }
    
    .myorders-table thead th,
    .myorders-table tbody td {
        padding: 10px 8px;
        font-size: 13px;
    }
    
    .myorders-order-link,
    .myorders-invoice-link {
        font-size: 13px;
        display: block;
        margin-bottom: 4px;
    }
    
    .myorders-pagination .page-link {
        padding: 6px 10px;
        font-size: 13px;
    }
}

@media (max-width: 480px) {
    .local-edwiserstore-myorders-page {
        padding: 10px;
    }
    
    .myorders-page-title {
        font-size: 20px;
    }
    
    .myorders-table {
        min-width: 500px;
    }
    
    .myorders-table thead th,
    .myorders-table tbody td {
        padding: 8px 6px;
        font-size: 12px;
    }
    
    .myorders-order-link,
    .myorders-invoice-link {
        font-size: 12px;
    }
    
    .myorders-pagination {
        overflow-x: auto;
    }
    
    .myorders-pagination .pagination {
        flex-wrap: nowrap;
        white-space: nowrap;
    }
}

/* Tablet Styles (768px - 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .local-edwiserstore-myorders-page {
        padding: 20px;
    }
    
    .myorders-table thead th,
    .myorders-table tbody td {
        padding: 12px 14px;
    }
}

/* Subscriptions Page Styles */
.subscriptions-page-header {
    margin-bottom: 1.5rem;
}

.subscriptions-page-title {
    font-size: 1.75rem;
    font-weight: 600;
    margin: 0;
}

.subscriptions-search-wrapper {
    margin-bottom: 1rem;
}

.subscriptions-search-form {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.subscriptions-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1;
    max-width: 400px;
}

.subscriptions-search-input {
    padding-right: 45px;
    border-radius: 4px;
}

.subscriptions-search-btn {
    position: absolute;
    right: 0;
    border: none;
    background: transparent;
    padding: 8px 12px;
    color: #6c757d;
}

.subscriptions-search-btn:hover {
    color: #495057;
}

.subscriptions-count-message {
    color: #6c757d;
    font-size: 0.9rem;
}

.subscriptions-empty-state {
    text-align: center;
    padding: 3rem 1rem;
}

.subscriptions-empty-illustration {
    margin-bottom: 1.5rem;
    display: inline-block;
}

.subscriptions-empty-message {
    color: #6c757d;
    font-size: 1.25rem;
    margin: 0;
}

/* Subscription Details Modal Styles */
.subscription-details-body {
    padding: 0;
}

.subscription-details-section.subscription-summary-section {
    padding: 1.25rem;
    margin-bottom: 1.5rem;
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
}

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

.subscription-details-section-title {
    padding: 1.25rem;
    font-size: 1.1rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: #212529;
}

.subscription-details-section.subscription-summary-section .subscription-details-section-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0;
    color: #212529;
    padding: 16px 20px;
    background-color: #F0F6FC;
    border-bottom: 1px solid #e0e6ed;
    border-radius: 8px 8px 0 0;
    margin: -1.25rem -1.25rem 0 -1.25rem;
}

.subscription-details-section.subscription-summary-section .subscription-details-summary {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 0;
    background-color: #ffffff;
}

.subscription-details-row {
    display: contents;
}

.subscription-details-row > * {
    padding: 0 8px;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

.subscription-details-row:first-child > * {
    padding-bottom: 16px;
}

.subscription-details-label {
    font-weight: 600;
    color: #495057;
    font-size: 1rem;
    text-align: left;
    flex: none;
}

.subscription-details-value {
    font-weight: 400;
    color: #212529;
    font-size: 0.9rem;
    text-align: left;
    flex: none;
    display: block;
}

.subscription-details-section:first-child .subscription-details-value:first-child {
    display: block;
}

.subscription-date-line {
    line-height: 1.5;
    margin-bottom: 2px;
    color: #212529;
    font-size: 0.9rem;
}

.subscription-time-line {
    line-height: 1.5;
    color: #6c757d;
    font-size: 0.875rem;
    margin-top: 0;
}

.subscription-details-other {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Other Details Section Styling */
.other-details-section {
    background-color: #ffffff;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    padding: 1.25rem;
}

.other-details-section .subscription-details-section-title {
    font-size: 1.25rem;
    font-weight: 700;
    color: #343a40;
    margin-bottom: 1rem;
    padding: 0;
}

.other-details-section .subscription-details-other {
    display: flex;
    flex-direction: row;
    gap: 2rem;
}

.other-details-column {
    flex: 1;
}

.other-details-item {
    display: flex;
    flex-direction: column;
}

.other-details-label {
    font-size: 1rem;
    font-weight: 700;
    color: #343a40;
    margin-bottom: 0.5rem;
}

.other-details-value {
    font-size: 0.875rem;
    font-weight: 400;
    color: #6c757d;
}

.subscription-edit-icon {
    color: #6c757d;
    font-size: 0.875rem;
    cursor: pointer;
}

.subscription-edit-icon:hover {
    color: #495057;
}

.subscription-details-value .order-view-link {
    text-decoration: underline;
    color: #007bff;
}

.subscription-details-value .order-view-link:hover {
    color: #0056b3;
}

.subscription-details-value .badge {
    padding: 4px 12px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 0.875rem;
    display: inline-block;
    white-space: nowrap;
    margin-top: 0.5rem;
}


.subscription-orders-table {
    margin-top: 0.5rem;
}

.subscription-orders-table thead th {
    background-color: #f8f9fa;
    font-weight: 600;
    border-bottom: 2px solid #dee2e6;
}

.subscription-orders-table tbody td {
    vertical-align: middle;
}

.subscription-view-link {
    color: #007bff;
    text-decoration: none;
}

.subscription-view-link:hover {
    text-decoration: underline;
    color: #0056b3;
}

/* Subscription status badges */
.subscription-details-body .badge-success {
    background-color: #28a745;
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}

.subscription-details-body .badge-danger {
    background-color: #dc3545;
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}

.subscription-details-body .badge-secondary {
    background-color: #6c757d;
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.25rem;
    font-size: 0.875rem;
}

/* Related Orders Section */
.subscription-details-section.related-orders-section {
    background-color: #ffffff;
    border: 1px solid #e0e8ed;
    border-radius: 8px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    padding: 20px;
    margin-bottom: 1.5rem;
}

.subscription-details-section.related-orders-section .subscription-details-section-title {
    font-weight: 600;
    font-size: 1rem;
    color: #212529;
    margin-bottom: 16px;
    padding: 0;
}

.subscription-details-section.related-orders-section .related-orders-summary {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0;
    background-color: #ffffff;
}

.related-orders-row {
    display: contents;
}

.related-orders-row > * {
    padding: 12px 16px;
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
    vertical-align: middle;
    border-bottom: 1px solid #e9ecef;
}

.related-orders-row:first-child > * {
    padding-bottom: 12px;
    border-bottom: none;
}

.related-orders-section .related-orders-summary > .related-orders-row:last-child > * {
    border-bottom: none;
}

.related-orders-label {
    font-weight: 600;
    color: #495057;
    font-size: 0.875rem;
    text-align: left;
    flex: none;
}

.related-orders-value {
    font-weight: 400;
    color: #495057;
    font-size: 0.875rem;
    text-align: left;
    flex: none;
    display: block;
}

.related-orders-value .order-view-link {
    color: #007bff;
    text-decoration: underline;
    cursor: pointer;
}

.related-orders-value .order-view-link:hover {
    color: #0056b3;
    text-decoration: underline;
}

.related-order-date-line {
    line-height: 1.4;
    color: #495057;
}

.related-order-time-line {
    line-height: 1.4;
    color: #495057;
    font-size: 0.8125rem;
}

.related-orders-value .badge {
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
    font-size: 0.8125rem;
    font-weight: 500;
    display: inline-block;
    white-space: nowrap;
    border: 1px solid;
}

.related-orders-value .badge.badge-danger,
.related-orders-value .badge.badge-warning {
    background-color: #dc3545;
    color: #ffffff;
    border-color: #dc3545;
}

.related-orders-value .badge.badge-success {
    background-color: #d4edda;
    color: #155724;
    border-color: #c3e6cb;
}

.related-orders-value .badge.badge-success::before {
    content: "✓ ";
    color: #155724;
    margin-right: 2px;
}

/* My Subscriptions Page Styles */
.local-edwiserstore-mysubscriptions-page {
    padding: 20px;
}

.mysubscriptions-page-header {
    margin-bottom: 1.5rem;
}

.mysubscriptions-page-title {
    font-size: 1.75rem;
    font-weight: 600;
    color: #333;
}

.mysubscriptions-search-wrapper {
    margin-bottom: 1rem;
}

.mysubscriptions-search-form {
    display: flex;
    align-items: center;
}

.mysubscriptions-search-input-wrapper {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1;
    max-width: 400px;
}

.mysubscriptions-search-input {
    padding-right: 40px;
    border-radius: 4px;
}

.mysubscriptions-search-btn {
    position: absolute;
    right: 0;
    border: none;
    background: transparent;
    color: #6c757d;
    padding: 8px 12px;
    cursor: pointer;
}

.mysubscriptions-search-btn:hover {
    color: #495057;
}

.mysubscriptions-count-message {
    color: #6c757d;
    font-size: 0.9rem;
}

.mysubscriptions-table-wrapper {
    margin-top: 1rem;
    background-color: #fff;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.mysubscriptions-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    margin: 0;
}

.mysubscriptions-table thead th {
    background-color: #e9f0f8;
    font-weight: 600;
    padding: 14px 16px;
    text-align: left;
    border-bottom: 1px solid #d0d7de;
    color: #333;
    font-size: 0.875rem;
    text-transform: none;
    letter-spacing: normal;
}

.mysubscriptions-table thead th:first-child {
    border-top-left-radius: 4px;
}

.mysubscriptions-table thead th:last-child {
    border-top-right-radius: 4px;
}

.mysubscriptions-table tbody td {
    padding: 14px 16px;
    border-bottom: 1px solid #e9ecef;
    vertical-align: middle;
    background-color: #fff;
    color: #333;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 1.5;
    word-wrap: break-word;
    white-space: normal;
    position: relative;
}

.mysubscriptions-table tbody tr:last-child td {
    border-bottom: none;
}

.mysubscriptions-table tbody tr:hover {
    background-color: #f8f9fa;
}

.mysubscriptions-table tbody tr:hover td {
    background-color: #f8f9fa;
}

/* Status badges styling */
.mysubscriptions-table .badge {
    display: inline-block;
    padding: 6px 12px;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 4px;
    text-transform: capitalize;
    letter-spacing: 0.3px;
    line-height: 1.2;
    white-space: nowrap;
}

.mysubscriptions-table .badge.badge-success {
    background-color: #28a745;
    color: #fff;
}

.mysubscriptions-table .badge.badge-danger {
    background-color: #dc3545;
    color: #fff;
}

.mysubscriptions-table .badge.badge-secondary {
    background-color: #e9ecef;
    color: #495057;
}

/* Status column specific styling */
.mysubscriptions-table tbody td .badge {
    display: inline-block;
    width: auto;
    margin-bottom: 0;
}

.mysubscriptions-table tbody td .mysubscriptions-cancelled-note {
    display: block;
    margin-top: 8px;
}

.mysubscriptions-cancel-btn {
    color: #dc3545;
    background-color: transparent;
    border: none;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 400;
    text-decoration: none;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.mysubscriptions-cancel-btn:hover {
    color: #c82333;
    text-decoration: underline;
}

.mysubscriptions-cancel-btn:focus {
    outline: none;
    box-shadow: none;
}

.mysubscriptions-buy-again-link {
    color: #007bff;
    text-decoration: underline;
    padding: 0;
    font-size: 0.875rem;
    font-weight: 400;
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

.mysubscriptions-buy-again-link:hover {
    color: #0056b3;
    text-decoration: underline;
}

.mysubscriptions-buy-again-link::after {
    content: "↗";
    font-size: 0.75rem;
    margin-left: 4px;
    opacity: 0.7;
}

.mysubscriptions-cancelled-note {
    margin-top: 8px;
    font-size: 0.75rem;
    color: #6c757d;
    font-weight: 400;
    line-height: 1.4;
}

.mysubscriptions-cancelled-note small {
    font-size: 0.75rem;
}

.mysubscriptions-pagination {
    margin-top: 1.5rem;
}

.mysubscriptions-empty-state {
    padding: 3rem 1rem;
    text-align: center;
}

.mysubscriptions-empty-illustration {
    margin-bottom: 1.5rem;
}

.mysubscriptions-empty-message {
    color: #6c757d;
    font-size: 1.25rem;
}

/* Modal styles for cancel confirmation */
#mysubscriptions-cancel-modal .modal-dialog {
    max-width: 500px;
}

#mysubscriptions-cancel-modal .modal-body {
    padding: 1.5rem;
}

#mysubscriptions-cancel-modal .modal-footer {
    padding: 1rem 1.5rem;
    border-top: 1px solid #dee2e6;
}

/* Responsive styles for mobile and tablet */
@media (max-width: 768px) {
    .mysubscriptions-table-wrapper {
        overflow-x: auto;
    }
    
    .mysubscriptions-table {
        min-width: 800px;
    }
    
    .mysubscriptions-search-input-wrapper {
        max-width: 100%;
    }
}

@media (max-width: 576px) {
    .local-edwiserstore-mysubscriptions-page {
        padding: 10px;
    }
    
    .mysubscriptions-page-title {
        font-size: 1.5rem;
    }
    
    .mysubscriptions-table {
        font-size: 0.875rem;
    }
    
    .mysubscriptions-table thead th,
    .mysubscriptions-table tbody td {
        padding: 8px;
    }
}

/* Email Templates Styles */
.local-edwiserstore-email-templates {
    padding: 0;
}

#page-local-edwiserstore-emailtemplates .form-control:disabled {
    color: #999;
}

.email-templates-tabs {
    display: flex;
    gap: 0;
    border-bottom: 1px solid #e5e7eb;
    margin-bottom: 0;
    padding: 0;
}

.email-templates-tab {
    background: none;
    border: none;
    padding: 12px 24px;
    font-size: 14px;
    font-weight: 500;
    color: #6b7280;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 8px;
}

.email-templates-tab:hover {
    color: #374151;
}

.email-templates-tab.active {
    color: #2F80ED;
    border-bottom-color: #2F80ED;
}

.email-templates-tab-content {
    display: none;
    padding: 0;
}

.email-templates-tab-content.active {
    display: block;
}

.email-template-section {
    margin-top: 32px;
    padding: 0;
}

.email-template-title {
    font-size: 18px;
    font-weight: 600;
    color: #111827;
    margin: 0 0 24px 0;
    padding: 0;
}

.email-template-actions {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding: 16px 0;
    border-top: 1px solid #e5e7eb;
}

.email-template-actions .btn {
    padding: 10px 20px;
    font-size: 14px;
    font-weight: 500;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s ease;
}

.email-template-actions .btn-primary {
    background-color: #2F80ED;
    color: #ffffff;
    border: 1px solid #2F80ED;
}

.email-template-actions .btn-primary:hover:not(:disabled) {
    background-color: #2563eb;
    border-color: #2563eb;
}

.email-template-actions .btn-primary:disabled {
    background-color: #9ca3af;
    border-color: #9ca3af;
    cursor: not-allowed;
    opacity: 0.6;
}

.email-template-actions .btn-outline-primary {
    background-color: #ffffff;
    color: #2F80ED;
    border: 1px solid #2F80ED;
}

.email-template-actions .btn-outline-primary:hover:not(:disabled) {
    background-color: #eff6ff;
    border-color: #2563eb;
}

.email-template-actions .btn-outline-primary:disabled {
    color: #9ca3af;
    border-color: #d1d5db;
    cursor: not-allowed;
    opacity: 0.6;
}

.email-template-actions .btn i {
    margin-right: 6px;
}

/* Email Preview Modal */
.email-preview-subject {
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e7eb;
}

.email-preview-subject strong {
    color: #374151;
    font-weight: 600;
}

.email-preview-content {
    margin-top: 16px;
}

.email-preview-content pre {
    white-space: pre-wrap;
    word-wrap: break-word;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.6;
    color: #374151;
    background-color: #f9fafb;
    padding: 16px;
    border-radius: 6px;
    border: 1px solid #e5e7eb;
    margin: 0;
}

/* --- Design fixes --- */

/* Global */
.form-group .form-check {
    padding-left: 0 !important;
}

.form-check-input[type="radio"] {
    margin-left: 0 !important;
}

/* Dashboard */
#page-local-edwiserstore-dashboard #page,
#page-local-edwiserstore-products #page,
#page-local-edwiserstore-orders #page,
#page-local-edwiserstore-subscriptions #page,
#page-local-edwiserstore-coupons #page,
#page-local-edwiserstore-reviews #page,
#page-local-edwiserstore-shopsettings #page,
#page-local-edwiserstore-paymentsettings #page,
#page-local-edwiserstore-emailtemplates #page {
  padding: 0 !important;
}

#page-local-edwiserstore-dashboard #topofscroll,
#page-local-edwiserstore-products #topofscroll,
#page-local-edwiserstore-orders #topofscroll,
#page-local-edwiserstore-subscriptions #topofscroll,
#page-local-edwiserstore-coupons #topofscroll,
#page-local-edwiserstore-reviews #topofscroll,
#page-local-edwiserstore-shopsettings #topofscroll,
#page-local-edwiserstore-paymentsettings #topofscroll,
#page-local-edwiserstore-emailtemplates #topofscroll {
  padding: 0 !important;
  max-width: 100% !important;
}

#page-local-edwiserstore-dashboard #page-content div[role='main'],
#page-local-edwiserstore-products #page-content div[role='main'],
#page-local-edwiserstore-orders #page-content div[role='main'],
#page-local-edwiserstore-subscriptions #page-content div[role='main'],
#page-local-edwiserstore-coupons #page-content div[role='main'],
#page-local-edwiserstore-reviews #page-content div[role='main'],
#page-local-edwiserstore-shopsettings #page-content div[role='main'],
#page-local-edwiserstore-paymentsettings #page-content div[role='main'],
#page-local-edwiserstore-emailtemplates #page-content div[role='main'] {
  padding: 0 !important;
}

/* Shop */
#page-local-edwiserstore-shop #page {
  padding: 0 !important;
}

#page-local-edwiserstore-shop #topofscroll {
  padding: 0 !important;
  max-width: 100% !important;
}

#page-local-edwiserstore-shop #page-content div[role='main'] {
  padding: 0 !important;
}

#page-local-edwiserstore-shop #page-header {
  padding: 12px 24px !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
}

#page-local-edwiserstore-shop .local-edwiserstore-shop-page {
  max-width: 1320px !important;
  margin: 0 auto !important;
}

#page-local-edwiserstore-shop .shop-product-link:hover,
#page-local-edwiserstore-shop .shop-product-link:focus,
#page-local-edwiserstore-shop .shop-product-list-link:hover,
#page-local-edwiserstore-shop .shop-product-list-link:focus {
  text-decoration: none !important;
}

#page-local-edwiserstore-shop .shop-product-list-link {
  gap: 0 !important;
}

#page-local-edwiserstore-shop .shop-product-link .shop-product-category-tag {
  margin-bottom: 0 !important;
}

#page-local-edwiserstore-shop
  .shop-product-list-link
  .shop-product-category-tag {
  margin-left: 0 !important;
  margin-top: 0 !important;
}

.local-edwiserstore-shop-page .shop-category-wrapper {
  max-width: 250px !important;
}

.local-edwiserstore-shop-page .shop-category-wrapper #shop-category-select {
  min-width: unset !important;
  width: 100% !important;
}

.local-edwiserstore-shop-page .shop-view-toggle {
  flex-shrink: 0 !important;
}

/* Product View */
#page-local-edwiserstore-productview #page {
  padding: 0 !important;
}

#page-local-edwiserstore-productview #topofscroll {
  padding: 0 !important;
  max-width: 100% !important;
}

#page-local-edwiserstore-productview #page-content div[role='main'] {
  padding: 0 !important;
}

#page-local-edwiserstore-productview #page-header {
  display: none !important;
}

#page-local-edwiserstore-productview .local-edwiserstore-product-view-page {
  max-width: 1320px !important;
  margin: 0 auto !important;
}

#page-local-edwiserstore-productview
  .product-view-sidebar-container
  .product-view-pricing {
  padding: 24px !important;
}

#page-local-edwiserstore-productview .product-view-price-row {
  line-height: 1 !important;
}

/* Cart */
#page-local-edwiserstore-cart #page {
  padding: 0 !important;
}

#page-local-edwiserstore-cart #topofscroll {
  padding: 0 !important;
  max-width: 100% !important;
}

#page-local-edwiserstore-cart #page-content div[role='main'] {
  padding: 0 !important;
}

#page-local-edwiserstore-cart #page-header {
  display: none !important;
}

#page-local-edwiserstore-cart .local-edwiserstore-cart-page {
  max-width: 1320px !important;
  margin: 0 auto !important;
}

#page-local-edwiserstore-cart .coupon-input-wrapper {
  margin-left: 0 !important;
  max-width: 100% !important;
}

/* Checkout */
#page-local-edwiserstore-checkout #page {
  padding: 0 !important;
}

#page-local-edwiserstore-checkout #topofscroll {
  padding: 0 !important;
  max-width: 100% !important;
}

#page-local-edwiserstore-checkout #page-content div[role='main'] {
  padding: 0 !important;
}

#page-local-edwiserstore-checkout #page-header {
  display: none !important;
}

#page-local-edwiserstore-checkout .local-edwiserstore-checkout-page {
  max-width: 1320px !important;
  margin: 0 auto !important;
}


#page-local-edwiserstore-productview  #reviewarea .ratings-block-wrapper {
    justify-content: space-around;
}

#page-local-edwiserstore-productview  #reviewarea .ratings-block-wrapper .avg-rating-progress{
    width: 80%;
    flex: 0.5 1 80%;
}

#page-local-edwiserstore-productview #reviewarea .ratings-block-wrapper .avg-rating-progress .progress-wrapper {
    display: flex;
    align-items: center;
}

#page-local-edwiserstore-productview #reviewarea .ratings-block-wrapper .avg-rating-progress .progress-wrapper .progress{
    flex: 1 1 80%;
    margin-right: 30px;
}

#page-local-edwiserstore-productview #reviewarea .ratings-block-wrapper .avg-rating-progress .progress-wrapper .stars{
    flex: 1 1 20%;
}

/* Modal dialog form check input styling for edit product page */
.modal-dialog .form-check .form-check-input {
    margin-left: auto;
    margin-right: 10px;
}