/* /Pages/AIAssistant.razor.rz.scp.css */
.ai-assistant-page[b-yp5g0i5z89] {
    min-height: 100vh;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    padding: 2rem;
}

.ai-assistant-header[b-yp5g0i5z89] {
    text-align: center;
    color: white;
    margin-bottom: 2rem;
}

.ai-assistant-header h1[b-yp5g0i5z89] {
    font-size: 2.5rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.ai-assistant-header .subtitle[b-yp5g0i5z89] {
    font-size: 1.1rem;
    opacity: 0.9;
}

.ai-assistant-content[b-yp5g0i5z89] {
    max-width: 700px;
    margin: 0 auto;
    background: white;
    border-radius: 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    overflow: hidden;
}

@media (max-width: 768px) {
    .ai-assistant-page[b-yp5g0i5z89] {
        padding: 1rem;
    }

    .ai-assistant-header h1[b-yp5g0i5z89] {
        font-size: 1.8rem;
    }

    .ai-assistant-content[b-yp5g0i5z89] {
        border-radius: 16px;
    }
}
/* /Pages/AITest.razor.rz.scp.css */
.ai-test-container[b-yyy4kqoz33] {
    background-color: #f5f5f5;
    min-height: 100vh;
    padding: 24px;
}

.ai-test-content[b-yyy4kqoz33] {
    max-width: 1400px;
    margin: 0 auto;
}

.ai-test-header[b-yyy4kqoz33] {
    margin-bottom: 24px;
}

.ai-test-header h1[b-yyy4kqoz33] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.ai-test-header p[b-yyy4kqoz33] {
    color: #666;
    font-size: 13px;
}

.test-section[b-yyy4kqoz33] {
    background: #fff;
    border-radius: 4px;
    padding: 24px;
    margin-bottom: 20px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.test-section h2[b-yyy4kqoz33] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 8px;
}

.test-section h2 i[b-yyy4kqoz33] {
    color: #1976d2;
}

.status-grid[b-yyy4kqoz33] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
    margin-top: 16px;
}

.status-card[b-yyy4kqoz33] {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 16px;
    transition: all 0.2s ease;
}

.status-card.available[b-yyy4kqoz33] {
    border-color: #4caf50;
    background: #e8f5e9;
}

.status-card.unavailable[b-yyy4kqoz33] {
    border-color: #f44336;
    background: #ffebee;
}

.provider-name[b-yyy4kqoz33] {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: #333;
}

.default-badge[b-yyy4kqoz33] {
    background: #ff9800;
    color: white;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 600;
}

.provider-status[b-yyy4kqoz33] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
}

.provider-status i[b-yyy4kqoz33] {
    font-size: 14px;
}

.status-card.available .provider-status[b-yyy4kqoz33] {
    color: #2e7d32;
}

.status-card.unavailable .provider-status[b-yyy4kqoz33] {
    color: #c62828;
}

.timestamp[b-yyy4kqoz33] {
    margin-top: 12px;
    font-size: 12px;
    color: #999;
    text-align: right;
}

.form-group[b-yyy4kqoz33] {
    margin-bottom: 16px;
}

.form-group label[b-yyy4kqoz33] {
    display: block;
    font-weight: 500;
    font-size: 12px;
    color: #666;
    margin-bottom: 6px;
}

.form-control[b-yyy4kqoz33] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    color: #333;
    box-sizing: border-box;
}

select.form-control[b-yyy4kqoz33] {
    padding: 8px 40px 8px 12px;
    background-color: #fff;
    cursor: pointer;
    height: 38px;
    line-height: 1.4;
}

.form-control:focus[b-yyy4kqoz33] {
    outline: none;
    border-color: #1976d2;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);
}

.result-card[b-yyy4kqoz33] {
    margin-top: 16px;
    border-radius: 4px;
    padding: 16px;
    border: 1px solid;
}

.result-card.success[b-yyy4kqoz33] {
    border-color: #4caf50;
    background: #e8f5e9;
}

.result-card.error[b-yyy4kqoz33] {
    border-color: #f44336;
    background: #ffebee;
}

.result-header[b-yyy4kqoz33] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 12px;
}

.result-card.success .result-header[b-yyy4kqoz33] {
    color: #2e7d32;
}

.result-card.error .result-header[b-yyy4kqoz33] {
    color: #c62828;
}

.result-header i[b-yyy4kqoz33] {
    font-size: 16px;
}

.result-content[b-yyy4kqoz33] {
    color: #333;
    font-size: 14px;
}

.ai-response[b-yyy4kqoz33] {
    background: #fff;
    padding: 12px;
    border-radius: 4px;
    border-left: 3px solid #4caf50;
    margin: 10px 0;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 1.5;
}

.result-meta[b-yyy4kqoz33] {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 12px;
    font-size: 12px;
    color: #666;
}

.error-message[b-yyy4kqoz33] {
    color: #c62828;
    font-weight: 500;
}

button:disabled[b-yyy4kqoz33] {
    opacity: 0.6;
    cursor: not-allowed;
}

.fa-spinner[b-yyy4kqoz33] {
    animation: spin-b-yyy4kqoz33 1s linear infinite;
}

@keyframes spin-b-yyy4kqoz33 {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

/* Responsive */
@media (max-width: 768px) {
    .ai-test-container[b-yyy4kqoz33] {
        padding: 16px;
    }

    .test-section[b-yyy4kqoz33] {
        padding: 16px;
    }

    .status-grid[b-yyy4kqoz33] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/BlobStoragePage.razor.rz.scp.css */
/* === Base Container === */
.blob-storage-container[b-l4u9kwegzg] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.blob-storage-content[b-l4u9kwegzg] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-l4u9kwegzg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-l4u9kwegzg] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-l4u9kwegzg] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-l4u9kwegzg] {
    display: flex;
    gap: 8px;
}

/* === Buttons === */
.btn-action[b-l4u9kwegzg] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action:hover[b-l4u9kwegzg] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-action:disabled[b-l4u9kwegzg] {
    opacity: 0.6;
    cursor: not-allowed;
}

/* === Filter Bar === */
.filter-bar[b-l4u9kwegzg] {
    display: flex;
    gap: 12px;
    padding: 16px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    align-items: center;
}

.search-box[b-l4u9kwegzg] {
    flex: 1;
}

.filter-dropdown[b-l4u9kwegzg] {
    width: 180px;
}

.sort-dropdown[b-l4u9kwegzg] {
    width: 160px;
}

/* === Results Count === */
.results-count[b-l4u9kwegzg] {
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
}

/* === Empty State === */
.empty-state[b-l4u9kwegzg] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.empty-state i[b-l4u9kwegzg] {
    font-size: 48px;
    color: #ccc;
    margin-bottom: 16px;
}

.empty-state h3[b-l4u9kwegzg] {
    font-size: 16px;
    color: #333;
    margin: 0 0 8px 0;
    font-weight: 600;
}

.empty-state p[b-l4u9kwegzg] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

/* === Blob Cards === */
.blob-card[b-l4u9kwegzg] {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.blob-image-container[b-l4u9kwegzg] {
    width: 100%;
    padding-top: 100%;
    position: relative;
    overflow: hidden;
    background-color: #f5f5f5;
    border-radius: 8px 8px 0 0;
}

.blob-image[b-l4u9kwegzg] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blob-file-icon-container[b-l4u9kwegzg] {
    width: 100%;
    padding-top: 100%;
    position: relative;
    background-color: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px 8px 0 0;
}

.blob-file-icon[b-l4u9kwegzg] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 64px;
    color: #666;
}

.blob-info[b-l4u9kwegzg] {
    padding: 8px 12px;
    border-bottom: 1px solid #e0e0e0;
    cursor: help;
}

.blob-meta[b-l4u9kwegzg] {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.blob-size[b-l4u9kwegzg] {
    font-size: 12px;
    font-weight: 500;
    color: #555;
}

.blob-modified[b-l4u9kwegzg] {
    font-size: 11px;
    color: #999;
}

.blob-usage[b-l4u9kwegzg] {
    padding: 10px 12px;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fafafa;
}

.usage-type[b-l4u9kwegzg] {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
    margin-bottom: 6px;
}

.usage-unused[b-l4u9kwegzg] {
    background-color: #f0f0f0;
    color: #666;
}

.usage-product[b-l4u9kwegzg] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.usage-qomponent[b-l4u9kwegzg] {
    background-color: #f3e5f5;
    color: #7b1fa2;
}

.usage-multiple[b-l4u9kwegzg] {
    background-color: #fff3e0;
    color: #f57c00;
}

.usage-socialmedia[b-l4u9kwegzg] {
    background-color: #e8f5e9;
    color: #2e7d32;
}

.usage-css[b-l4u9kwegzg] {
    background-color: #fce4ec;
    color: #c2185b;
}

.usage-details[b-l4u9kwegzg] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.usage-item[b-l4u9kwegzg] {
    font-size: 11px;
    color: #555;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.blob-actions[b-l4u9kwegzg] {
    padding: 10px 12px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.action-row[b-l4u9kwegzg] {
    display: flex;
    gap: 6px;
}

.action-row .e-btn[b-l4u9kwegzg] {
    flex: 1;
    justify-content: center;
    font-size: 11px;
    padding: 6px 8px;
}

.CardMargin[b-l4u9kwegzg] {
    margin-bottom: 16px;
    padding: 0 8px;
}

.text-warning[b-l4u9kwegzg] {
    color: #e53935;
    font-size: 13px;
    margin-top: 10px;
}

/* === Responsive === */
@media (max-width: 768px) {
    .blob-storage-container[b-l4u9kwegzg] {
        margin-left: 0;
    }

    .blob-storage-content[b-l4u9kwegzg] {
        padding: 16px;
    }

    .page-header[b-l4u9kwegzg] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .page-header-right[b-l4u9kwegzg] {
        width: 100%;
    }

    .btn-action[b-l4u9kwegzg] {
        flex: 1;
        justify-content: center;
    }

    .filter-bar[b-l4u9kwegzg] {
        flex-direction: column;
        align-items: stretch;
    }

    .search-box[b-l4u9kwegzg],
    .filter-dropdown[b-l4u9kwegzg],
    .sort-dropdown[b-l4u9kwegzg] {
        width: 100%;
    }
}
/* /Pages/BusinessUnitAdminPage.razor.rz.scp.css */
/* === Base Container === */
.business-unit-container[b-ezubzt5rxp] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.business-unit-content[b-ezubzt5rxp] {
    max-width: 1000px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-ezubzt5rxp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-ezubzt5rxp] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-ezubzt5rxp] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-ezubzt5rxp] {
    display: flex;
    gap: 8px;
}

/* === Buttons === */
.btn-action[b-ezubzt5rxp] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action:hover[b-ezubzt5rxp] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-action:disabled[b-ezubzt5rxp] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-action.primary[b-ezubzt5rxp] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.btn-action.primary:hover[b-ezubzt5rxp] {
    background: #1565c0;
}

.btn-action.primary i[b-ezubzt5rxp] {
    color: #fff;
    opacity: 1;
    visibility: visible;
}

.btn-icon[b-ezubzt5rxp] {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    background: transparent;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-icon:hover[b-ezubzt5rxp] {
    background: #f5f5f5;
    border-color: #1976d2;
    color: #1976d2;
}

.btn-icon.danger:hover[b-ezubzt5rxp] {
    background: #ffebee;
    border-color: #dc3545;
    color: #dc3545;
}

/* === Loading State === */
.loading-state[b-ezubzt5rxp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 8px;
    color: #666;
    gap: 12px;
}

.loading-state i[b-ezubzt5rxp] {
    font-size: 24px;
    color: #999;
}

/* === Settings Card === */
.settings-card[b-ezubzt5rxp] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.card-header[b-ezubzt5rxp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e0e0;
    background: #fafafa;
}

.card-header > i[b-ezubzt5rxp] {
    color: #1976d2;
    font-size: 16px;
}

.card-header .btn-action i[b-ezubzt5rxp] {
    color: inherit;
}

.card-header h2[b-ezubzt5rxp] {
    flex: 1;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.card-body[b-ezubzt5rxp] {
    padding: 20px;
}

/* === Form Elements === */
.form-row[b-ezubzt5rxp] {
    display: flex;
    gap: 16px;
    margin-bottom: 16px;
}

.form-group[b-ezubzt5rxp] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group label[b-ezubzt5rxp] {
    font-size: 13px;
    font-weight: 500;
    color: #666;
}

.checkbox-group[b-ezubzt5rxp] {
    flex: 0 0 auto;
    justify-content: flex-end;
}

.form-actions[b-ezubzt5rxp] {
    display: flex;
    justify-content: flex-end;
    padding-top: 8px;
    border-top: 1px solid #f0f0f0;
}

/* === Business Times Table === */
.time-type-section[b-ezubzt5rxp] {
    margin-bottom: 24px;
}

.time-type-section:last-child[b-ezubzt5rxp] {
    margin-bottom: 0;
}

.time-type-section h3[b-ezubzt5rxp] {
    font-size: 14px;
    font-weight: 600;
    color: #1976d2;
    margin: 0 0 12px 0;
    padding-bottom: 8px;
    border-bottom: 2px solid #e3f2fd;
}

.times-table[b-ezubzt5rxp] {
    width: 100%;
    border-collapse: collapse;
}

.times-table th[b-ezubzt5rxp],
.times-table td[b-ezubzt5rxp] {
    padding: 10px 12px;
    text-align: left;
    border-bottom: 1px solid #f0f0f0;
}

.times-table th[b-ezubzt5rxp] {
    font-size: 12px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    background: #fafafa;
}

.times-table td[b-ezubzt5rxp] {
    font-size: 14px;
    color: #333;
}

.times-table tr:hover[b-ezubzt5rxp] {
    background: #fafafa;
}

.actions-cell[b-ezubzt5rxp] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.empty-message[b-ezubzt5rxp] {
    color: #999;
    font-size: 13px;
    font-style: italic;
    padding: 12px 0;
}

/* === Dialog === */
.dialog-form[b-ezubzt5rxp] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

[b-ezubzt5rxp] .time-dialog .e-dlg-header-content {
    border-bottom: 1px solid #e0e0e0;
    padding: 16px 20px;
}

[b-ezubzt5rxp] .time-dialog .e-dlg-content {
    padding: 20px;
}

[b-ezubzt5rxp] .time-dialog .e-footer-content {
    display: flex !important;
    flex-direction: row !important;
    gap: 8px;
    justify-content: flex-end;
    padding: 16px 20px;
    border-top: 1px solid #e0e0e0;
}

[b-ezubzt5rxp] .time-dialog .e-footer-content button {
    margin: 0 !important;
}

/* === Responsive === */
@media (max-width: 768px) {
    .business-unit-container[b-ezubzt5rxp] {
        margin-left: 0;
    }

    .form-row[b-ezubzt5rxp] {
        flex-direction: column;
    }

    .page-header[b-ezubzt5rxp] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
}
/* /Pages/CataloguePage.razor.rz.scp.css */
/* === Base Container === */
.catalogue-container[b-fg8wgxlgyu] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.catalogue-content[b-fg8wgxlgyu] {
    max-width: 1600px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-fg8wgxlgyu] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-fg8wgxlgyu] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-fg8wgxlgyu] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

/* === Product Layout === */
.product-layout[b-fg8wgxlgyu] {
    display: grid;
    grid-template-columns: 380px 1fr;
    gap: 20px;
    align-items: start;
}

.product-sidebar[b-fg8wgxlgyu] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.product-grid-area[b-fg8wgxlgyu] {
    min-width: 0;
}

/* === Responsive === */
@media (max-width: 1200px) {
    .product-layout[b-fg8wgxlgyu] {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px) {
    .catalogue-container[b-fg8wgxlgyu] {
        margin-left: 0;
    }

    .catalogue-content[b-fg8wgxlgyu] {
        padding: 16px;
    }
}
/* /Pages/CatalogueV2Page.razor.rz.scp.css */
.CardPositionCenter[b-fgbl67291v] {
    padding: 1rem;
    display: flex;
    justify-content: center;
    position: absolute;
}

.content-wrapper[b-fgbl67291v] {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.CardMargin[b-fgbl67291v] {
    padding-bottom: 5px;
    vertical-align: top;
    margin-left: 2px;
    margin-right: 2px;
}

.wrapper[b-fgbl67291v] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.wrapper-left[b-fgbl67291v] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.wrapper-right[b-fgbl67291v] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}

e-listview .e-list-group-item[b-fgbl67291v] {
    top: 0.5em;
    right: 0.5em;
    position: absolute;
    margin-left: 2px;
}

.buttonPosition[b-fgbl67291v] {
    margin-left: 10px;
    margin-bottom: 5px; 
    width:100%;
}

[b-fgbl67291v] #MenyButtonGroup .e-btn {
    background-color: #FFFFFF;
    border-color: #cccccc;
    color: #6c757d;
    border: 0;
}

[b-fgbl67291v] #MenyButtonGroup .e-btn:hover {
    background-color: #DCDCDC;
    border-color: #cccccc;
    color: #6c757d;
    border: 0;
}

[b-fgbl67291v] #MenyButtonGroup .e-btn:focus {
    background-color: #808080;
    border-color: #cccccc;
    color: #FFFFFF;
    border: 0; 
}

[b-fgbl67291v] #MenyButtonGroup .e-btn:active {
    background-color: #808080;
    border-color: #cccccc;
    color: #FFFFFF;
    border: 0;
}

[b-fgbl67291v] #MenyButtonGroup .e-select {
    background-color: #808080 !important;
    border-color: #cccccc;
    color: #FFFFFF;
    border: 0;
}

[b-fgbl67291v] #MenyButtonGroup .e-btn-group.e-remove-border input:focus + label.e-btn {
    outline: none !important;
}

[b-fgbl67291v] .Catalogue-grid-card {
    width: 98%;
    height 180px; 
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    border: 1px solid rgba(0,0,0,0.10);
}

[b-fgbl67291v] .e-card .e-card-content {
    font-size: 14px;
    line-height: normal;
    padding: 0px;
}

.squared-image[b-fgbl67291v] {
    width: 100%; /* Set the width to 100% of the container */
    padding-top: 100%; /* Set the height to be the same as the width to create a square */
    object-fit: cover; /* This property is used to scale the image while maintaining its aspect ratio */
}

.Frontier-Main-Queue-wrapper[b-fgbl67291v] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 10px; 
    margin-bottom: 10px; 
}

.Frontier-Main-Queue-left[b-fgbl67291v] {
   
    grid-column: 1/1;
    padding: 0 2px;
}

.Frontier-Main-Queue-right[b-fgbl67291v] {
    text-align: right;
    grid-column: 5/7;
}

.Frontier-Queue[b-fgbl67291v] {
    font-size: 1em;
    font-weight: 600;
    text-align: center;
}

.e-btn[b-fgbl67291v] {
    width: 100%; /* Make the button fill the container width */
}


.grid-container[b-fgbl67291v] {
    display: grid;
    grid-template-columns: auto auto;
    padding: 10px;
    font-size: 14px;
}

.grid-item-left[b-fgbl67291v] {
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-right[b-fgbl67291v] {
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-wide-Span-2[b-fgbl67291v] {
    grid-column: span 2;
    margin-left: 0;
    padding-bottom: 20px;
}
/* /Pages/Checkout.razor.rz.scp.css */
body[b-ax08yuk0v1] {
    background-color: #f2f2f2;
}

.Cart[b-ax08yuk0v1] {
    background-color: #000000;
    position: fixed;
    left: 50%;
    bottom: 40px;
    z-index: 101;
    width: 250px;
    margin-left: -125px; /* Negative half of width. */
}

.CardPositionCenter[b-ax08yuk0v1] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.CardBottomMargin[b-ax08yuk0v1] {
    padding-bottom: 10px;
}


 [b-ax08yuk0v1] .e-card .e-card-content {
        padding: 0px;
    }

.MessageToUser[b-ax08yuk0v1] {
    font-family: Helvetica, 'Segoe UI' !important;
    vert-align: top;
    padding: 20px;
    font-size: medium;
}

.OrderNumber[b-ax08yuk0v1] {
    font-size: 60px;
    width: 3em;
    padding: 0.2em 0.2em;
}

.CardHeader[b-ax08yuk0v1] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

 .wrapper[b-ax08yuk0v1] {
     width: auto;
     height: auto;
     box-sizing: border-box;
     display: grid;
     grid-auto-flow: row;
     /*grid-template-columns: 50px auto 65px;*/
     color: #808080;
 }

 .left[b-ax08yuk0v1] {
     /*height: 65px;*/
 }

 .Center[b-ax08yuk0v1] {
     text-align: left;
     /* height: 65px;*/
 }

 .right[b-ax08yuk0v1] {
     /*height: 65px;*/
 }

.ProductNumber[b-ax08yuk0v1] {
    position: absolute;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductName[b-ax08yuk0v1] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductDescription[b-ax08yuk0v1] {
    padding-top: 2px;
    padding-left: 0.6em;
    word-wrap: break-word;
}

 .DescriptionText[b-ax08yuk0v1] {
     width: 97%;
     font-family: Helvetica, 'Segoe UI' !important;
     font-size: 12px !important;
 }

.ProductPrice[b-ax08yuk0v1] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
    right: 20px;
    position: absolute;
    width: 6em;
}


/*Buttons*/
[b-ax08yuk0v1] .BackToShopping {
    margin-top: 10px;
}

[b-ax08yuk0v1] .Pay {
    margin-top: 10px;
    position: absolute;
    right: 0;
}

[b-ax08yuk0v1] .e-priceButtonWidth {
    width: 4rem;
}




/*Accordion*/
[b-ax08yuk0v1] .e-acrdn-header-content {
    justify-content: center;
    width: 97%;
    color: #808080;
}

[b-ax08yuk0v1] .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content {
    border-top: 0px solid rgba(0,0,0,0.13);
    color: #808080;
    width: 97%;
}

[b-ax08yuk0v1] .e-accordion .e-acrdn-item .e-acrdn-header {
    /*line-height: 0px;*/
    width: 97%;
    margin-bottom: 5px;
    min-height: 5em;
    /* white-space: normal for Linebreak*/
    white-space: normal;
}
 


[b-ax08yuk0v1] .BackToShopping {
     margin-top: 10px;
 }

 :deep .Pay[b-ax08yuk0v1] {
     margin-top: 10px;
     position: absolute;
     right: 0;
 }

 [b-ax08yuk0v1] .ProductDeleteButton {
     background: rgba(255, 255, 255, 0.7);
     color: #6c757d;
     position: absolute;
     height: 23px;
     width: 55px;
     right: 40px;
     top: 31px;
 }
/* /Pages/DynamicHub.razor.rz.scp.css */
/* === Base Container === */
.hub-container[b-b3604fgmm8] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.hub-content[b-b3604fgmm8] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-b3604fgmm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-b3604fgmm8] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-b3604fgmm8] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-b3604fgmm8] {
    display: flex;
    gap: 8px;
}

/* === Buttons === */
.btn-action[b-b3604fgmm8] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action:hover[b-b3604fgmm8] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-action:disabled[b-b3604fgmm8] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-action.primary[b-b3604fgmm8] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.btn-action.primary:hover[b-b3604fgmm8] {
    background: #1565c0;
}

/* === Connection Warning === */
.connection-warning[b-b3604fgmm8] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: #fff8e1;
    border: 1px solid #ffe082;
    border-radius: 6px;
    font-size: 13px;
    color: #f57c00;
}

.connection-warning i[b-b3604fgmm8] {
    font-size: 14px;
}

/* === Loading & Empty States === */
.loading-state[b-b3604fgmm8],
.empty-state[b-b3604fgmm8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    color: #666;
    gap: 12px;
}

.loading-state i[b-b3604fgmm8],
.empty-state i[b-b3604fgmm8] {
    font-size: 24px;
    color: #999;
}

.empty-state p[b-b3604fgmm8] {
    margin: 0;
    font-size: 14px;
}

/* === Ideas Card Container === */
.ideas-card[b-b3604fgmm8] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    padding: 20px;
}

.ideas-header[b-b3604fgmm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.ideas-header-text[b-b3604fgmm8] {
    gap: 4px;
}

.ideas-header-text h3.ideas-title[b-b3604fgmm8] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.ideas-header-text p.ideas-subtitle[b-b3604fgmm8] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.ideas-header-actions[b-b3604fgmm8] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.refresh-ideas-btn[b-b3604fgmm8],
.session-feedback-btn[b-b3604fgmm8] {
    background: #fff;
    border: 1px solid #e0e0e0;
    padding: 0;
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #666;
    border-radius: 50%;
    transition: all 0.2s;
}

.refresh-ideas-btn:hover[b-b3604fgmm8],
.session-feedback-btn:hover[b-b3604fgmm8] {
    background: #e3f2fd;
    color: #1976d2;
    border-color: #1976d2;
}

.refresh-ideas-btn:disabled[b-b3604fgmm8] {
    opacity: 0.5;
    cursor: not-allowed;
}

.session-feedback-btn[b-b3604fgmm8] {
    color: #1976d2;
    border-color: #1976d2;
    background: #f5f9ff;
}

/* === Custom Idea Accordion === */
.custom-idea-accordion[b-b3604fgmm8] {
    border-top: 1px solid #e0e0e0;
    padding-top: 16px;
    margin-top: 8px;
}

.accordion-toggle[b-b3604fgmm8] {
    background: none;
    border: none;
    color: #555;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    padding: 10px 16px;
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 6px;
    transition: background-color 0.2s;
}

.accordion-toggle:hover[b-b3604fgmm8] {
    background-color: #f5f5f5;
    color: #1976d2;
}

.accordion-toggle:focus[b-b3604fgmm8],
.accordion-toggle:focus-visible[b-b3604fgmm8] {
    outline: none !important;
    background-color: #f0f7ff;
    color: #1976d2;
    box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.15);
}

.custom-idea-content[b-b3604fgmm8] {
    margin-top: 16px;
    padding: 0 16px;
    animation: slideDown-b-b3604fgmm8 0.2s ease;
}

@keyframes slideDown-b-b3604fgmm8 {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

[b-b3604fgmm8] .custom-idea-textarea {
    width: 100%;
    margin-bottom: 12px;
}

[b-b3604fgmm8] .primary-action-btn {
    background-image: none !important;
    background-color: #1976d2 !important;
    color: white !important;
    box-shadow: 0 2px 4px rgba(25, 118, 210, 0.2);
    transition: all 0.2s ease;
}

[b-b3604fgmm8] .primary-action-btn:hover {
    background-color: #1565c0 !important;
    box-shadow: 0 4px 8px rgba(25, 118, 210, 0.3);
    transform: translateY(-1px);
}

[b-b3604fgmm8] .custom-idea-textarea textarea {
    font-size: 14px;
    min-height: 80px;
    border: 2px solid #e0e0e0 !important;
    background: #fafafa !important;
    border-radius: 8px !important;
    padding: 12px 14px !important;
    transition: border-color 0.2s, background-color 0.2s;
}

[b-b3604fgmm8] .custom-idea-textarea textarea:focus {
    background: #fff !important;
    border-color: #1976d2 !important;
}

[b-b3604fgmm8] .generate-btn {
    margin-top: 12px !important;
}

/* === Generation Loading State === */
.generation-loading[b-b3604fgmm8] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    text-align: center;
}

.generation-loading .loading-icon[b-b3604fgmm8] {
    color: #FFC107;
    margin-bottom: 20px;
    animation: pulse-b-b3604fgmm8 1.5s ease-in-out infinite;
}

@keyframes pulse-b-b3604fgmm8 {

    0%,
    100% {
        opacity: 1;
        transform: scale(1);
    }

    50% {
        opacity: 0.7;
        transform: scale(1.1);
    }
}

.generation-loading h3[b-b3604fgmm8] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px 0;
}

.generation-loading .loading-step[b-b3604fgmm8] {
    font-size: 14px;
    color: #333;
    margin: 0 0 20px 0;
}

.generation-loading .progress-bar[b-b3604fgmm8] {
    width: 100%;
    max-width: 400px;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 12px;
}

.generation-loading .progress-fill[b-b3604fgmm8] {
    height: 100%;
    background-image: none !important;
    background-color: #1976d2 !important;
    border-radius: 3px;
    transition: width 0.3s ease;
}

.generation-loading .loading-time[b-b3604fgmm8] {
    font-size: 12px;
    color: #999;
    margin: 0;
}

/* === Editor Header === */
.editor-header[b-b3604fgmm8] {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e0e0e0;
}

.back-btn[b-b3604fgmm8] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: none;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 14px;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.back-btn:hover[b-b3604fgmm8] {
    border-color: #1976d2;
    color: #1976d2;
    background: #f5f5f5;
}

.back-btn i[b-b3604fgmm8] {
    font-size: 12px;
}

/* === Content Grid === */
.content-grid[b-b3604fgmm8] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
}

/* === Hub Sections (Scheduled Posts, Analytics) === */
.hub-section[b-b3604fgmm8] {
    margin-top: 32px;
    padding: 24px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.section-header[b-b3604fgmm8] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}

.section-header-left[b-b3604fgmm8] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.section-icon[b-b3604fgmm8] {
    font-size: 24px;
    color: #1976d2;
}

.section-title[b-b3604fgmm8] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.section-subtitle[b-b3604fgmm8] {
    font-size: 14px;
    color: #666;
    margin: 0;
}

.section-action-btn[b-b3604fgmm8] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.section-action-btn:hover[b-b3604fgmm8] {
    background: #f5f5f5;
    border-color: #1976d2;
    color: #1976d2;
}

.section-action-btn i[b-b3604fgmm8] {
    font-size: 12px;
}

/* === Responsive === */
@media (max-width: 1200px) {
    .content-grid[b-b3604fgmm8] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .hub-container[b-b3604fgmm8] {
        margin-left: 0;
    }

    .hub-content[b-b3604fgmm8] {
        padding: 16px;
    }

    .page-header[b-b3604fgmm8] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .page-header-right[b-b3604fgmm8] {
        width: 100%;
    }

    .btn-action[b-b3604fgmm8] {
        flex: 1;
        justify-content: center;
    }

    .content-grid[b-b3604fgmm8] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/FrontierV3.razor.rz.scp.css */

.CardPositionCenter[b-2euwwn7zs6] {
    padding: 1rem;
    display: flex;
    justify-content: center;
    position: absolute;
}

/*Both*/
.CardBottomMargin[b-2euwwn7zs6] {
    padding-bottom: 5px;
    vertical-align: top;
}

/*FrontierV3*/
.FrontierBottom[b-2euwwn7zs6] {
    padding-bottom: 100px;
    padding-bottom: 5px;
}

/*Both*/
.Frontier-Queue[b-2euwwn7zs6] {
    /*background-color: #92CDFA;*/
    padding: 0 0.2em;
    font-size: 3em; 
}

.WaitingMinutesDropddown[b-2euwwn7zs6] {
    background-color: #cccccc;
    position: fixed;
    right: 120px;
    top: 10px;
    z-index: 101;
    width: 150px;
}
/* /Pages/ImagePromptTemplatesPage.razor.rz.scp.css */
/* === Base Container === */
.prompt-templates-container[b-xmosb830vi] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.prompt-templates-content[b-xmosb830vi] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-xmosb830vi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-xmosb830vi] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-xmosb830vi] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-xmosb830vi] {
    display: flex;
    gap: 8px;
}

.btn-action[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action:hover[b-xmosb830vi] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-action:disabled[b-xmosb830vi] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-action.primary[b-xmosb830vi] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.btn-action.primary:hover[b-xmosb830vi] {
    background: #1565c0;
}

/* === Loading & Empty States === */
.loading-state[b-xmosb830vi],
.empty-state[b-xmosb830vi] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 8px;
    color: #666;
    gap: 12px;
}

.loading-state i[b-xmosb830vi],
.empty-state i[b-xmosb830vi] {
    font-size: 24px;
    color: #999;
}

/* === Capability Tabs === */
.capability-tabs[b-xmosb830vi] {
    display: flex;
    gap: 4px;
    background: #fff;
    padding: 4px;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.capability-tab[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 16px;
    background: transparent;
    border: none;
    border-radius: 6px;
    font-size: 13px;
    font-weight: 500;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.capability-tab:hover[b-xmosb830vi] {
    background: #f5f5f5;
    color: #333;
}

.capability-tab.active[b-xmosb830vi] {
    background: #1976d2;
    color: #fff;
}

.capability-tab .count[b-xmosb830vi] {
    background: rgba(0,0,0,0.1);
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
}

.capability-tab.active .count[b-xmosb830vi] {
    background: rgba(255,255,255,0.25);
}

/* === Capability Info Card === */
.capability-info-card[b-xmosb830vi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
}

.capability-info-left h2[b-xmosb830vi] {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.capability-info-left p[b-xmosb830vi] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.capability-info-right[b-xmosb830vi] {
    text-align: right;
}

.info-label[b-xmosb830vi] {
    font-size: 11px;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.inheritance-badges[b-xmosb830vi] {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}

.inheritance-badge[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
}

.inheritance-badge.tenant[b-xmosb830vi] {
    background: #e3f2fd;
    color: #1565c0;
}

.inheritance-badge.bu[b-xmosb830vi] {
    background: #e8f5e9;
    color: #2e7d32;
}

.inheritance-badge.category[b-xmosb830vi] {
    background: #fff3e0;
    color: #e65100;
}

/* === Scope Sections === */
.scope-sections[b-xmosb830vi] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.scope-section[b-xmosb830vi] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.scope-header[b-xmosb830vi] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #fafafa;
    cursor: pointer;
    transition: background 0.2s;
}

.scope-header:hover[b-xmosb830vi] {
    background: #f5f5f5;
}

.scope-header-left[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.toggle-icon[b-xmosb830vi] {
    color: #999;
    font-size: 11px;
    width: 14px;
}

.scope-icon[b-xmosb830vi] {
    font-size: 14px;
}

.scope-icon.tenant[b-xmosb830vi] { color: #1565c0; }
.scope-icon.bu[b-xmosb830vi] { color: #2e7d32; }
.scope-icon.category[b-xmosb830vi] { color: #e65100; }

.scope-title[b-xmosb830vi] {
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.template-count[b-xmosb830vi] {
    font-size: 12px;
    color: #999;
    background: #f0f0f0;
    padding: 2px 8px;
    border-radius: 10px;
}

.scope-header-right[b-xmosb830vi] {
    display: flex;
    gap: 8px;
}

.flow-badge[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #e8f5e9;
    color: #2e7d32;
    border-radius: 4px;
    font-size: 11px;
}

.inherit-badge[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    background: #e3f2fd;
    color: #1565c0;
    border-radius: 4px;
    font-size: 11px;
}

.scope-content[b-xmosb830vi] {
    padding: 16px;
    border-top: 1px solid #e0e0e0;
}

.empty-scope[b-xmosb830vi] {
    text-align: center;
    padding: 30px 20px;
    color: #666;
}

.empty-scope p[b-xmosb830vi] {
    margin: 0 0 12px 0;
    font-size: 13px;
}

.btn-add-template[b-xmosb830vi] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: transparent;
    border: 1px dashed #ccc;
    border-radius: 4px;
    font-size: 12px;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-add-template:hover[b-xmosb830vi] {
    border-color: #1976d2;
    color: #1976d2;
}

/* === Category Groups === */
.category-group[b-xmosb830vi] {
    margin-bottom: 16px;
}

.category-group:last-child[b-xmosb830vi] {
    margin-bottom: 0;
}

.category-group-header[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: #fff8e1;
    border-radius: 4px;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 500;
    color: #e65100;
}

.category-count[b-xmosb830vi] {
    background: rgba(230, 81, 0, 0.15);
    padding: 2px 8px;
    border-radius: 10px;
    font-size: 11px;
}

/* === Templates Grid === */
.templates-grid[b-xmosb830vi] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 16px;
}

/* === Template Card === */
.template-card[b-xmosb830vi] {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: box-shadow 0.2s, border-color 0.2s;
}

.template-card:hover[b-xmosb830vi] {
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.template-card.default[b-xmosb830vi] {
    border-color: #1976d2;
    border-width: 2px;
}

.template-card-header[b-xmosb830vi] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.template-name[b-xmosb830vi] {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.template-badges[b-xmosb830vi] {
    display: flex;
    gap: 4px;
}

.badge[b-xmosb830vi] {
    padding: 2px 8px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
}

.badge.default[b-xmosb830vi] {
    background: #1976d2;
    color: #fff;
}

.badge.inactive[b-xmosb830vi] {
    background: #f5f5f5;
    color: #999;
}

.badge.inherit[b-xmosb830vi] {
    background: #e3f2fd;
    color: #1565c0;
    padding: 4px 6px;
}

.template-description[b-xmosb830vi] {
    font-size: 12px;
    color: #666;
    margin: 0;
    line-height: 1.4;
}

.template-meta[b-xmosb830vi] {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    color: #999;
}

.template-meta i[b-xmosb830vi] {
    width: 14px;
    margin-right: 4px;
}

.chain-info[b-xmosb830vi] {
    color: #1976d2;
}

/* === Chain Path Visualization === */
.chain-path[b-xmosb830vi] {
    background: linear-gradient(135deg, #e3f2fd 0%, #f3e5f5 100%);
    border: 1px solid #bbdefb;
    border-radius: 6px;
    padding: 10px 12px;
    margin-top: 4px;
}

.chain-label[b-xmosb830vi] {
    font-size: 10px;
    font-weight: 600;
    color: #1565c0;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.chain-steps[b-xmosb830vi] {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.chain-step[b-xmosb830vi] {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 10px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 16px;
    font-size: 11px;
    font-weight: 500;
    color: #666;
    white-space: nowrap;
}

.chain-step i[b-xmosb830vi] {
    font-size: 10px;
    color: #999;
}

.chain-step.current[b-xmosb830vi] {
    background: #1976d2;
    border-color: #1565c0;
    color: #fff;
    font-weight: 600;
}

.chain-step.current i[b-xmosb830vi] {
    color: rgba(255,255,255,0.8);
}

.chain-arrow[b-xmosb830vi] {
    color: #90caf9;
    font-size: 10px;
}

.template-prompt[b-xmosb830vi] {
    background: #f8f9fa;
    padding: 10px;
    border-radius: 4px;
    font-size: 11px;
}

.template-prompt strong[b-xmosb830vi] {
    color: #666;
    display: block;
    margin-bottom: 4px;
}

.template-prompt code[b-xmosb830vi] {
    color: #333;
    font-family: 'Monaco', 'Consolas', monospace;
    font-size: 11px;
    line-height: 1.4;
    word-break: break-word;
}

.template-actions[b-xmosb830vi] {
    display: flex;
    gap: 8px;
    margin-top: auto;
    padding-top: 12px;
    border-top: 1px solid #f0f0f0;
}

.btn-edit[b-xmosb830vi],
.btn-delete[b-xmosb830vi] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-edit[b-xmosb830vi] {
    background: #fff;
    color: #333;
}

.btn-edit:hover[b-xmosb830vi] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-delete[b-xmosb830vi] {
    background: #fff;
    color: #d32f2f;
    border-color: #ffcdd2;
}

.btn-delete:hover[b-xmosb830vi] {
    background: #ffebee;
    border-color: #d32f2f;
}

/* === Dialog Form === */
.dialog-form[b-xmosb830vi] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-row[b-xmosb830vi] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}

.form-row.three-col[b-xmosb830vi] {
    grid-template-columns: 1fr 1fr 1fr;
}

.form-group[b-xmosb830vi] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.form-group label[b-xmosb830vi] {
    font-size: 12px;
    font-weight: 500;
    color: #666;
}

.form-group small[b-xmosb830vi] {
    font-size: 11px;
    color: #999;
}

.form-checkboxes[b-xmosb830vi] {
    display: flex;
    gap: 24px;
    padding-top: 8px;
}

/* === Responsive === */
@media (max-width: 768px) {
    .prompt-templates-container[b-xmosb830vi] {
        margin-left: 0;
    }

    .page-header[b-xmosb830vi] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .capability-tabs[b-xmosb830vi] {
        flex-wrap: wrap;
    }

    .capability-info-card[b-xmosb830vi] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .capability-info-right[b-xmosb830vi] {
        text-align: left;
    }

    .templates-grid[b-xmosb830vi] {
        grid-template-columns: 1fr;
    }

    .form-row[b-xmosb830vi],
    .form-row.three-col[b-xmosb830vi] {
        grid-template-columns: 1fr;
    }
}
/* /Pages/Index.razor.rz.scp.css */

[b-4s7qfcnkva] body {
    background-color: #f2f2f2;
}

.CartButtonPosition[b-4s7qfcnkva] {
    position: fixed;
    left: 50%;
    bottom: 40px;
    z-index: 101;
    width: 250px;
    height: 4em;
    margin-left: -125px; /* Negative half of width. */
}

.Cart[b-4s7qfcnkva] {
    background-color: #000000;
    position: fixed;
    left: 50%;
    bottom: 40px;
    z-index: 101;
    width: 250px;
    height: 4em;
    margin-left: -125px; /* Negative half of width. */
}

.CardPositionCenter[b-4s7qfcnkva] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.CardBottomMargin[b-4s7qfcnkva] {
    padding-bottom: 10px;
}

[b-4s7qfcnkva] .CartButtonSize {
    width: 250px;
    height: 4em;
}

/*This is to declare CSS on Cart button. May need to consider put this on the razor file instead with customer class name instead of overriding .e-btn  */
/*::deep .e-btn {
    width: 250px;
    height: 4em;
}
*/

@media only screen and (min-width: 768px) {
    .RightPadding[b-4s7qfcnkva] {
        padding-right: 7px;
    }

    .LeftPadding[b-4s7qfcnkva] {
        padding-left: 7px;
    }
}
/* /Pages/Layout.razor.rz.scp.css */
/* === Base Container === */
.layout-container[b-pewdzm13om] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.layout-content[b-pewdzm13om] {
    max-width: 1600px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-pewdzm13om] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-pewdzm13om] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-pewdzm13om] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-pewdzm13om] {
    display: flex;
    gap: 8px;
}

/* === Layout Preview === */
.layout-preview-wrapper[b-pewdzm13om] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.layout-preview-hint[b-pewdzm13om] {
    padding: 12px 16px;
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
    font-size: 13px;
    color: #666;
    display: flex;
    align-items: center;
    gap: 8px;
}

.layout-preview-hint i[b-pewdzm13om] {
    color: #1976d2;
}

.layout-preview[b-pewdzm13om] {
    padding: 20px;
    min-height: 400px;
}

/* === Legacy Support === */
.CardPositionCenter[b-pewdzm13om] {
    display: flex;
    justify-content: center;
    align-items: flex-start;
}

.CardBottomMargin[b-pewdzm13om] {
    padding-bottom: 20px;
    vertical-align: top;
}

/* === Responsive === */
@media (max-width: 768px) {
    .layout-container[b-pewdzm13om] {
        margin-left: 0;
    }

    .layout-content[b-pewdzm13om] {
        padding: 16px;
    }

    .page-header[b-pewdzm13om] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .page-header-right[b-pewdzm13om] {
        width: 100%;
    }
}
/* /Pages/LoggedIn.razor.rz.scp.css */
/* /Pages/Login.razor.rz.scp.css */
.login-container[b-c6j03z2rf0] {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #f5f7fa 0%, #e4e8ec 100%);
    padding: 20px;
}

.login-content[b-c6j03z2rf0] {
    width: 100%;
    max-width: 420px;
}

.login-card[b-c6j03z2rf0] {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    overflow: hidden;
}

.login-header[b-c6j03z2rf0] {
    background: linear-gradient(135deg, #1976d2 0%, #1565c0 100%);
    color: #fff;
    padding: 32px 24px;
    text-align: center;
}

.login-header h1[b-c6j03z2rf0] {
    font-size: 24px;
    font-weight: 600;
    margin: 0 0 8px 0;
}

.login-header p[b-c6j03z2rf0] {
    font-size: 14px;
    opacity: 0.9;
    margin: 0;
}

.login-body[b-c6j03z2rf0] {
    padding: 32px 24px;
}

.google-signin-btn[b-c6j03z2rf0] {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px 24px;
    background: #fff;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    font-size: 16px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s ease;
}

.google-signin-btn:hover[b-c6j03z2rf0] {
    border-color: #1976d2;
    background: #f8f9fa;
    box-shadow: 0 2px 8px rgba(25, 118, 210, 0.15);
}

.google-signin-btn:active[b-c6j03z2rf0] {
    transform: scale(0.98);
}

.google-icon[b-c6j03z2rf0] {
    flex-shrink: 0;
}

.login-divider[b-c6j03z2rf0] {
    display: flex;
    align-items: center;
    margin: 24px 0;
}

.login-divider[b-c6j03z2rf0]::before,
.login-divider[b-c6j03z2rf0]::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e0e0e0;
}

.login-divider span[b-c6j03z2rf0] {
    padding: 0 16px;
    font-size: 12px;
    color: #999;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.login-benefits[b-c6j03z2rf0] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.benefit-item[b-c6j03z2rf0] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: #f8f9fa;
    border-radius: 6px;
    font-size: 14px;
    color: #555;
}

.benefit-item i[b-c6j03z2rf0] {
    color: #1976d2;
    font-size: 16px;
    width: 20px;
    text-align: center;
}

.login-footer[b-c6j03z2rf0] {
    padding: 16px 24px;
    background: #f8f9fa;
    border-top: 1px solid #e0e0e0;
    text-align: center;
}

.login-footer p[b-c6j03z2rf0] {
    font-size: 12px;
    color: #999;
    margin: 0;
}

/* Responsive */
@media (max-width: 480px) {
    .login-container[b-c6j03z2rf0] {
        padding: 16px;
    }

    .login-header[b-c6j03z2rf0] {
        padding: 24px 20px;
    }

    .login-header h1[b-c6j03z2rf0] {
        font-size: 20px;
    }

    .login-body[b-c6j03z2rf0] {
        padding: 24px 20px;
    }

    .google-signin-btn[b-c6j03z2rf0] {
        padding: 12px 20px;
        font-size: 15px;
    }
}
/* /Pages/OrderPage.razor.rz.scp.css */
body[b-ri5in5lp9i] {
    background-color: #f2f2f2;
}

.CardPositionCenter[b-ri5in5lp9i] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.CardBottomMargin[b-ri5in5lp9i] {
    padding-bottom: 10px;
}

[b-ri5in5lp9i] .e-card .e-card-content {
    padding: 0px;
}

.MessageBox[b-ri5in5lp9i] {
    font-family: Helvetica, 'Segoe UI' !important;
    vert-align: top;
    padding: 20px;
    font-size: medium;
}

.OrderNumber[b-ri5in5lp9i] {
    font-size: 60px;
    text-align: center;
    width: 3em;
    padding: 0.2em 0.2em;
    margin: auto; /* Centerizes the order number box */
}

.CardHeader[b-ri5in5lp9i] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

.wrapper[b-ri5in5lp9i] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-ri5in5lp9i] {
    /*height: 65px;*/
}

.Center[b-ri5in5lp9i] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-ri5in5lp9i] {
    /*height: 65px;*/
}

.ProductNumber[b-ri5in5lp9i] {
    position: absolute;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductName[b-ri5in5lp9i] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductDescription[b-ri5in5lp9i] {
    padding-top: 2px;
    padding-left: 0.6em;
    word-wrap: break-word;
}

.DescriptionText[b-ri5in5lp9i] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

.ProductPrice[b-ri5in5lp9i] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
    right: 20px;
    position: absolute;
    width: 6em;
}


/*Buttons*/
[b-ri5in5lp9i] .BackToShopping {
    margin-top: 10px;
}

[b-ri5in5lp9i] .Pay {
    margin-top: 10px;
    position: absolute;
    right: 0;
}

[b-ri5in5lp9i] .e-priceButtonWidth {
    width: 4rem;
}




/*Accordion*/
[b-ri5in5lp9i] .e-acrdn-header-content {
    justify-content: center;
    width: 97%;
    color: #808080;
}

[b-ri5in5lp9i] .e-accordion .e-acrdn-item.e-select .e-acrdn-panel .e-acrdn-content {
    border-top: 0px solid rgba(0,0,0,0.13);
    color: #808080;
    width: 97%;
}

[b-ri5in5lp9i] .e-accordion .e-acrdn-item .e-acrdn-header {
    /*line-height: 0px;*/
    width: 97%;
    margin-bottom: 5px;
    min-height: 5em;
    /* white-space: normal for Linebreak*/
    white-space: normal;
}



[b-ri5in5lp9i] .BackToShopping {
    margin-top: 10px;
}

:deep .Pay[b-ri5in5lp9i] {
    margin-top: 10px;
    position: absolute;
    right: 0;
}

[b-ri5in5lp9i] .ProductDeleteButton {
    background: rgba(255, 255, 255, 0.7);
    color: #6c757d;
    position: absolute;
    height: 23px;
    width: 55px;
    right: 40px;
    top: 31px;
}


.wrapper[b-ri5in5lp9i] {
width: auto;
height: auto;
box-sizing: border-box;
display: grid;
grid-auto-flow: row;
/*grid-template-columns: 50px auto 65px;*/
color: #808080;
}

.left[b-ri5in5lp9i] {
/*height: 65px;*/
}

.Center[b-ri5in5lp9i] {
text-align: left;
/* height: 65px;*/
}

.right[b-ri5in5lp9i] {
/*height: 65px;*/
}

[b-ri5in5lp9i] .Pay {
margin-top: 10px;
position: absolute;
right: 0;
}

[b-ri5in5lp9i] .BackToShopping {
margin-top: 10px;
}


/* DivTable.com */
.divTable[b-ri5in5lp9i] {
    font-family: Helvetica, 'Segoe UI' !important;
    display: table;
    width: 90%;
    min-width: 250px;
    margin: 0 auto;
}

.divTableRow[b-ri5in5lp9i] {
    display: table-row;
}

.divTableCell[b-ri5in5lp9i], .divTableHead[b-ri5in5lp9i] {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
}

.divTableHeading[b-ri5in5lp9i] {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot[b-ri5in5lp9i] {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody[b-ri5in5lp9i] {
    display: table-row-group;
}

[b-ri5in5lp9i] .BackToShopping {
    margin-top: 10px;
}
/* /Pages/PhotoMatchingPage.razor.rz.scp.css */
/* === Base Container === */
.photo-matching-container[b-y23qwzd4jp] {
    min-height: 100vh;
    background: #f5f5f5;
    margin-left: 72px;
}

.photo-matching-content[b-y23qwzd4jp] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-y23qwzd4jp] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header h1[b-y23qwzd4jp] {
    margin: 0 0 4px 0;
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.page-header p[b-y23qwzd4jp] {
    margin: 0;
    color: #666;
    font-size: 13px;
}

.page-header-right[b-y23qwzd4jp] {
    display: flex;
    gap: 8px;
}

/* === Buttons === */
.btn-action[b-y23qwzd4jp] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    background: #fff;
    color: #333;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-action:hover[b-y23qwzd4jp] {
    border-color: #1976d2;
    color: #1976d2;
}

.btn-action:disabled[b-y23qwzd4jp] {
    opacity: 0.6;
    cursor: not-allowed;
}

.btn-action.primary[b-y23qwzd4jp] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.btn-action.primary:hover[b-y23qwzd4jp] {
    background: #1565c0;
    border-color: #1565c0;
}

.btn-action.danger[b-y23qwzd4jp] {
    background: #c62828;
    border-color: #c62828;
    color: white;
}

.btn-action.danger:hover[b-y23qwzd4jp] {
    background: #b71c1c;
    border-color: #b71c1c;
}

/* === Loading & Empty States === */
.loading-state[b-y23qwzd4jp],
.empty-state[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 60px 20px;
    background: #fff;
    border-radius: 8px;
    color: #666;
    gap: 12px;
}

.loading-state i[b-y23qwzd4jp],
.empty-state i[b-y23qwzd4jp] {
    font-size: 24px;
    color: #999;
}

/* === Three Panel Layout === */
.three-panel-layout[b-y23qwzd4jp] {
    display: grid;
    grid-template-columns: 280px 1fr 340px;
    gap: 16px;
    height: calc(100vh - 160px);
}

.panel[b-y23qwzd4jp] {
    background: white;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.panel-header[b-y23qwzd4jp] {
    padding: 14px 16px;
    border-bottom: 1px solid #e0e0e0;
    flex-shrink: 0;
}

.panel-header h3[b-y23qwzd4jp] {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    display: flex;
    align-items: center;
    gap: 8px;
}

.panel-header i[b-y23qwzd4jp] {
    color: #1976d2;
}

.filter-controls[b-y23qwzd4jp] {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.search-input[b-y23qwzd4jp], .status-filter[b-y23qwzd4jp], .type-filter[b-y23qwzd4jp] {
    padding: 7px 10px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    background: white;
}

.search-input:focus[b-y23qwzd4jp], .status-filter:focus[b-y23qwzd4jp], .type-filter:focus[b-y23qwzd4jp] {
    outline: none;
    border-color: #1976d2;
}

.search-input[b-y23qwzd4jp] {
    flex: 1;
}

.status-filter[b-y23qwzd4jp], .type-filter[b-y23qwzd4jp] {
    min-width: 90px;
}

.panel-content[b-y23qwzd4jp] {
    flex: 1;
    overflow-y: auto;
    padding: 10px;
}

/* === Product List === */
.product-list[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.product-item[b-y23qwzd4jp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px;
    background: #fafafa;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid transparent;
}

.product-item:hover[b-y23qwzd4jp] {
    background: #f0f0f0;
}

.product-item.selected[b-y23qwzd4jp] {
    background: #e3f2fd;
    border-color: #1976d2;
}

.product-item.has-ai .product-number[b-y23qwzd4jp] {
    color: #2e7d32;
}

.product-status i[b-y23qwzd4jp] {
    font-size: 14px;
}

.text-success[b-y23qwzd4jp] {
    color: #2e7d32;
}

.text-muted[b-y23qwzd4jp] {
    color: #9e9e9e;
}

.product-info[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.product-number[b-y23qwzd4jp] {
    font-weight: 600;
    font-size: 12px;
    color: #1976d2;
}

.product-name[b-y23qwzd4jp] {
    font-size: 13px;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.product-category[b-y23qwzd4jp] {
    font-size: 11px;
    color: #666;
}

/* === Photo Grid === */
.photo-grid[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.photo-item[b-y23qwzd4jp] {
    display: flex;
    gap: 10px;
    padding: 8px;
    background: #fafafa;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
    border: 1px solid transparent;
    position: relative;
}

.photo-item:hover[b-y23qwzd4jp] {
    background: #f0f0f0;
}

.photo-item.selected[b-y23qwzd4jp] {
    background: #e3f2fd;
    border-color: #1976d2;
}

.photo-thumbnail[b-y23qwzd4jp] {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
    flex-shrink: 0;
}

.photo-item.selected .photo-thumbnail[b-y23qwzd4jp] {
    border-color: #1976d2;
}

.selection-badge[b-y23qwzd4jp] {
    position: absolute;
    top: 4px;
    right: 4px;
    width: 22px;
    height: 22px;
    background: #1976d2;
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.photo-info[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1;
}

.photo-filename[b-y23qwzd4jp] {
    font-size: 11px;
    color: #666;
    font-family: monospace;
}

.photo-dish[b-y23qwzd4jp] {
    font-weight: 600;
    font-size: 13px;
    color: #333;
}

.photo-type[b-y23qwzd4jp] {
    font-size: 11px;
    color: #1976d2;
    background: #e3f2fd;
    padding: 2px 6px;
    border-radius: 3px;
    display: inline-block;
    width: fit-content;
}

.photo-rating[b-y23qwzd4jp] {
    margin-top: 3px;
}

.photo-rating i[b-y23qwzd4jp] {
    font-size: 11px;
    color: #f57f17;
}

.photo-rating i.far[b-y23qwzd4jp] {
    color: #bdbdbd;
}

/* === Details Panel === */
.details-panel .panel-content[b-y23qwzd4jp] {
    padding: 16px;
}

.match-preview[b-y23qwzd4jp], .current-match[b-y23qwzd4jp] {
    margin-bottom: 20px;
}

.match-item[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 10px;
}

.match-item label[b-y23qwzd4jp] {
    font-size: 11px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
}

.match-item span[b-y23qwzd4jp] {
    font-size: 13px;
    color: #333;
}

.attribute-preview h4[b-y23qwzd4jp], .current-match h4[b-y23qwzd4jp] {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin: 0 0 10px;
}

.attribute-list[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 6px;
    background: #fafafa;
    border-radius: 4px;
    padding: 10px;
    border: 1px solid #e0e0e0;
}

.attribute-item[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.attr-name[b-y23qwzd4jp] {
    font-size: 10px;
    font-weight: 600;
    color: #1976d2;
    font-family: monospace;
}

.attr-value[b-y23qwzd4jp] {
    font-size: 12px;
    color: #333;
}

.match-actions[b-y23qwzd4jp] {
    margin-top: 16px;
}

.match-actions .btn-action[b-y23qwzd4jp] {
    width: 100%;
    justify-content: center;
}

.empty-selection[b-y23qwzd4jp] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 40px 16px;
    text-align: center;
    color: #666;
}

.empty-selection i[b-y23qwzd4jp] {
    font-size: 28px;
    color: #bdbdbd;
}

.empty-selection p[b-y23qwzd4jp] {
    margin: 0;
    font-size: 13px;
}

.status-message[b-y23qwzd4jp] {
    margin-top: 14px;
    padding: 10px;
    border-radius: 4px;
    font-size: 12px;
}

.status-message.success[b-y23qwzd4jp] {
    background: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}

.status-message.error[b-y23qwzd4jp] {
    background: #ffebee;
    color: #c62828;
    border: 1px solid #ef9a9a;
}

/* === Selected Photos Preview === */
.selected-photos-list[b-y23qwzd4jp] {
    margin-bottom: 16px;
}

.selected-photos-list h4[b-y23qwzd4jp] {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin: 0 0 8px;
}

.selected-photo-preview[b-y23qwzd4jp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    background: #f5f5f5;
    border-radius: 4px;
    margin-bottom: 6px;
}

.selected-photo-preview img[b-y23qwzd4jp] {
    width: 50px;
    height: 50px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.photo-preview-info[b-y23qwzd4jp] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.photo-preview-name[b-y23qwzd4jp] {
    font-size: 12px;
    font-weight: 500;
    color: #333;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.photo-preview-file[b-y23qwzd4jp] {
    font-size: 10px;
    color: #666;
    font-family: monospace;
}

.btn-remove-photo[b-y23qwzd4jp] {
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    background: transparent;
    color: #999;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
}

.btn-remove-photo:hover[b-y23qwzd4jp] {
    background: #ffebee;
    color: #c62828;
}

/* === Matched Photos Display === */
.matched-photo-item[b-y23qwzd4jp] {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    background: #f5f5f5;
    border-radius: 4px;
    margin-bottom: 6px;
}

.matched-photo-item img[b-y23qwzd4jp] {
    width: 60px;
    height: 60px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.matched-photo-item span[b-y23qwzd4jp] {
    font-size: 11px;
    color: #666;
    font-family: monospace;
}

/* === Responsive === */
@media (max-width: 1200px) {
    .three-panel-layout[b-y23qwzd4jp] {
        grid-template-columns: 260px 1fr 300px;
    }
}

@media (max-width: 1000px) {
    .three-panel-layout[b-y23qwzd4jp] {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: auto auto;
    }

    .details-panel[b-y23qwzd4jp] {
        grid-column: span 2;
    }
}
/* /Pages/QueuePage.razor.rz.scp.css */
.ViewPort[b-tdk4ftpy3d] {
    padding: 1rem;
    display: flex;
    justify-content: center;
    position: absolute;
    width: 100%;
    padding-bottom: 100px;
    padding-bottom: 5px;
}

/*Both*/
/*.CardBottomMargin {
    padding-bottom: 5px;
    vertical-align: top;
}*/

/*Both*/
/*.Frontier-Queue {*/
    /*background-color: #92CDFA;*/
    /*padding: 0 0.2em;
    font-size: 3em;
}

.WaitingMinutesDropddown {
    background-color: #cccccc;
    position: fixed;
    right: 120px;
    top: 10px;
    z-index: 101;
    width: 150px;
}*/
/* /Pages/Sales.razor.rz.scp.css */
/* === Base Container === */
.sales-container[b-y5ldbzogkf] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.sales-content[b-y5ldbzogkf] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* === Page Header === */
.page-header[b-y5ldbzogkf] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.page-header-left h1[b-y5ldbzogkf] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-y5ldbzogkf] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.page-header-right[b-y5ldbzogkf] {
    display: flex;
    gap: 8px;
}

/* === Sales Total Badge === */
.sales-total-badge[b-y5ldbzogkf] {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
}

.sales-total-badge .label[b-y5ldbzogkf] {
    font-size: 11px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.sales-total-badge .amount[b-y5ldbzogkf] {
    font-size: 18px;
    font-weight: 600;
    color: #1976d2;
}

/* === Orders Grid === */
.orders-grid-wrapper[b-y5ldbzogkf] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

/* === Responsive === */
@media (max-width: 768px) {
    .sales-container[b-y5ldbzogkf] {
        margin-left: 0;
    }

    .sales-content[b-y5ldbzogkf] {
        padding: 16px;
    }

    .page-header[b-y5ldbzogkf] {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }

    .page-header-right[b-y5ldbzogkf] {
        width: 100%;
    }

    .sales-total-badge[b-y5ldbzogkf] {
        width: 100%;
        align-items: center;
    }
}
/* /Pages/SocialMedia.razor.rz.scp.css */
/* === Base Container === */
.social-media-container[b-9v2gc3p6av] {
    background-color: #f5f5f5;
    min-height: 100vh;
    margin-left: 72px;
}

.social-media-content[b-9v2gc3p6av] {
    max-width: 1400px;
    margin: 0 auto;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

/* === Page Header === */
.page-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
}

.page-header-left h1[b-9v2gc3p6av] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.page-header-left p[b-9v2gc3p6av] {
    font-size: 13px;
    color: #666;
    margin: 0;
}

.connections-btn[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    color: #333;
    cursor: pointer;
    transition: all 0.2s;
}

.connections-btn:hover[b-9v2gc3p6av] {
    border-color: #1976d2;
    color: #1976d2;
}

.connections-btn i[b-9v2gc3p6av] {
    color: #1976d2;
}

.connection-count[b-9v2gc3p6av] {
    background: #1976d2;
    color: #fff;
    font-size: 11px;
    padding: 2px 6px;
    border-radius: 10px;
    font-weight: 600;
}

/* === Connections Modal === */
.connections-modal[b-9v2gc3p6av] {
    max-width: 520px;
}

.connections-modal-list[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.connection-row[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 16px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
}

.connection-row-left[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.connection-row-right[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.connection-icon.tiktok[b-9v2gc3p6av] {
    color: #000;
}

.btn-connect[b-9v2gc3p6av] {
    padding: 6px 12px;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    color: #fff;
    transition: all 0.2s;
}

.btn-connect.facebook[b-9v2gc3p6av] {
    background: #4267B2;
}

.btn-connect.facebook:hover[b-9v2gc3p6av] {
    background: #365899;
}

.btn-connect.instagram[b-9v2gc3p6av] {
    background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D);
}

.btn-connect.instagram:hover[b-9v2gc3p6av] {
    opacity: 0.9;
}

.btn-disabled[b-9v2gc3p6av] {
    padding: 6px 12px;
    background: #e0e0e0;
    border: none;
    border-radius: 4px;
    font-size: 12px;
    color: #999;
    cursor: not-allowed;
}

.connection-hint-text[b-9v2gc3p6av] {
    font-size: 11px;
    color: #666;
}

.connection-hint-text i[b-9v2gc3p6av] {
    color: #f57f17;
    margin-right: 4px;
}

/* === Card Styles (Bootstrap/Material pattern) === */
.sm-card[b-9v2gc3p6av] {
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
}

.create-post-card[b-9v2gc3p6av] {
    border-top: 3px solid #1976d2;
}

.timeline-card[b-9v2gc3p6av] {
    border-top: 3px solid #666;
}

/* === Timeline Feed === */
.timeline-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid #e0e0e0;
}

.timeline-header-left h2[b-9v2gc3p6av] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.timeline-header-left p[b-9v2gc3p6av] {
    font-size: 12px;
    color: #666;
    margin: 0;
}

.timeline-header-right[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 8px;
}

.sync-btn[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    color: #333;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s;
}

.sync-btn:hover:not(:disabled)[b-9v2gc3p6av] {
    background: #f5f5f5;
    border-color: #1976d2;
    color: #1976d2;
}

.sync-btn:disabled[b-9v2gc3p6av] {
    opacity: 0.6;
    cursor: not-allowed;
}

.sync-btn i[b-9v2gc3p6av] {
    font-size: 12px;
}

.filter-select[b-9v2gc3p6av] {
    padding: 6px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    color: #333;
    background: #fff;
    cursor: pointer;
}

.filter-select:focus[b-9v2gc3p6av] {
    outline: none;
    border-color: #1976d2;
}

.timeline-feed[b-9v2gc3p6av] {
    padding: 0;
}

.timeline-empty[b-9v2gc3p6av] {
    text-align: center;
    padding: 48px 20px;
    color: #666;
}

.timeline-empty i[b-9v2gc3p6av] {
    font-size: 40px;
    color: #ccc;
    margin-bottom: 12px;
}

.timeline-empty p[b-9v2gc3p6av] {
    font-size: 14px;
    margin: 0;
}

/* === Feed Item === */
.feed-item[b-9v2gc3p6av] {
    padding: 16px;
    border-bottom: 1px solid #e0e0e0;
    transition: background 0.2s;
}

.feed-item:last-child[b-9v2gc3p6av] {
    border-bottom: none;
}

.feed-item:hover[b-9v2gc3p6av] {
    background: #fafafa;
}

.feed-item-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
}

.feed-status[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.status-badge[b-9v2gc3p6av] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.status-badge.scheduled[b-9v2gc3p6av] {
    background: #e3f2fd;
    color: #1565c0;
}

.status-badge.pending[b-9v2gc3p6av] {
    background: #fff8e1;
    color: #f57f17;
}

.status-badge.published[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
}

.status-badge.failed[b-9v2gc3p6av] {
    background: #ffebee;
    color: #c62828;
}

.status-badge.external[b-9v2gc3p6av] {
    background: #f3e5f5;
    color: #7b1fa2;
}

.post-type-badge[b-9v2gc3p6av] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 11px;
    font-weight: 500;
}

.post-type-badge.story[b-9v2gc3p6av] {
    background: #e3f2fd;
    color: #1565c0;
}

.post-type-badge.reel[b-9v2gc3p6av] {
    background: #fff3e0;
    color: #e65100;
}

.post-type-badge.feed[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
}

.feed-time[b-9v2gc3p6av] {
    font-size: 12px;
    color: #666;
}

.feed-platforms[b-9v2gc3p6av] {
    display: flex;
    gap: 8px;
}

.platform-icon[b-9v2gc3p6av] {
    font-size: 18px;
}

.platform-icon.facebook[b-9v2gc3p6av] {
    color: #4267B2;
}

.platform-icon.instagram[b-9v2gc3p6av] {
    color: #E4405F;
}

/* === Feed Content === */
.feed-item-content[b-9v2gc3p6av] {
    display: flex;
    gap: 14px;
    margin-bottom: 12px;
}

.feed-thumbnail[b-9v2gc3p6av] {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
    flex-shrink: 0;
}

.feed-thumbnail-placeholder[b-9v2gc3p6av] {
    width: 80px;
    height: 80px;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
    flex-shrink: 0;
    background: #f5f5f5;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #bbb;
    font-size: 24px;
}

.feed-text[b-9v2gc3p6av] {
    flex: 1;
    min-width: 0;
}

.feed-caption[b-9v2gc3p6av] {
    font-size: 14px;
    color: #333;
    line-height: 1.4;
    margin-bottom: 6px;
}

.feed-hashtags[b-9v2gc3p6av] {
    font-size: 12px;
    color: #1976d2;
    margin-bottom: 6px;
}

.feed-engagement[b-9v2gc3p6av] {
    display: flex;
    gap: 14px;
    font-size: 12px;
    color: #666;
}

.feed-engagement span[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.feed-engagement .engagement-rate[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
    padding: 2px 6px;
    border-radius: 4px;
    font-weight: 500;
}

/* === Feed Actions === */
.feed-item-actions[b-9v2gc3p6av] {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

.btn-sm.btn-primary[b-9v2gc3p6av] {
    background: #1976d2;
    color: #fff;
    border: none;
}

/* === Suggestion Card Styles === */
.post-suggestion-card[b-9v2gc3p6av] {
    padding: 16px;
}

.suggestion-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #e0e0e0;
}

.suggestion-reason[b-9v2gc3p6av] {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.suggestion-detail[b-9v2gc3p6av] {
    display: block;
    font-size: 12px;
    color: #666;
}

.suggestion-content[b-9v2gc3p6av] {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 16px;
    margin-bottom: 12px;
}

.suggestion-image[b-9v2gc3p6av] {
    width: 100%;
    aspect-ratio: 9/16;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.suggestion-text[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.suggestion-caption[b-9v2gc3p6av] {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
}

.suggestion-hashtags[b-9v2gc3p6av] {
    font-size: 13px;
    color: #1976d2;
    font-weight: 500;
}

.suggestion-actions[b-9v2gc3p6av] {
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding-top: 12px;
    border-top: 1px solid #e0e0e0;
}

/* === Buttons (Bootstrap-style) === */
.btn-primary[b-9v2gc3p6av], .btn-secondary[b-9v2gc3p6av] {
    padding: 8px 20px;
    border-radius: 4px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.2s, box-shadow 0.2s;
    border: none;
    font-size: 13px;
}

.btn-primary[b-9v2gc3p6av] {
    background: #1976d2;
    color: #fff;
}

.btn-primary:hover[b-9v2gc3p6av] {
    background: #1565c0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-secondary[b-9v2gc3p6av] {
    background: #f5f5f5;
    color: #666;
    border: 1px solid #e0e0e0;
}

.btn-secondary:hover[b-9v2gc3p6av] {
    background: #e0e0e0;
    color: #d32f2f;
}

/* === Empty State === */
.empty-state[b-9v2gc3p6av] {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

.empty-state i[b-9v2gc3p6av] {
    font-size: 48px;
    color: #1976d2;
    margin-bottom: 16px;
}

.empty-state h2[b-9v2gc3p6av] {
    font-size: 18px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

/* === Confidence Badge === */
.confidence-badge[b-9v2gc3p6av] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    background: #f5f5f5;
    color: #666;
}

.confidence-high[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
}

.confidence-medium[b-9v2gc3p6av] {
    background: #fff8e1;
    color: #f57f17;
}

.confidence-low[b-9v2gc3p6av] {
    background: #ffebee;
    color: #c62828;
}

/* === Learning Loop === */
.learning-loop-container[b-9v2gc3p6av] {
    padding: 16px;
}

.learning-loop-header[b-9v2gc3p6av] {
    margin-bottom: 16px;
}

.learning-loop-header h2[b-9v2gc3p6av] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.learning-loop-header p[b-9v2gc3p6av] {
    font-size: 13px;
    color: #666;
}

.performance-table[b-9v2gc3p6av] {
    width: 100%;
    border-collapse: collapse;
}

.performance-table thead[b-9v2gc3p6av] {
    background: #f5f5f5;
    border-bottom: 2px solid #e0e0e0;
}

.performance-table th[b-9v2gc3p6av] {
    padding: 10px 12px;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.performance-table tbody tr[b-9v2gc3p6av] {
    border-bottom: 1px solid #e0e0e0;
}

.performance-table tbody tr:hover[b-9v2gc3p6av] {
    background: #fafafa;
}

.performance-table td[b-9v2gc3p6av] {
    padding: 12px;
    color: #333;
    font-size: 13px;
}

.post-cell[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.post-cell img[b-9v2gc3p6av] {
    width: 56px;
    height: 56px;
    border-radius: 4px;
    object-fit: cover;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
}

.post-caption[b-9v2gc3p6av] {
    font-weight: 500;
    color: #333;
    margin-bottom: 2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 300px;
}

.post-platform[b-9v2gc3p6av] {
    font-size: 12px;
    color: #666;
}

.engagement-badge[b-9v2gc3p6av] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
}

.engagement-high[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
}

.engagement-medium[b-9v2gc3p6av] {
    background: #fff8e1;
    color: #f57f17;
}

.engagement-low[b-9v2gc3p6av] {
    background: #ffebee;
    color: #c62828;
}

[b-9v2gc3p6av] .recycle-btn {
    border-color: #1976d2 !important;
    color: #1976d2 !important;
}

[b-9v2gc3p6av] .recycle-btn:hover {
    background: #e3f2fd !important;
}

/* === Loading State === */
.loading-state[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 300px;
    padding: 40px 20px;
}

.loading-content[b-9v2gc3p6av] {
    text-align: center;
    max-width: 400px;
}

.loading-spinner[b-9v2gc3p6av] {
    font-size: 48px;
    color: #1976d2;
    margin-bottom: 20px;
}

.loading-spinner i[b-9v2gc3p6av] {
    animation: spin-b-9v2gc3p6av 1s linear infinite;
}

@keyframes spin-b-9v2gc3p6av {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.loading-content h2[b-9v2gc3p6av] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
}

.loading-step[b-9v2gc3p6av] {
    font-size: 13px;
    color: #1976d2;
    font-weight: 500;
    margin-bottom: 16px;
    min-height: 20px;
}

.progress-bar-container[b-9v2gc3p6av] {
    width: 100%;
    height: 6px;
    background: #e0e0e0;
    border-radius: 3px;
    overflow: hidden;
    margin-bottom: 12px;
}

.progress-bar[b-9v2gc3p6av] {
    height: 100%;
    background: #1976d2;
    border-radius: 3px;
    transition: width 0.4s ease;
}

.loading-hint[b-9v2gc3p6av] {
    font-size: 12px;
    color: #999;
    margin-top: 8px;
}

/* === Intent Input Screen === */
.intent-input-container[b-9v2gc3p6av] {
    padding: 24px;
    text-align: center;
}

.intent-input-container h2[b-9v2gc3p6av] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}

.intent-input-container > p[b-9v2gc3p6av] {
    font-size: 13px;
    color: #666;
    margin-bottom: 16px;
}

[b-9v2gc3p6av] .intent-textarea {
    width: 100%;
    margin-bottom: 16px;
}

[b-9v2gc3p6av] .intent-textarea textarea {
    font-size: 14px;
    min-height: 80px;
}

.intent-suggestions[b-9v2gc3p6av] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
    align-items: center;
    justify-content: center;
}

.suggestion-label[b-9v2gc3p6av] {
    font-size: 13px;
    color: #666;
    margin-right: 8px;
}

.suggestion-chip[b-9v2gc3p6av] {
    padding: 6px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 16px;
    cursor: pointer;
    font-size: 13px;
    color: #666;
    transition: all 0.2s;
}

.suggestion-chip:hover[b-9v2gc3p6av] {
    background: #e3f2fd;
    border-color: #1976d2;
    color: #1976d2;
}

/* === AI Ideas Grid - Dynamic === */
.ideas-container[b-9v2gc3p6av] {
    padding: 24px;
}

.ideas-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    width: 100%;
}

.ideas-title[b-9v2gc3p6av] {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0;
    flex: 1;
}

.refresh-ideas-btn[b-9v2gc3p6av] {
    padding: 8px 12px;
    min-width: 40px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    color: #666;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s;
    flex-shrink: 0;
}

.refresh-ideas-btn:hover:not(:disabled)[b-9v2gc3p6av] {
    border-color: #1976d2;
    color: #1976d2;
    background: #e3f2fd;
}

.refresh-ideas-btn:disabled[b-9v2gc3p6av] {
    opacity: 0.6;
    cursor: not-allowed;
}

[b-9v2gc3p6av] .ideas-title-btn {
    width: 100% !important;
    margin-bottom: 20px !important;
    padding: 10px 20px !important;
    font-size: 14px !important;
}

[b-9v2gc3p6av] .ideas-title-btn .spinner-border-sm {
    width: 14px;
    height: 14px;
    border-width: 2px;
}

.ideas-loading[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 24px;
    color: #666;
}

.ideas-loading .spinner-border[b-9v2gc3p6av] {
    width: 32px;
    height: 32px;
    border: 3px solid #e0e0e0;
    border-top-color: #1976d2;
    border-radius: 50%;
    animation: spin-b-9v2gc3p6av 1s linear infinite;
    margin-bottom: 16px;
}

.ideas-loading p[b-9v2gc3p6av] {
    font-size: 14px;
    margin: 0;
    color: #666;
}

.ideas-grid[b-9v2gc3p6av] {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 24px;
}

.idea-card[b-9v2gc3p6av] {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 20px 16px;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.idea-card:hover[b-9v2gc3p6av] {
    border-color: #1976d2;
    box-shadow: 0 4px 16px rgba(25, 118, 210, 0.15);
    transform: translateY(-2px);
}

.idea-icon[b-9v2gc3p6av] {
    font-size: 32px;
    margin-bottom: 4px;
}

.idea-title[b-9v2gc3p6av] {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.idea-description[b-9v2gc3p6av] {
    font-size: 12px;
    color: #666;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.idea-timing[b-9v2gc3p6av] {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
    margin-top: 4px;
}

.idea-timing.timing-now[b-9v2gc3p6av] {
    background: #e8f5e9;
    color: #2e7d32;
}

.idea-timing.timing-scheduled[b-9v2gc3p6av] {
    background: #e3f2fd;
    color: #1565c0;
}

.no-ideas[b-9v2gc3p6av] {
    padding: 40px 24px;
    color: #666;
    font-size: 13px;
    text-align: center;
}

.no-ideas.error[b-9v2gc3p6av] {
    color: #c62828;
    background: #ffebee;
    border-radius: 8px;
    margin: 0 0 20px 0;
}

.no-ideas.error p[b-9v2gc3p6av] {
    margin-bottom: 12px;
}

.no-ideas a[b-9v2gc3p6av] {
    color: #1976d2;
    text-decoration: none;
}

.no-ideas a:hover[b-9v2gc3p6av] {
    text-decoration: underline;
}

/* Accordion for custom input */
.custom-idea-accordion[b-9v2gc3p6av] {
    border-top: 1px solid #e0e0e0;
    padding-top: 16px;
    margin-top: 8px;
}

.accordion-toggle[b-9v2gc3p6av] {
    background: none;
    border: none;
    color: #666;
    font-size: 13px;
    cursor: pointer;
    padding: 8px 16px;
    width: 100%;
    text-align: center;
}

.accordion-toggle:hover[b-9v2gc3p6av] {
    color: #1976d2;
}

.custom-idea-content[b-9v2gc3p6av] {
    margin-top: 16px;
    padding: 0 16px;
    animation: slideDown-b-9v2gc3p6av 0.2s ease;
}

@keyframes slideDown-b-9v2gc3p6av {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

[b-9v2gc3p6av] .custom-idea-textarea {
    width: 100%;
    margin-bottom: 12px;
}

[b-9v2gc3p6av] .custom-idea-textarea textarea {
    font-size: 14px;
    min-height: 60px;
}

[b-9v2gc3p6av] .generate-btn {
    margin-top: 12px !important;
}

/* === Connection Management === */
.connections-card[b-9v2gc3p6av] {
    border-top: 3px solid #4267B2;
    padding: 16px;
}

.connections-header[b-9v2gc3p6av] {
    margin-bottom: 16px;
}

.connections-header h3[b-9v2gc3p6av] {
    font-size: 14px;
    font-weight: 600;
    color: #333;
    margin: 0;
}

.connections-list[b-9v2gc3p6av] {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
}

.loading-connections[b-9v2gc3p6av] {
    color: #666;
    font-size: 13px;
    padding: 8px 0;
}

.connection-item[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    min-width: 280px;
}

.connection-info[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 10px;
}

.connection-icon[b-9v2gc3p6av] {
    font-size: 24px;
}

.connection-icon.facebook[b-9v2gc3p6av] {
    color: #4267B2;
}

.connection-icon.instagram[b-9v2gc3p6av] {
    color: #E4405F;
}

.connection-details[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
}

.connection-name[b-9v2gc3p6av] {
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.connection-status[b-9v2gc3p6av] {
    font-size: 11px;
}

.connection-status.active[b-9v2gc3p6av] {
    color: #2e7d32;
}

.connection-status.pending[b-9v2gc3p6av] {
    color: #f57f17;
}

.connection-actions[b-9v2gc3p6av] {
    display: flex;
    gap: 6px;
}

.btn-sm[b-9v2gc3p6av] {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.btn-outline[b-9v2gc3p6av] {
    background: transparent;
    border: 1px solid #1976d2;
    color: #1976d2;
}

.btn-outline:hover[b-9v2gc3p6av] {
    background: #e3f2fd;
}

.btn-danger-outline[b-9v2gc3p6av] {
    background: transparent;
    border: 1px solid #d32f2f;
    color: #d32f2f;
}

.btn-danger-outline:hover[b-9v2gc3p6av] {
    background: #ffebee;
}

.connect-btn[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    border-radius: 6px;
    border: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s;
    color: #fff;
}

.connect-btn.facebook[b-9v2gc3p6av] {
    background: #4267B2;
}

.connect-btn.facebook:hover[b-9v2gc3p6av] {
    background: #365899;
}

.connect-btn.instagram[b-9v2gc3p6av] {
    background: linear-gradient(45deg, #405DE6, #5851DB, #833AB4, #C13584, #E1306C, #FD1D1D);
}

.connect-btn.instagram:hover[b-9v2gc3p6av] {
    opacity: 0.9;
}

.connection-hint[b-9v2gc3p6av] {
    font-size: 12px;
    color: #666;
    padding: 8px 12px;
    background: #fff8e1;
    border-radius: 4px;
}

.connection-hint i[b-9v2gc3p6av] {
    color: #f57f17;
    margin-right: 6px;
}

/* === Page Selection Modal === */
.modal-overlay[b-9v2gc3p6av] {
    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: 1000;
}

.modal-content[b-9v2gc3p6av] {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
    max-width: 480px;
    width: 90%;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
}

.modal-header[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid #e0e0e0;
}

.modal-header h3[b-9v2gc3p6av] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.modal-close[b-9v2gc3p6av] {
    background: none;
    border: none;
    font-size: 18px;
    color: #666;
    cursor: pointer;
    padding: 4px;
}

.modal-close:hover[b-9v2gc3p6av] {
    color: #333;
}

.modal-body[b-9v2gc3p6av] {
    padding: 16px 20px;
    overflow-y: auto;
    flex: 1;
}

.modal-footer[b-9v2gc3p6av] {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 16px 20px;
    border-top: 1px solid #e0e0e0;
}

.loading-pages[b-9v2gc3p6av], .no-pages[b-9v2gc3p6av] {
    text-align: center;
    padding: 32px;
    color: #666;
}

.no-pages i[b-9v2gc3p6av] {
    font-size: 36px;
    color: #f57f17;
    margin-bottom: 12px;
}

.pages-list[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.page-item[b-9v2gc3p6av] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border: 2px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    transition: all 0.2s;
}

.page-item:hover[b-9v2gc3p6av] {
    border-color: #1976d2;
    background: #f8f9fa;
}

.page-item.selected[b-9v2gc3p6av] {
    border-color: #1976d2;
    background: #e3f2fd;
}

.page-info[b-9v2gc3p6av] {
    display: flex;
    align-items: center;
    gap: 12px;
}

.page-icon[b-9v2gc3p6av] {
    font-size: 28px;
    color: #4267B2;
}

.page-details[b-9v2gc3p6av] {
    display: flex;
    flex-direction: column;
}

.page-name[b-9v2gc3p6av] {
    font-size: 14px;
    font-weight: 500;
    color: #333;
}

.page-instagram[b-9v2gc3p6av] {
    font-size: 12px;
    color: #E4405F;
    margin-top: 2px;
}

.selected-icon[b-9v2gc3p6av] {
    font-size: 20px;
    color: #1976d2;
}

/* === Responsive Design === */
@media (max-width: 1024px) {
    .social-media-content[b-9v2gc3p6av] {
        max-width: 100%;
        padding: 20px 16px;
    }

    .suggestion-content[b-9v2gc3p6av] {
        grid-template-columns: 220px 1fr;
    }
}

@media (max-width: 768px) {
    .social-media-container[b-9v2gc3p6av] {
        margin-left: 0;
    }

    .social-media-content[b-9v2gc3p6av] {
        padding: 16px 12px;
        gap: 16px;
    }

    .suggestion-content[b-9v2gc3p6av] {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .suggestion-image[b-9v2gc3p6av] {
        max-width: 100%;
        aspect-ratio: 16/9;
    }

    .suggestion-actions[b-9v2gc3p6av] {
        flex-direction: column;
    }

    .btn-primary[b-9v2gc3p6av], .btn-secondary[b-9v2gc3p6av] {
        width: 100%;
    }

    .intent-input-container[b-9v2gc3p6av] {
        padding: 24px 16px;
        margin: 20px auto;
    }

    .learning-loop-container[b-9v2gc3p6av] {
        padding: 12px;
    }

    .post-suggestion-card[b-9v2gc3p6av] {
        padding: 12px;
    }

    .post-caption[b-9v2gc3p6av] {
        max-width: 180px;
    }
}

@media (max-width: 480px) {
    .social-media-content[b-9v2gc3p6av] {
        padding: 12px 8px;
        gap: 12px;
    }

    .intent-input-container h2[b-9v2gc3p6av] {
        font-size: 18px;
    }

    .suggestion-reason[b-9v2gc3p6av] {
        font-size: 13px;
    }

    .btn-primary[b-9v2gc3p6av], .btn-secondary[b-9v2gc3p6av] {
        padding: 10px 16px;
        font-size: 13px;
    }

    .post-cell img[b-9v2gc3p6av] {
        width: 48px;
        height: 48px;
    }
}
/* /Shared/Components/AI/AIConversationContainer.razor.rz.scp.css */
.ai-conversation-container[b-bebr54lolo] {
    min-height: 400px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: linear-gradient(180deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 16px;
    position: relative;
}

.connecting-state[b-bebr54lolo],
.empty-state[b-bebr54lolo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
    color: #666;
}

.connecting-state .e-icons[b-bebr54lolo],
.empty-state .e-icons[b-bebr54lolo] {
    font-size: 3rem;
    color: #999;
}

.spinner[b-bebr54lolo] {
    width: 40px;
    height: 40px;
    border: 4px solid #e0e0e0;
    border-top-color: #667eea;
    border-radius: 50%;
    animation: spin-b-bebr54lolo 1s linear infinite;
}

@keyframes spin-b-bebr54lolo {
    to {
        transform: rotate(360deg);
    }
}

.instruction-message[b-bebr54lolo] {
    font-size: 1.2rem;
    color: #333;
    text-align: center;
    margin-bottom: 1.5rem;
    padding: 1rem;
    background: white;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.ai-component-wrapper[b-bebr54lolo] {
    width: 100%;
    max-width: 600px;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.placeholder-component[b-bebr54lolo] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 3rem;
    background: white;
    border-radius: 12px;
    border: 2px dashed #ddd;
    color: #999;
    margin-bottom: 1rem;
    width: 100%;
}

.placeholder-component .e-icons[b-bebr54lolo] {
    font-size: 2.5rem;
}

.error-toast[b-bebr54lolo] {
    position: absolute;
    bottom: 1rem;
    left: 50%;
    transform: translateX(-50%);
    background: #ff4444;
    color: white;
    padding: 0.75rem 1.5rem;
    border-radius: 8px;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    box-shadow: 0 4px 12px rgba(255, 68, 68, 0.3);
    animation: slideUp-b-bebr54lolo 0.3s ease-out;
}

@keyframes slideUp-b-bebr54lolo {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}
/* /Shared/Components/AI/AIFeedbackDialog.razor.rz.scp.css */
/* Dialog Header */
.dialog-header[b-p7b5sc79ty] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.dialog-header i[b-p7b5sc79ty] {
    color: #1976d2;
}

/* Intro text */
.feedback-intro[b-p7b5sc79ty] {
    padding: 12px 0 16px;
    color: #666;
    font-size: 13px;
    border-bottom: 1px solid #eee;
    margin-bottom: 16px;
}

/* Feedback Section */
.feedback-section[b-p7b5sc79ty] {
    margin-bottom: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #f0f0f0;
}

.feedback-section:last-of-type[b-p7b5sc79ty] {
    border-bottom: none;
    margin-bottom: 8px;
}

.section-header[b-p7b5sc79ty] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.section-icon[b-p7b5sc79ty] {
    font-size: 16px;
}

.section-title[b-p7b5sc79ty] {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.provider-badge[b-p7b5sc79ty] {
    margin-left: auto;
    padding: 2px 8px;
    background: #e3f2fd;
    color: #1976d2;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
}

.provider-badge.nano[b-p7b5sc79ty] {
    background: #fff3e0;
    color: #e65100;
}

/* Content Preview */
.content-preview[b-p7b5sc79ty] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 10px 12px;
    margin-bottom: 10px;
    font-size: 13px;
    color: #495057;
    max-height: 80px;
    overflow-y: auto;
    line-height: 1.5;
}

.hashtags-preview[b-p7b5sc79ty] {
    color: #1976d2;
    font-size: 12px;
}

.overlay-preview[b-p7b5sc79ty] {
    font-style: italic;
}

.overlay-text[b-p7b5sc79ty] {
    color: #333;
}

.no-content[b-p7b5sc79ty] {
    color: #999;
    font-style: italic;
}

/* Image Preview */
.image-preview-container[b-p7b5sc79ty] {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-bottom: 10px;
    padding: 10px;
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
}

.preview-thumbnail[b-p7b5sc79ty] {
    width: 80px;
    height: 80px;
    object-fit: cover;
    border-radius: 6px;
    flex-shrink: 0;
}

.image-prompt-preview[b-p7b5sc79ty] {
    flex: 1;
    min-width: 0;
}

.prompt-label[b-p7b5sc79ty] {
    display: block;
    font-size: 11px;
    color: #888;
    font-weight: 500;
    margin-bottom: 4px;
}

.prompt-text[b-p7b5sc79ty] {
    font-size: 12px;
    color: #666;
    line-height: 1.4;
    display: block;
}

.no-image[b-p7b5sc79ty] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    color: #999;
    width: 100%;
}

.no-image i[b-p7b5sc79ty] {
    font-size: 24px;
    margin-bottom: 8px;
}

.no-image span[b-p7b5sc79ty] {
    font-size: 12px;
    font-style: italic;
}

/* Feedback Textarea */
.feedback-textarea[b-p7b5sc79ty] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    resize: vertical;
    min-height: 50px;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.feedback-textarea:focus[b-p7b5sc79ty] {
    outline: none;
    border-color: #1976d2;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.15);
}

.feedback-textarea[b-p7b5sc79ty]::placeholder {
    color: #aaa;
}

/* Character Count */
.char-count[b-p7b5sc79ty] {
    text-align: right;
    font-size: 11px;
    color: #999;
    margin-top: 4px;
}

/* Error Message */
.error-message[b-p7b5sc79ty] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #ffebee;
    border: 1px solid #ffcdd2;
    border-radius: 6px;
    color: #c62828;
    font-size: 13px;
    margin-top: 16px;
}

.error-message i[b-p7b5sc79ty] {
    flex-shrink: 0;
}

/* Dialog overrides */
[b-p7b5sc79ty] .ai-feedback-dialog .e-dlg-content {
    padding: 16px 20px;
    max-height: 70vh;
    overflow-y: auto;
}

[b-p7b5sc79ty] .ai-feedback-dialog .e-footer-content {
    padding: 12px 20px;
    border-top: 1px solid #eee;
}

[b-p7b5sc79ty] .ai-feedback-dialog .e-btn.e-success {
    background: #1976d2;
    border-color: #1976d2;
}

[b-p7b5sc79ty] .ai-feedback-dialog .e-btn.e-success:hover {
    background: #1565c0;
    border-color: #1565c0;
}

[b-p7b5sc79ty] .ai-feedback-dialog .e-btn.e-success:disabled {
    background: #ccc;
    border-color: #ccc;
}
/* /Shared/Components/AI/AIFeedbackInline.razor.rz.scp.css */
/* ==================== TOOLBAR MODE ==================== */

.feedback-toolbar-wrapper[b-4k7tddsrea] {
    position: relative;
}


.feedback-popover[b-4k7tddsrea] {
    position: absolute;
    top: 100%;
    right: 0;
    margin-top: 8px;
    width: 280px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    z-index: 100;
    overflow: hidden;
}

.feedback-popover-header[b-4k7tddsrea] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: #f8f9fa;
    border-bottom: 1px solid #e0e0e0;
    font-size: 13px;
    font-weight: 600;
    color: #333;
}

.feedback-popover .close-btn[b-4k7tddsrea] {
    background: transparent;
    border: none;
    font-size: 18px;
    color: #888;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.feedback-popover .close-btn:hover[b-4k7tddsrea] {
    color: #333;
}

.feedback-popover .feedback-textarea[b-4k7tddsrea] {
    width: 100%;
    padding: 10px 12px;
    border: none;
    border-bottom: 1px solid #eee;
    font-size: 13px;
    font-family: inherit;
    resize: none;
    min-height: 70px;
    box-sizing: border-box;
}

.feedback-popover .feedback-textarea:focus[b-4k7tddsrea] {
    outline: none;
    background: #fafafa;
}

.feedback-popover .feedback-textarea[b-4k7tddsrea]::placeholder {
    color: #999;
}

.feedback-popover .feedback-actions[b-4k7tddsrea] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    background: #fafafa;
}

.feedback-popover .char-count[b-4k7tddsrea] {
    font-size: 11px;
    color: #999;
}

.feedback-popover .submit-btn[b-4k7tddsrea] {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 14px;
    background: #1976d2;
    color: white;
    border: none;
    border-radius: 4px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s ease;
}

.feedback-popover .submit-btn:hover:not(:disabled)[b-4k7tddsrea] {
    background: #1565c0;
}

.feedback-popover .submit-btn:disabled[b-4k7tddsrea] {
    background: #ccc;
    cursor: not-allowed;
}

.feedback-success[b-4k7tddsrea] {
    background: #e8f5e9 !important;
    border-color: #c8e6c9 !important;
    color: #2e7d32 !important;
    cursor: default !important;
}

.feedback-success:hover[b-4k7tddsrea] {
    background: #e8f5e9 !important;
    border-color: #c8e6c9 !important;
    color: #2e7d32 !important;
}

/* ==================== INLINE MODE (Original) ==================== */

.ai-feedback-container[b-4k7tddsrea] {
    margin: 12px 0;
    font-family: inherit;
}

.ai-feedback-container.collapsed[b-4k7tddsrea] {
    margin: 8px 0;
}

/* Toggle button when collapsed */
.feedback-toggle-btn[b-4k7tddsrea] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    background: transparent;
    border: 1px dashed #888;
    border-radius: 4px;
    color: #666;
    font-size: 0.85rem;
    cursor: pointer;
    transition: all 0.2s ease;
}

.feedback-toggle-btn:hover[b-4k7tddsrea] {
    background: rgba(0, 0, 0, 0.05);
    border-color: #555;
    color: #333;
}

.feedback-icon[b-4k7tddsrea] {
    font-size: 1rem;
}

/* Expanded form */
.feedback-form[b-4k7tddsrea] {
    background: #f8f9fa;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 12px;
}

.feedback-header[b-4k7tddsrea] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
    font-size: 0.9rem;
    font-weight: 500;
    color: #333;
}

.close-btn[b-4k7tddsrea] {
    background: transparent;
    border: none;
    font-size: 1.25rem;
    color: #888;
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.close-btn:hover[b-4k7tddsrea] {
    color: #333;
}

.feedback-textarea[b-4k7tddsrea] {
    width: 100%;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 6px;
    font-size: 0.9rem;
    font-family: inherit;
    resize: vertical;
    min-height: 80px;
    box-sizing: border-box;
}

.feedback-textarea:focus[b-4k7tddsrea] {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.15);
}

.feedback-textarea[b-4k7tddsrea]::placeholder {
    color: #999;
}

.feedback-actions[b-4k7tddsrea] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 10px;
}

.char-count[b-4k7tddsrea] {
    font-size: 0.75rem;
    color: #888;
}

.submit-btn[b-4k7tddsrea] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    background: #007bff;
    color: white;
    border: none;
    border-radius: 6px;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.2s ease;
}

.submit-btn:hover:not(:disabled)[b-4k7tddsrea] {
    background: #0056b3;
}

.submit-btn:disabled[b-4k7tddsrea] {
    background: #ccc;
    cursor: not-allowed;
}

/* Small spinner for submit button */
.spinner-small[b-4k7tddsrea] {
    width: 14px;
    height: 14px;
    border: 2px solid rgba(255, 255, 255, 0.3);
    border-top-color: white;
    border-radius: 50%;
    animation: spin-b-4k7tddsrea 0.8s linear infinite;
}

@keyframes spin-b-4k7tddsrea {
    to {
        transform: rotate(360deg);
    }
}

/* Submitted state */
.feedback-submitted[b-4k7tddsrea] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    background: #d4edda;
    border: 1px solid #c3e6cb;
    border-radius: 6px;
    color: #155724;
    font-size: 0.9rem;
}

.success-icon[b-4k7tddsrea] {
    font-size: 1.1rem;
    font-weight: bold;
}
/* /Shared/Components/AI/AIIdeaFeedbackDialog.razor.rz.scp.css */
/* Dialog Header */
.dialog-header[b-pdn5ldq9y0] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.dialog-header i[b-pdn5ldq9y0] {
    color: #f9a825;
}

/* Intro text */
.feedback-intro[b-pdn5ldq9y0] {
    padding: 12px 0 16px;
    color: #666;
    font-size: 13px;
    border-bottom: 1px solid #eee;
    margin-bottom: 16px;
}

/* Feedback Section */
.feedback-section[b-pdn5ldq9y0] {
    margin-bottom: 16px;
}

.section-header[b-pdn5ldq9y0] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.section-icon[b-pdn5ldq9y0] {
    font-size: 16px;
}

.section-title[b-pdn5ldq9y0] {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.provider-badge[b-pdn5ldq9y0] {
    margin-left: auto;
    padding: 2px 8px;
    background: #e3f2fd;
    color: #1976d2;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 500;
}

/* Idea Preview */
.idea-preview[b-pdn5ldq9y0] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 12px;
    margin-bottom: 12px;
}

.idea-preview-row[b-pdn5ldq9y0] {
    display: flex;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 13px;
    line-height: 1.4;
}

.idea-preview-row:last-child[b-pdn5ldq9y0] {
    margin-bottom: 0;
}

.idea-label[b-pdn5ldq9y0] {
    color: #666;
    font-weight: 500;
    min-width: 85px;
    flex-shrink: 0;
}

.idea-value[b-pdn5ldq9y0] {
    color: #333;
}

.idea-type-badge[b-pdn5ldq9y0] {
    display: inline-block;
    font-size: 11px;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}

.idea-type-badge.feed[b-pdn5ldq9y0] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.idea-type-badge.story[b-pdn5ldq9y0] {
    background-color: #f3e5f5;
    color: #7b1fa2;
}

.idea-type-badge.reel[b-pdn5ldq9y0] {
    background-color: #fff3e0;
    color: #f57c00;
}

/* Feedback Textarea */
.feedback-textarea[b-pdn5ldq9y0] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    resize: vertical;
    min-height: 70px;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.feedback-textarea:focus[b-pdn5ldq9y0] {
    outline: none;
    border-color: #1976d2;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.15);
}

.feedback-textarea[b-pdn5ldq9y0]::placeholder {
    color: #aaa;
}

/* Character Count */
.char-count[b-pdn5ldq9y0] {
    text-align: right;
    font-size: 11px;
    color: #999;
    margin-top: 4px;
}

/* Error Message */
.error-message[b-pdn5ldq9y0] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #ffebee;
    border: 1px solid #ffcdd2;
    border-radius: 6px;
    color: #c62828;
    font-size: 13px;
    margin-top: 12px;
}

.error-message i[b-pdn5ldq9y0] {
    flex-shrink: 0;
}

/* Dialog overrides */
[b-pdn5ldq9y0] .ai-idea-feedback-dialog .e-dlg-content {
    padding: 16px 20px;
}

[b-pdn5ldq9y0] .ai-idea-feedback-dialog .e-footer-content {
    padding: 12px 20px;
    border-top: 1px solid #eee;
}

[b-pdn5ldq9y0] .ai-idea-feedback-dialog .e-btn.e-success {
    background: #1976d2;
    border-color: #1976d2;
}

[b-pdn5ldq9y0] .ai-idea-feedback-dialog .e-btn.e-success:hover {
    background: #1565c0;
    border-color: #1565c0;
}

[b-pdn5ldq9y0] .ai-idea-feedback-dialog .e-btn.e-success:disabled {
    background: #ccc;
    border-color: #ccc;
}
/* /Shared/Components/AI/AISessionFeedbackDialog.razor.rz.scp.css */
/* Dialog Header */
.dialog-header[b-db2w7ezt9a] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.dialog-header i[b-db2w7ezt9a] {
    color: #1976d2;
}

/* Intro text */
.feedback-intro[b-db2w7ezt9a] {
    padding: 12px 0 16px;
    color: #666;
    font-size: 13px;
    border-bottom: 1px solid #eee;
    margin-bottom: 16px;
}

/* Feedback Section */
.feedback-section[b-db2w7ezt9a] {
    margin-bottom: 16px;
}

.section-header[b-db2w7ezt9a] {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.section-icon[b-db2w7ezt9a] {
    font-size: 16px;
}

.section-title[b-db2w7ezt9a] {
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

/* Quick Select Chips */
.quick-chips[b-db2w7ezt9a] {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.quick-chip[b-db2w7ezt9a] {
    padding: 6px 12px;
    border: 1px solid #ddd;
    border-radius: 16px;
    background: #fff;
    font-size: 12px;
    color: #666;
    cursor: pointer;
    transition: all 0.2s;
}

.quick-chip:hover[b-db2w7ezt9a] {
    border-color: #1976d2;
    color: #1976d2;
    background: #f5f9ff;
}

.quick-chip.selected[b-db2w7ezt9a] {
    border-color: #1976d2;
    background: #e3f2fd;
    color: #1976d2;
    font-weight: 500;
}

/* Ideas Summary */
.ideas-summary[b-db2w7ezt9a] {
    background: #f8f9fa;
    border: 1px solid #e9ecef;
    border-radius: 6px;
    padding: 10px;
}

.idea-summary-item[b-db2w7ezt9a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 4px 0;
    font-size: 12px;
}

.idea-summary-item:not(:last-child)[b-db2w7ezt9a] {
    border-bottom: 1px solid #eee;
    padding-bottom: 6px;
    margin-bottom: 2px;
}

.idea-summary-title[b-db2w7ezt9a] {
    color: #333;
    flex: 1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.idea-type-badge[b-db2w7ezt9a] {
    display: inline-block;
    font-size: 10px;
    padding: 2px 6px;
    border-radius: 8px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.3px;
    flex-shrink: 0;
}

.idea-type-badge.feed[b-db2w7ezt9a] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.idea-type-badge.story[b-db2w7ezt9a] {
    background-color: #f3e5f5;
    color: #7b1fa2;
}

.idea-type-badge.reel[b-db2w7ezt9a] {
    background-color: #fff3e0;
    color: #f57c00;
}

/* Feedback Textarea */
.feedback-textarea[b-db2w7ezt9a] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    font-size: 13px;
    font-family: inherit;
    resize: vertical;
    min-height: 70px;
    box-sizing: border-box;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.feedback-textarea:focus[b-db2w7ezt9a] {
    outline: none;
    border-color: #1976d2;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.15);
}

.feedback-textarea[b-db2w7ezt9a]::placeholder {
    color: #aaa;
}

/* Character Count */
.char-count[b-db2w7ezt9a] {
    text-align: right;
    font-size: 11px;
    color: #999;
    margin-top: 4px;
}

/* Error Message */
.error-message[b-db2w7ezt9a] {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    background: #ffebee;
    border: 1px solid #ffcdd2;
    border-radius: 6px;
    color: #c62828;
    font-size: 13px;
    margin-top: 12px;
}

.error-message i[b-db2w7ezt9a] {
    flex-shrink: 0;
}

/* Dialog overrides */
[b-db2w7ezt9a] .ai-session-feedback-dialog .e-dlg-content {
    padding: 16px 20px;
}

[b-db2w7ezt9a] .ai-session-feedback-dialog .e-footer-content {
    padding: 12px 20px;
    border-top: 1px solid #eee;
}

[b-db2w7ezt9a] .ai-session-feedback-dialog .e-btn.e-success {
    background: #1976d2;
    border-color: #1976d2;
}

[b-db2w7ezt9a] .ai-session-feedback-dialog .e-btn.e-success:hover {
    background: #1565c0;
    border-color: #1565c0;
}

[b-db2w7ezt9a] .ai-session-feedback-dialog .e-btn.e-success:disabled {
    background: #ccc;
    border-color: #ccc;
}
/* /Shared/Components/AI/MessageDisplayComponent.razor.rz.scp.css */
.message-display-container[b-qkx3io7e8z] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    max-width: 600px;
    margin: 0 auto;
}

.message-bubble[b-qkx3io7e8z] {
    background: white;
    border-radius: 20px;
    padding: 1.5rem 2rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
    margin-bottom: 1rem;
    width: 100%;
}

.message-text[b-qkx3io7e8z] {
    color: #333;
    font-size: 1.1rem;
    line-height: 1.6;
    text-align: center;
}

.fade-in[b-qkx3io7e8z] {
    animation: fadeIn-b-qkx3io7e8z 0.3s ease-in;
}

@keyframes fadeIn-b-qkx3io7e8z {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Shared/Components/AI/QuickRepliesComponent.razor.rz.scp.css */
.quick-replies-container[b-i3ve6aamaj] {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
    padding: 1rem;
}

.quick-reply-btn[b-i3ve6aamaj] {
    padding: 0.75rem 1.25rem;
    border-radius: 25px;
    border: none;
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.quick-reply-btn:hover[b-i3ve6aamaj] {
    transform: translateY(-2px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}

.quick-reply-btn:active[b-i3ve6aamaj] {
    transform: translateY(0);
}

.btn-primary[b-i3ve6aamaj] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.btn-secondary[b-i3ve6aamaj] {
    background: #f5f5f5;
    color: #333;
    border: 1px solid #ddd;
}

.btn-secondary:hover[b-i3ve6aamaj] {
    background: #e8e8e8;
}

.btn-success[b-i3ve6aamaj] {
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: white;
}

.btn-danger[b-i3ve6aamaj] {
    background: linear-gradient(135deg, #eb3349 0%, #f45c43 100%);
    color: white;
}

.btn-warning[b-i3ve6aamaj] {
    background: linear-gradient(135deg, #f7971e 0%, #ffd200 100%);
    color: #333;
}
/* /Shared/Components/AI/TextInputComponent.razor.rz.scp.css */
.text-input-container[b-yhiy5ef061] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem;
    max-width: 600px;
    margin: 0 auto;
    width: 100%;
}

.input-label[b-yhiy5ef061] {
    color: #666;
    font-size: 0.9rem;
    margin-bottom: 0.5rem;
}

.input-wrapper[b-yhiy5ef061] {
    display: flex;
    width: 100%;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

.text-input[b-yhiy5ef061] {
    flex: 1;
    padding: 1rem 1.5rem;
    border: 2px solid #e0e0e0;
    border-radius: 25px;
    font-size: 1rem;
    outline: none;
    transition: border-color 0.2s ease;
}

.text-input:focus[b-yhiy5ef061] {
    border-color: #667eea;
}

.send-btn[b-yhiy5ef061] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.send-btn:hover:not(:disabled)[b-yhiy5ef061] {
    transform: scale(1.05);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

.send-btn:disabled[b-yhiy5ef061] {
    opacity: 0.5;
    cursor: not-allowed;
}
/* /Shared/Components/AI/WelcomeGreetingComponent.razor.rz.scp.css */
.welcome-container[b-qiv330sx8p] {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem 1rem;
    max-width: 500px;
    margin: 0 auto;
}

.welcome-icon[b-qiv330sx8p] {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.5rem;
    box-shadow: 0 4px 20px rgba(102, 126, 234, 0.3);
}

.welcome-icon .e-icons[b-qiv330sx8p] {
    font-size: 2.5rem;
    color: white;
}

.welcome-message[b-qiv330sx8p] {
    font-size: 1.4rem;
    color: #333;
    text-align: center;
    margin-bottom: 2rem;
    line-height: 1.5;
}

.welcome-actions[b-qiv330sx8p] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    width: 100%;
    margin-bottom: 2rem;
}

.welcome-btn[b-qiv330sx8p] {
    padding: 1rem 1.5rem;
    border-radius: 12px;
    border: none;
    font-size: 1.1rem;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s ease;
    text-align: left;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.welcome-btn:hover[b-qiv330sx8p] {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.btn-primary[b-qiv330sx8p] {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
}

.btn-secondary[b-qiv330sx8p] {
    background: white;
    color: #333;
    border: 1px solid #e0e0e0;
}

.btn-secondary:hover[b-qiv330sx8p] {
    background: #f8f8f8;
}

.btn-success[b-qiv330sx8p] {
    background: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    color: white;
}

.text-input-section[b-qiv330sx8p] {
    width: 100%;
}

.input-divider[b-qiv330sx8p] {
    text-align: center;
    color: #999;
    font-size: 0.85rem;
    margin-bottom: 1rem;
    position: relative;
}

.input-divider[b-qiv330sx8p]::before,
.input-divider[b-qiv330sx8p]::after {
    content: '';
    position: absolute;
    top: 50%;
    width: 30%;
    height: 1px;
    background: #e0e0e0;
}

.input-divider[b-qiv330sx8p]::before {
    left: 0;
}

.input-divider[b-qiv330sx8p]::after {
    right: 0;
}

.input-wrapper[b-qiv330sx8p] {
    display: flex;
    gap: 0.5rem;
}

.welcome-input[b-qiv330sx8p] {
    flex: 1;
    padding: 1rem 1.5rem;
    border: 2px solid #e0e0e0;
    border-radius: 25px;
    font-size: 1rem;
    outline: none;
    transition: border-color 0.2s ease;
}

.welcome-input:focus[b-qiv330sx8p] {
    border-color: #667eea;
}

.send-btn[b-qiv330sx8p] {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s ease;
}

.send-btn:hover:not(:disabled)[b-qiv330sx8p] {
    transform: scale(1.05);
}

.send-btn:disabled[b-qiv330sx8p] {
    opacity: 0.5;
    cursor: not-allowed;
}

.fade-in[b-qiv330sx8p] {
    animation: fadeIn-b-qiv330sx8p 0.4s ease-out;
}

@keyframes fadeIn-b-qiv330sx8p {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
/* /Shared/Components/Checkout/CheckoutButtons.razor.rz.scp.css */
.wrapper[b-g1d4xw469b] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-g1d4xw469b] {
    /*height: 65px;*/
}

.Center[b-g1d4xw469b] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-g1d4xw469b] {
    /*height: 65px;*/
}

[b-g1d4xw469b] .Pay {
    margin-top: 10px;
    position: absolute;
    right: 0;
}

[b-g1d4xw469b] .BackToShopping {
    margin-top: 10px;
}
/* /Shared/Components/Checkout/CheckoutConfirmation.razor.rz.scp.css */

.MessageToUser[b-e2a6sjttex] {
    font-family: Helvetica, 'Segoe UI' !important;
    vert-align: top;
    padding: 20px;
    font-size: medium;
}

.OrderNumber[b-e2a6sjttex] {
    font-size: 60px;
    width: 3em;
    padding: 0.2em 0.2em;
}

.CardHeader[b-e2a6sjttex] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

/* DivTable.com */
.divTable[b-e2a6sjttex] {
    font-family: Helvetica, 'Segoe UI' !important;
    display: table;
    width: 90%;
    min-width: 250px;
    margin: 0 auto;
}

.divTableRow[b-e2a6sjttex] {
    display: table-row;
}

.divTableCell[b-e2a6sjttex], .divTableHead[b-e2a6sjttex] {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
}

.divTableHeading[b-e2a6sjttex] {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot[b-e2a6sjttex] {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody[b-e2a6sjttex] {
    display: table-row-group;
}

[b-e2a6sjttex] .BackToShopping {
     margin-top: 10px;
 }
/* /Shared/Components/Checkout/CheckoutOrderLineAccordion.razor.rz.scp.css */
cc

.wrapper[b-4t9mgh23y6] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-4t9mgh23y6] {
    /*height: 65px;*/
}

.Center[b-4t9mgh23y6] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-4t9mgh23y6] {
    /*height: 65px;*/
}

.ProductNumber[b-4t9mgh23y6] {
    position: absolute;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductName[b-4t9mgh23y6] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductDescription[b-4t9mgh23y6] {
    padding-top: 2px;
    padding-left: 0.6em;
    word-wrap: break-word;
}

.DescriptionText[b-4t9mgh23y6] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

.ProductPrice[b-4t9mgh23y6] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
    right: 20px;
    position: absolute;
    width: 6em;
}

[b-4t9mgh23y6] .TextBoxMultilineHeight {
    height: 5em;
}
/* /Shared/Components/Checkout/CheckoutPaymentMethodCard.razor.rz.scp.css */
.CardHeader[b-k1pwqjulq3] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

.wrapper[b-k1pwqjulq3] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-k1pwqjulq3] {
    /*height: 65px;*/
}

.Center[b-k1pwqjulq3] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-k1pwqjulq3] {
    /*height: 65px;*/
}

.DescriptionText[b-k1pwqjulq3] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

[b-k1pwqjulq3] .e-input:not(:valid), [b-k1pwqjulq3] .e-input:valid, [b-k1pwqjulq3] .e-float-input.e-control-wrapper input:not(:valid), [b-k1pwqjulq3] .e-float-input.e-control-wrapper input:valid, [b-k1pwqjulq3] .e-float-input input:not(:valid), [b-k1pwqjulq3] .e-float-input input:valid, [b-k1pwqjulq3] .e-input-group input:not(:valid), [b-k1pwqjulq3] .e-input-group input:valid, [b-k1pwqjulq3] .e-input-group.e-control-wrapper input:not(:valid), [b-k1pwqjulq3] .e-input-group.e-control-wrapper input:valid, [b-k1pwqjulq3] .e-float-input.e-control-wrapper textarea:not(:valid), [b-k1pwqjulq3] .e-float-input.e-control-wrapper textarea:valid, [b-k1pwqjulq3] .e-float-input textarea:not(:valid), [b-k1pwqjulq3] .e-float-input textarea:valid, [b-k1pwqjulq3] .e-input-group.e-control-wrapper textarea:not(:valid), [b-k1pwqjulq3] .e-input-group.e-control-wrapper textarea:valid, [b-k1pwqjulq3] .e-input-group textarea:not(:valid), [b-k1pwqjulq3] .e-input-group textarea:valid {
    font-size: 30px;
    height: 40px;
}
/* /Shared/Components/Checkout/CheckoutSynopsisCard.razor.rz.scp.css */
.CardHeader[b-oi2zerv159] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}  

.Payment[b-oi2zerv159] {
    font-family: Helvetica, 'Segoe UI' !important;
    vert-align: top;
    padding: 20px;
    font-size: medium;

    /*Why we need this? Perhaps can be merged with MessageToUser*/
    width: 300px;
    margin-right: 0;
    margin-left: auto;
}

/* DivTable.com */
.divTable[b-oi2zerv159] {
    font-family: Helvetica, 'Segoe UI' !important;
    display: table;
    width: 90%;
    min-width: 250px;
    margin: 0 auto;
}

.divTableRow[b-oi2zerv159] {
    display: table-row;
}

.divTableCell[b-oi2zerv159], .divTableHead[b-oi2zerv159] {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
}

.divTableHeading[b-oi2zerv159] {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot[b-oi2zerv159] {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody[b-oi2zerv159] {
    display: table-row-group;
}
/* /Shared/Components/Checkout/SwishPhoneNumberTextbox.razor.rz.scp.css */
.CardHeader[b-gt3coamvrw] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

.wrapper[b-gt3coamvrw] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-gt3coamvrw] {
    /*height: 65px;*/
}

.Center[b-gt3coamvrw] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-gt3coamvrw] {
    /*height: 65px;*/
}

.DescriptionText[b-gt3coamvrw] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

[b-gt3coamvrw] .e-input:not(:valid), [b-gt3coamvrw] .e-input:valid, [b-gt3coamvrw] .e-float-input.e-control-wrapper input:not(:valid), [b-gt3coamvrw] .e-float-input.e-control-wrapper input:valid, [b-gt3coamvrw] .e-float-input input:not(:valid), [b-gt3coamvrw] .e-float-input input:valid, [b-gt3coamvrw] .e-input-group input:not(:valid), [b-gt3coamvrw] .e-input-group input:valid, [b-gt3coamvrw] .e-input-group.e-control-wrapper input:not(:valid), [b-gt3coamvrw] .e-input-group.e-control-wrapper input:valid, [b-gt3coamvrw] .e-float-input.e-control-wrapper textarea:not(:valid), [b-gt3coamvrw] .e-float-input.e-control-wrapper textarea:valid, [b-gt3coamvrw] .e-float-input textarea:not(:valid), [b-gt3coamvrw] .e-float-input textarea:valid, [b-gt3coamvrw] .e-input-group.e-control-wrapper textarea:not(:valid), [b-gt3coamvrw] .e-input-group.e-control-wrapper textarea:valid, [b-gt3coamvrw] .e-input-group textarea:not(:valid), [b-gt3coamvrw] .e-input-group textarea:valid {
    font-size: 30px;
    height: 40px;
}
/* /Shared/Components/Common/CardLoadingSpinner.razor.rz.scp.css */
.card-loading-container[b-dg0p7t07o4] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
    border-radius: 4px;
}

.card-loading-spinner[b-dg0p7t07o4] {
    width: 40px;
    height: 40px;
    border: 3px solid #e0e0e0;
    border-top-color: #666;
    border-radius: 50%;
    animation: card-spin-b-dg0p7t07o4 0.8s linear infinite;
}

@keyframes card-spin-b-dg0p7t07o4 {
    to {
        transform: rotate(360deg);
    }
}

.card-loading-text[b-dg0p7t07o4] {
    margin-top: 12px;
    color: #888;
    font-size: 0.9rem;
}
/* /Shared/Components/Common/LoadingImage.razor.rz.scp.css */
.loading-image-container[b-aojug8cecb] {
    position: relative;
    overflow: hidden;
}

.loading-spinner-wrapper[b-aojug8cecb] {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
    z-index: 1;
}

.loading-spinner[b-aojug8cecb] {
    width: 40px;
    height: 40px;
    border: 3px solid #e0e0e0;
    border-top-color: #666;
    border-radius: 50%;
    animation: spin-b-aojug8cecb 0.8s linear infinite;
}

@keyframes spin-b-aojug8cecb {
    to {
        transform: rotate(360deg);
    }
}

.loading-image[b-aojug8cecb] {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: opacity 0.3s ease-in-out;
}

.loading-image.loading[b-aojug8cecb] {
    opacity: 0;
}

.loading-image.loaded[b-aojug8cecb] {
    opacity: 1;
}
/* /Shared/Components/Content/DynamicCard.razor.rz.scp.css */
/* === Base Card === */
.dynamic-card[b-id2575qv5s] {
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e0e0e0;
    padding: 16px 20px;
    transition: all 0.2s ease;
}

.dynamic-card:hover[b-id2575qv5s] {
    border-color: #bdbdbd;
}

/* === Card Type Variants === */
.dynamic-card.info[b-id2575qv5s] {
    border-left: 3px solid #1976d2;
}

.dynamic-card.action[b-id2575qv5s] {
    border-left: 3px solid #43a047;
}

.dynamic-card.metric[b-id2575qv5s] {
    border-left: 3px solid #7b1fa2;
}

.dynamic-card.ai-suggestion[b-id2575qv5s] {
    border-left: 3px solid #f9a825;
    background: linear-gradient(135deg, #fff 0%, #fffde7 100%);
}

.dynamic-card.welcome-card[b-id2575qv5s] {
    background: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
    border-left: 3px solid #1976d2;
}

/* === Card Header === */
.card-header[b-id2575qv5s] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.card-icon[b-id2575qv5s] {
    font-size: 18px;
    color: #757575;
    min-width: 24px;
    text-align: center;
    margin-top: 2px;
}

.dynamic-card.info .card-icon[b-id2575qv5s] {
    color: #1976d2;
}

.dynamic-card.action .card-icon[b-id2575qv5s] {
    color: #43a047;
}

.dynamic-card.metric .card-icon[b-id2575qv5s] {
    color: #7b1fa2;
}

.dynamic-card.ai-suggestion .card-icon[b-id2575qv5s] {
    color: #f9a825;
}

.card-titles[b-id2575qv5s] {
    flex: 1;
}

.card-title[b-id2575qv5s] {
    font-size: 15px;
    font-weight: 600;
    color: #333;
    margin: 0 0 4px 0;
}

.card-subtitle[b-id2575qv5s] {
    font-size: 13px;
    color: #666;
    margin: 0;
    line-height: 1.4;
}

/* === Card Body === */
.card-body[b-id2575qv5s] {
    margin: 14px 0;
    padding-left: 36px;
}

/* Metric styles */
.metric-body[b-id2575qv5s] {
    text-align: center;
    padding: 12px 0;
}

.metric-value[b-id2575qv5s] {
    font-size: 28px;
    font-weight: 700;
    color: #333;
}

.metric-trend[b-id2575qv5s] {
    font-size: 13px;
    font-weight: 500;
    margin-top: 6px;
}

.metric-trend.up[b-id2575qv5s] {
    color: #43a047;
}

.metric-trend.up[b-id2575qv5s]::before {
    content: "↑ ";
}

.metric-trend.down[b-id2575qv5s] {
    color: #e53935;
}

.metric-trend.down[b-id2575qv5s]::before {
    content: "↓ ";
}

/* Suggestion styles */
.suggestion-body[b-id2575qv5s] {
    padding: 8px 0;
}

.suggestion-text[b-id2575qv5s] {
    font-size: 13px;
    color: #444;
    line-height: 1.5;
    font-style: italic;
}

/* === Card Actions === */
.card-actions[b-id2575qv5s] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #e0e0e0;
}

.action-btn[b-id2575qv5s] {
    padding: 6px 12px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 1px solid transparent;
}

.action-btn.primary[b-id2575qv5s] {
    background: #1976d2;
    color: #fff;
    border-color: #1976d2;
}

.action-btn.primary:hover[b-id2575qv5s] {
    background: #1565c0;
    border-color: #1565c0;
}

.action-btn.secondary[b-id2575qv5s] {
    background: #fff;
    color: #333;
    border-color: #e0e0e0;
}

.action-btn.secondary:hover[b-id2575qv5s] {
    border-color: #1976d2;
    color: #1976d2;
}

.action-btn.danger[b-id2575qv5s] {
    background: #ffebee;
    color: #c62828;
    border-color: #ffcdd2;
}

.action-btn.danger:hover[b-id2575qv5s] {
    background: #ffcdd2;
}

.action-btn i[b-id2575qv5s] {
    font-size: 11px;
}
/* /Shared/Components/Content/PublishedAnalyticsCard.razor.rz.scp.css */
.analytics-card[b-5nvr6p6spe] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.analytics-summary[b-5nvr6p6spe] {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
}

.metric[b-5nvr6p6spe] {
    text-align: center;
    padding: 12px;
    background: linear-gradient(135deg, #e3f2fd 0%, #e8f5e9 100%);
    border-radius: 8px;
}

.metric-value[b-5nvr6p6spe] {
    font-size: 24px;
    font-weight: 700;
    color: #1976d2;
    margin-bottom: 4px;
}

.metric-label[b-5nvr6p6spe] {
    font-size: 11px;
    color: #666;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.top-posts h4[b-5nvr6p6spe] {
    font-size: 13px;
    font-weight: 600;
    color: #333;
    margin: 0 0 12px 0;
}

.top-post-item[b-5nvr6p6spe] {
    display: flex;
    gap: 10px;
    padding: 8px;
    background: #fafafa;
    border-radius: 6px;
    margin-bottom: 8px;
    transition: background 0.2s;
}

.top-post-item:hover[b-5nvr6p6spe] {
    background: #f0f0f0;
}

.top-post-item:last-child[b-5nvr6p6spe] {
    margin-bottom: 0;
}

.top-post-item img[b-5nvr6p6spe] {
    width: 50px;
    height: 50px;
    border-radius: 4px;
    object-fit: cover;
    flex-shrink: 0;
}

.top-post-stats[b-5nvr6p6spe] {
    flex: 1;
    min-width: 0;
}

.top-post-stats .caption[b-5nvr6p6spe] {
    font-size: 12px;
    color: #333;
    margin-bottom: 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.top-post-stats .engagement[b-5nvr6p6spe] {
    display: flex;
    gap: 12px;
    font-size: 11px;
    color: #666;
}

.top-post-stats .engagement span[b-5nvr6p6spe] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.engagement-rate[b-5nvr6p6spe] {
    color: #2e7d32;
    font-weight: 600;
}

/* Responsive */
@media (max-width: 768px) {
    .analytics-summary[b-5nvr6p6spe] {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 480px) {
    .metric-value[b-5nvr6p6spe] {
        font-size: 20px;
    }

    .top-post-item[b-5nvr6p6spe] {
        flex-direction: column;
        align-items: flex-start;
    }

    .top-post-item img[b-5nvr6p6spe] {
        width: 100%;
        height: auto;
        max-height: 200px;
    }
}
/* /Shared/Components/Content/ScheduledPostsCard.razor.rz.scp.css */
.scheduled-posts-card[b-d4s3fruwgh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.posts-list[b-d4s3fruwgh] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.post-item[b-d4s3fruwgh] {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    transition: all 0.2s;
}

.post-item:hover[b-d4s3fruwgh] {
    background: #fff;
    border-color: #1976d2;
    box-shadow: 0 2px 8px rgba(25, 118, 210, 0.1);
}

.post-thumbnail[b-d4s3fruwgh] {
    width: 60px;
    height: 60px;
    border-radius: 6px;
    overflow: hidden;
    flex-shrink: 0;
}

.post-thumbnail img[b-d4s3fruwgh] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-details[b-d4s3fruwgh] {
    flex: 1;
    min-width: 0;
}

.post-caption[b-d4s3fruwgh] {
    font-size: 13px;
    color: #333;
    font-weight: 500;
    margin-bottom: 6px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.post-meta[b-d4s3fruwgh] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 12px;
    color: #666;
}

.post-time[b-d4s3fruwgh] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.post-platforms[b-d4s3fruwgh] {
    display: flex;
    gap: 6px;
}

.post-platforms i[b-d4s3fruwgh] {
    color: #999;
    font-size: 14px;
}

.post-actions[b-d4s3fruwgh] {
    display: flex;
    gap: 6px;
    flex-shrink: 0;
}

.btn-edit[b-d4s3fruwgh],
.btn-cancel[b-d4s3fruwgh] {
    padding: 6px 12px;
    font-size: 12px;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
    background: #fff;
    cursor: pointer;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    gap: 4px;
    white-space: nowrap;
}

.btn-edit:hover[b-d4s3fruwgh] {
    background: #e3f2fd;
    border-color: #1976d2;
    color: #1976d2;
}

.btn-cancel:hover[b-d4s3fruwgh] {
    background: #ffebee;
    border-color: #e53935;
    color: #e53935;
}

/* Responsive */
@media (max-width: 768px) {
    .post-item[b-d4s3fruwgh] {
        flex-wrap: wrap;
    }

    .post-actions[b-d4s3fruwgh] {
        width: 100%;
        justify-content: flex-end;
    }
}
/* /Shared/Components/Content/SocialIdeaCard.razor.rz.scp.css */
.social-idea-card[b-2nb9t19ej6] {
    position: relative;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 24px 20px;
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    min-height: 180px;
    height: 100%;
    box-sizing: border-box;
}

.social-idea-card:hover[b-2nb9t19ej6] {
    border-color: #1976d2;
    box-shadow: 0 4px 16px rgba(25, 118, 210, 0.15);
    transform: translateY(-2px);
}

.idea-icon[b-2nb9t19ej6] {
    font-size: 42px;
    line-height: 1;
    margin-bottom: 8px;
}

.idea-title[b-2nb9t19ej6] {
    font-weight: 600;
    font-size: 15px;
    color: #333;
    line-height: 1.3;
}

.idea-description[b-2nb9t19ej6] {
    font-size: 13px;
    color: #666;
    line-height: 1.4;
    flex: 1;
}

.idea-timing-btn[b-2nb9t19ej6] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 500;
    margin-top: 8px;
    width: 100%;
    max-width: 220px;
}

.timing-now[b-2nb9t19ej6] {
    background-color: #e8f5e9;
    color: #2e7d32;
    border: 1px solid #a5d6a7;
}

.timing-scheduled[b-2nb9t19ej6] {
    background-color: #e3f2fd;
    color: #1565c0;
    border: 1px solid #90caf9;
}

.idea-type-badge[b-2nb9t19ej6] {
    font-size: 0.7rem;
    padding: 2px 8px;
    border-radius: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.idea-type-badge.feed[b-2nb9t19ej6] {
    background-color: #e3f2fd;
    color: #1976d2;
}

.idea-type-badge.story[b-2nb9t19ej6] {
    background-color: #f3e5f5;
    color: #7b1fa2;
}

.idea-type-badge.reel[b-2nb9t19ej6] {
    background-color: #fff3e0;
    color: #f57c00;
}

/* Feedback Button */
.idea-feedback-btn[b-2nb9t19ej6] {
    position: absolute;
    top: 8px;
    right: 8px;
    background: transparent;
    border: none;
    color: #888;
    cursor: pointer;
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 14px;
    opacity: 0;
    transition: opacity 0.2s, color 0.2s, background 0.2s;
    z-index: 1;
}

.social-idea-card:hover .idea-feedback-btn[b-2nb9t19ej6] {
    opacity: 1;
}

.idea-feedback-btn:hover[b-2nb9t19ej6] {
    color: #1976d2;
    background: rgba(25, 118, 210, 0.1);
}
/* /Shared/Components/Content/SocialIdeaCardSkeleton.razor.rz.scp.css */
.social-idea-card-skeleton[b-qei25tv8ek] {
    position: relative;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    padding: 24px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 8px;
    min-height: 180px;
    height: 100%;
    box-sizing: border-box;
}

/* Skeleton elements with shimmer animation */
.skeleton-icon[b-qei25tv8ek] {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-qei25tv8ek 1.5s infinite;
    margin-bottom: 8px;
}

.skeleton-badge[b-qei25tv8ek] {
    width: 50px;
    height: 18px;
    border-radius: 10px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-qei25tv8ek 1.5s infinite;
    animation-delay: 0.1s;
}

.skeleton-title[b-qei25tv8ek] {
    width: 80%;
    height: 20px;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-qei25tv8ek 1.5s infinite;
    animation-delay: 0.2s;
}

.skeleton-description[b-qei25tv8ek] {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    align-items: center;
}

.skeleton-line[b-qei25tv8ek] {
    width: 90%;
    height: 14px;
    border-radius: 4px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-qei25tv8ek 1.5s infinite;
    animation-delay: 0.3s;
}

.skeleton-line.short[b-qei25tv8ek] {
    width: 60%;
    animation-delay: 0.4s;
}

.skeleton-timing[b-qei25tv8ek] {
    width: 140px;
    height: 36px;
    border-radius: 20px;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: shimmer-b-qei25tv8ek 1.5s infinite;
    animation-delay: 0.5s;
    margin-top: 8px;
}

@keyframes shimmer-b-qei25tv8ek {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}
/* /Shared/Components/Frontier/FrontierAccordion.razor.rz.scp.css */
.wrapper[b-f2e5512wlv] {
width: auto;
height: auto;
box-sizing: border-box;
display: grid;
grid-auto-flow: row;
/*grid-template-columns: 50px auto 65px;*/
color: #808080;
}

.left[b-f2e5512wlv] {
/*height: 65px;*/
}

.Center[b-f2e5512wlv] {
text-align: left;
/* height: 65px;*/
}

.right[b-f2e5512wlv] {
/*height: 65px;*/
}


.ProductNumber[b-f2e5512wlv] {
    position: absolute;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 10px;
    padding-left: 0.6em;
}

.ProductName[b-f2e5512wlv] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 10px;
    padding-left: 0.6em;
}

.ProductDescription[b-f2e5512wlv] {
    padding-top: 2px;
    padding-left: 0.6em;
    word-wrap: break-word;
}

.DescriptionText[b-f2e5512wlv] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

.ProductPrice[b-f2e5512wlv] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 10px;
    right: 10px; 
    position: absolute;
    width: 6em;
    /*margin-right: 15px;*/
}

.CardHeader[b-f2e5512wlv] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}
/* /Shared/Components/Frontier/FrontierActionCard.razor.rz.scp.css */
.wrapper[b-g16xsvi7wp] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.wrapper-left[b-g16xsvi7wp] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.wrapper-right[b-g16xsvi7wp] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}

[b-g16xsvi7wp] .Frontier-Action-Card {
    margin-top: 5px;
}

[b-g16xsvi7wp] .e-btn {
    background-color: #FFFFFF;
    color: #000000;
}
/* /Shared/Components/Frontier/FrontierGridCard.razor.rz.scp.css */

[b-9o8rk0qb9w] .Frontier-grid-card {
    width: 98%;
    margin-bottom: 5px;
    margin-left: 5px;
    margin-right: 5px;
    border: 2px solid rgba(0,0,0,0.10);
}

[b-9o8rk0qb9w] .Frontier-grid-card-selected {
    border: 2px solid rgba(0,0,0,0.40);
}

[b-9o8rk0qb9w] .e-dropdown-btn.e-custom {
    width: 100%;
    font-size: 28px;
    background: rgba(255, 255, 255, 0.7);
    color: black;
}

.grid-container[b-9o8rk0qb9w] {
    display: grid;
    grid-template-columns: auto auto;
    padding: 10px;
    font-size: 14px;
}

.grid-item-left[b-9o8rk0qb9w] {
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
}

.grid-item-right[b-9o8rk0qb9w] {
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 2px;
}

.grid-item-wide-Span-2[b-9o8rk0qb9w]{
    grid-column: span 2;
    margin-left: 0;
    padding-bottom: 20px;
}

.Frontier-Grid-Queue-wrapper[b-9o8rk0qb9w] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.Frontier-Grid-Queue-left[b-9o8rk0qb9w] {
    text-align: left;
    grid-column: 1/1;
    padding: 0 2px;
}

.Frontier-Grid-Queue-right[b-9o8rk0qb9w] {
    text-align: right;
    grid-column: 6/7;
}

.Frontier-Queue[b-9o8rk0qb9w] {
    font-size: 1.5em;
}
/* /Shared/Components/Frontier/FrontierMainCard.razor.rz.scp.css */
[b-1mqq2viabk] .MainOrderCard {
    /*min-height: 55vh;*/
    padding: 20px 0;
}

[b-1mqq2viabk] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
    color: #33383e;
}

[b-1mqq2viabk] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
        background: #E8E8E8 !important;
}

[b-1mqq2viabk] .e-tab .e-tab-header .e-toolbar-item.e-active {
    background: #E8E8E8;
}

.Frontier-Main-Queue-wrapper[b-1mqq2viabk] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.Frontier-Main-Queue-left[b-1mqq2viabk] {
    text-align: left;
    grid-column: 1/1;
    padding: 0 2px;
}

.Frontier-Main-Queue-right[b-1mqq2viabk] {
    text-align: right;
    grid-column: 6/7;
}

.Frontier-Queue[b-1mqq2viabk] {
    font-size: 2em;
}

.wrapper[b-1mqq2viabk] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.left[b-1mqq2viabk] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.right[b-1mqq2viabk] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}
/* /Shared/Components/Frontier/FrontierOrderEventListView.razor.rz.scp.css */
.EventWrapper[b-vzl03gt728] {
    width: auto;
    height: 50px;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 50px auto 50px;
    font-family: Helvetica, 'Segoe UI' !important;
}

.EventLeft[b-vzl03gt728] {
    /*padding-top: 10px;*/
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    /*line-height: 60px;*/
    padding-top: 12px;
}

.EventCenter[b-vzl03gt728] {
    text-align: left;
    /*margin-left: 20px;*/
    padding: 5px;
}

.EventRight[b-vzl03gt728] {
    text-align: left;
    /*padding-right: 10px;*/
    padding: 5px;
}

[b-vzl03gt728] .e-listview {
    border-top: 0;
    border-right: 1px #CCCCCC;
    border-bottom: 1px #CCCCCC;
    border-left: 0;
}

.DateAndSource[b-vzl03gt728] {
    font-family: Helvetica, 'Segoe UI' !important;
    width: 95%;
    font-size: x-small;
    font-weight: 700;
    padding-top: 4px;
    color: #C0C0C0;
}

.Description[b-vzl03gt728] {
    font-family: Helvetica, 'Segoe UI' !important;
    width: 95%;
    font-size: medium;
    padding-top: 5px;
    /*color: #808080;*/
}

[b-vzl03gt728] .e-ViewButton {
    background: rgba(255, 255, 255, 0.7);
    color: #6c757d;
    margin-top: 5px;
    margin-right: 5px;
    width: 2.5rem;
    font-size: 11px;
}

.greenCSSPopup + .e-dlg-overlay[b-vzl03gt728] {
    background-color: #000;
    opacity: .2;
}
/* /Shared/Components/Frontier/FrontierOrderLineAccordion.razor.rz.scp.css */
.wrapper[b-7fa8notair] {
width: auto;
height: auto;
box-sizing: border-box;
display: grid;
grid-auto-flow: row;
/*grid-template-columns: 50px auto 65px;*/
color: #808080;
}

.left[b-7fa8notair] {
/*height: 65px;*/
}

.Center[b-7fa8notair] {
text-align: left;
/* height: 65px;*/
}

.right[b-7fa8notair] {
/*height: 65px;*/
}


.ProductNumber[b-7fa8notair] {
position: absolute;
font-family: Helvetica, 'Segoe UI' !important;
font-size: 14px !important;
font-weight: 700;
padding-top: 10px;
padding-left: 0.6em;
}

.ProductName[b-7fa8notair] {
font-family: Helvetica, 'Segoe UI' !important;
font-size: 14px !important;
font-weight: 700;
padding-top: 10px;
padding-left: 0.6em;
}

.ProductDescription[b-7fa8notair] {
padding-top: 2px;
padding-left: 0.6em;
word-wrap: break-word;
}

.DescriptionText[b-7fa8notair] {
width: 97%;
font-family: Helvetica, 'Segoe UI' !important;
font-size: 12px !important;
}

.ProductPrice[b-7fa8notair] {
font-family: Helvetica, 'Segoe UI' !important;
font-size: 14px !important;
/*font-weight: 700;*/
padding-top: 10px;
right: 10px; 
position: absolute;
width: 6em;
/*margin-right: 15px;*/
}

.CardHeader[b-7fa8notair] {
font-size: small;
color: #808080;
margin: 5px;
font-weight: 500;
}
/* /Shared/Components/Frontier/FrontierOrderLineListView.razor.rz.scp.css */
.wrapper[b-czx0z1ywx4] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.left[b-czx0z1ywx4] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.right[b-czx0z1ywx4] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}
/* /Shared/Components/Layout/AttributeDialog.razor.rz.scp.css */
[b-lyj3galeuc] .Action-Card {
    margin-top: 5px;
}

[b-lyj3galeuc] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap {
    color: #33383e;
}

[b-lyj3galeuc] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
    background: #E8E8E8 !important;
}

[b-lyj3galeuc] .e-tab .e-tab-header .e-toolbar-item.e-active {
    background: #E8E8E8;
}

.wrapper[b-lyj3galeuc] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.wrapper-left[b-lyj3galeuc] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.wrapper-right[b-lyj3galeuc] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}

.DescriptionText[b-lyj3galeuc] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
    margin-top: 15px;
    margin-bottom: 5px;
}

.square-container[b-lyj3galeuc] {
    width: 100%; /* Set the desired width */
    height: 100%; /* Set the desired height */
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
}

.square-image[b-lyj3galeuc] {
    width: 100%; /* Make the image fill the container */
    height: 100%; /* Make the image fill the container */
    object-fit: cover; /* Maintain aspect ratio and cover the container */
}

.Attribute-Main-Queue-wrapper[b-lyj3galeuc] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 5px; 
    margin-bottom: 5px; 
}

.Attribute-Main-Queue-left[b-lyj3galeuc] {
    text-align: left;
    grid-column: 1 / span 2; /* This will make it span from column 1 to column 2 */
    padding: 0 2px;
}

.Attribute-Main-Queue-right[b-lyj3galeuc] {
    padding-left 5px; 
    text-align: left;
    grid-column: 3 / span 6; /* This will make it span from column 2 to column 6 */
    padding-left: 5px; 

}


/* /Shared/Components/Layout/OneColumnMediumLayout.razor.rz.scp.css */
/* Shared styles moved to app.css */
/* This file intentionally minimal - no unique styles needed */
/* /Shared/Components/Layout/OneColumnSmallLayout.razor.rz.scp.css */
/* Shared styles moved to app.css */
/* This file intentionally minimal - no unique styles needed */
/* /Shared/Components/Layout/ThreeColumnLayout.razor.rz.scp.css */
/* Shared styles moved to app.css */

@media only screen and (min-width: 768px) {
    .LeftPadding[b-1ssn34wbvi] {
        padding-right: 7px;
    }

    .MiddlePadding[b-1ssn34wbvi] {
        padding-left: 7px;
        padding-right: 7px;
    }

    .RightPadding[b-1ssn34wbvi] {
        padding-left: 7px;
    }
}
/* /Shared/Components/Layout/TwoColumnLayout.razor.rz.scp.css */
/* Shared styles moved to app.css */

@media only screen and (min-width: 768px) {
    .RightPadding[b-1t3v2a6v5a] {
        padding-right: 7px;
    }

    .LeftPadding[b-1t3v2a6v5a] {
        padding-left: 7px;
    }
}
/* /Shared/Components/Layout/TwoColumnLeftRightLayout.razor.rz.scp.css */
/* Shared styles moved to app.css */

@media only screen and (min-width: 768px) {
    .RightPadding[b-bxotu27wvh] {
        padding-right: 7px;
    }

    .LeftPadding[b-bxotu27wvh] {
        padding-left: 7px;
    }
}
/* /Shared/Components/OrderPage/OrderPageOrderLineAccordion.razor.rz.scp.css */
.OrderHeader[b-vd1gxbfm75] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}

.wrapper[b-vd1gxbfm75] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    /*grid-template-columns: 50px auto 65px;*/
    color: #808080;
}

.left[b-vd1gxbfm75] {
    /*height: 65px;*/
}

.Center[b-vd1gxbfm75] {
    text-align: left;
    /* height: 65px;*/
}

.right[b-vd1gxbfm75] {
    /*height: 65px;*/
}

.ProductNumber[b-vd1gxbfm75] {
    position: absolute;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductName[b-vd1gxbfm75] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}

.ProductDescription[b-vd1gxbfm75] {
    padding-top: 2px;
    padding-left: 0.6em;
    word-wrap: break-word;
}

.DescriptionText[b-vd1gxbfm75] {
    width: 97%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
}

.ProductPrice[b-vd1gxbfm75] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
    right: 20px;
    position: absolute;
    width: 6em;
}

.TotalAmount[b-vd1gxbfm75] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 18px !important;
    font-weight: 700;
    right: 20px;
    position: absolute;
}


[b-vd1gxbfm75] .TextBoxMultilineHeight {
    height: 5em;
}

.MessageBox[b-vd1gxbfm75] {
    font-family: Helvetica, 'Segoe UI' !important;
    vert-align: top;
    padding: 20px;
    font-size: medium;
}

.OrderNumber[b-vd1gxbfm75] {
    font-size: 60px;
    text-align: center;
    width: 3em;
    padding: 0.2em 0.2em;
    margin: auto; /* Centerizes the order number box */
}

/* DivTable.com */
.divTable[b-vd1gxbfm75] {
    font-family: Helvetica, 'Segoe UI' !important;
    display: table;
    width: 100%;
    min-width: 250px;
    margin: 0 auto;
}

.divTableRow[b-vd1gxbfm75] {
    display: table-row;
}

.divTableCell[b-vd1gxbfm75], .divTableHead[b-vd1gxbfm75] {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
}

.divTableHeading[b-vd1gxbfm75] {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot[b-vd1gxbfm75] {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody[b-vd1gxbfm75] {
    display: table-row-group;
}
/* /Shared/Components/Product/ProductActionsCard.razor.rz.scp.css */
[b-ne44i11hm1] .Action-Card {
    margin-top: 5px;
}

.wrapper[b-ne44i11hm1] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
}

.wrapper-left[b-ne44i11hm1] {
    text-align: left;
    grid-column: 1/1;
    border: 1px;
    padding: 0 2px;
}

.wrapper-right[b-ne44i11hm1] {
    text-align: right;
    grid-column: 3/7;
    border: 1px;
}
/* /Shared/Components/Product/ProductAllergenEditor.razor.rz.scp.css */
.allergen-editor[b-gehazzq2s9] {
    padding: 20px;
}

.allergen-checkboxes[b-gehazzq2s9] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.form-check[b-gehazzq2s9] {
    margin-bottom: 8px;
}
/* /Shared/Components/Product/ProductAttributesCard.razor.rz.scp.css */
.grid-container[b-xn2u6jhkj6] {
    display: grid;
    grid-template-columns: auto auto;
    padding: 10px;
    font-size: 14px;
}

.grid-item-left[b-xn2u6jhkj6] {
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-right[b-xn2u6jhkj6] {
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-wide-Span-2[b-xn2u6jhkj6] {
    grid-column: span 2;
    margin-left: 0;
    padding-bottom: 20px;
}
/* /Shared/Components/Product/ProductAttributesEditor.razor.rz.scp.css */
/* Delete button - subtle X that turns red on hover */
.delete-btn[b-2bosge3dar] {
    width: 24px;
    height: 24px;
    border: none;
    background: transparent;
    color: #999;
    font-size: 14px;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.delete-btn:hover[b-2bosge3dar] {
    background-color: #ffebee;
    color: #d32f2f;
}

/* Add button styling */
.add-btn[b-2bosge3dar] {
    width: 28px;
    height: 28px;
    border: 1px solid #ccc;
    background: #fff;
    color: #666;
    font-size: 18px;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.add-btn:hover[b-2bosge3dar] {
    background-color: #f5f5f5;
    border-color: #999;
    color: #333;
}
/* /Shared/Components/Product/ProductCreateNewDialog.razor.rz.scp.css */
/* /Shared/Components/Product/ProductDescriptionCard.razor.rz.scp.css */

.grid-container[b-xmry1mi2aq] {
    display: grid;
    grid-template-columns: auto auto;
    padding: 10px;
    font-size: 14px;
}

.grid-item-left[b-xmry1mi2aq] {
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-right[b-xmry1mi2aq] {
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-wide-Span-2[b-xmry1mi2aq] {
    grid-column: span 2;
    margin-left: 0;
    padding-bottom: 20px;
}
/* /Shared/Components/Product/ProductGrid.razor.rz.scp.css */
[b-qbdgihl32l] .e-grid .e-sortnumber {
    display: none;
}

[b-qbdgihl32l] .e-grid .e-sortfilterdiv {
    display: none;
}

/*Grid Cards*/
[b-qbdgihl32l] .grid-container {
    display: grid;
    grid-template-columns: auto auto;
    /*background-color: #2196F3;*/
    padding: 10px;
    font-family: "Helvetica Neue","Helvetica","Arial",sans-serif,"-apple-system","BlinkMacSystemFont";
    font-size: 14px;
}

[b-qbdgihl32l] .grid-item-left {
    /*background-color: rgba(255, 255, 255, 0.8);*/
    /*border: 1px solid rgba(0, 0, 0, 0.8);*/
    padding: 10px;
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    font-family: "Helvetica Neue","Helvetica","Arial",sans-serif,"-apple-system","BlinkMacSystemFont";
    font-size: 14px;
}

[b-qbdgihl32l] .grid-item-right {
    /*background-color: rgba(255, 255, 255, 0.8);*/
    /*border: 1px solid rgba(0, 0, 0, 0.8);*/
    padding: 10px;
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    font-family: "Helvetica Neue","Helvetica","Arial",sans-serif,"-apple-system","BlinkMacSystemFont";
    /*font-size: 24px;*/
}
/* /Shared/Components/Product/ProductMainCard.razor.rz.scp.css */
/* Main Grid Layout */
.product-form-grid[b-nxebzsdhcx] {
    display: grid;
    grid-template-columns: 200px 1fr;
    gap: 24px;
    padding: 16px;
}

/* Left Column - Image */
.product-image-column[b-nxebzsdhcx] {
    display: flex;
    flex-direction: column;
}

.product-image-container[b-nxebzsdhcx] {
    width: 200px;
    height: 200px;
    border-radius: 8px;
    overflow: hidden;
    background-color: #f5f5f5;
    border: 1px solid #e0e0e0;
}

.product-image[b-nxebzsdhcx] {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Right Column - Form Fields */
.product-fields-column[b-nxebzsdhcx] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Field Groups */
.field-group[b-nxebzsdhcx] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.field-small[b-nxebzsdhcx] {
    max-width: 120px;
}

.field-medium[b-nxebzsdhcx] {
    max-width: 200px;
}

/* Inline Row for multiple fields */
.field-row-inline[b-nxebzsdhcx] {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

/* Labels */
.field-label[b-nxebzsdhcx] {
    font-size: 12px;
    font-weight: 500;
    color: #666;
    margin-bottom: 2px;
}

/* Description Textarea */
[b-nxebzsdhcx] .description-textarea {
    min-height: 80px;
}

[b-nxebzsdhcx] .description-textarea textarea {
    min-height: 80px;
    resize: vertical;
}

/* AI Button Row */
.ai-button-row[b-nxebzsdhcx] {
    margin-top: 8px;
}

.ai-button[b-nxebzsdhcx] {
    font-size: 12px;
    padding: 6px 16px;
}

.ai-button .spinner-border-sm[b-nxebzsdhcx] {
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

/* AI Suggestion */
.ai-suggestion[b-nxebzsdhcx] {
    margin-top: 16px;
}

.ai-suggestion-header[b-nxebzsdhcx] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.ai-suggestion-title[b-nxebzsdhcx] {
    font-size: 12px;
    font-weight: 600;
    color: #1976d2;
}

.ai-suggestion-meta[b-nxebzsdhcx] {
    font-size: 10px;
    color: #666;
}

.ai-suggestion-text[b-nxebzsdhcx] {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
    padding: 12px;
    background-color: #f0f7ff;
    border: 1px solid #b3d4fc;
    border-radius: 6px;
}

.ai-suggestion-error[b-nxebzsdhcx] {
    font-size: 13px;
    color: #d32f2f;
    padding: 12px;
    background-color: #ffebee;
    border-radius: 6px;
}

.ai-suggestion-actions[b-nxebzsdhcx] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 12px;
}

/* Updated Timestamp */
.updated-timestamp[b-nxebzsdhcx] {
    font-size: 11px;
    color: #999;
    text-align: right;
    margin-top: 8px;
}

/* Spinner animation */
.spinner-border[b-nxebzsdhcx] {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    vertical-align: text-bottom;
    border: 0.15em solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: spinner-border-b-nxebzsdhcx 0.75s linear infinite;
}

.spinner-border-sm[b-nxebzsdhcx] {
    width: 0.75rem;
    height: 0.75rem;
    border-width: 0.1em;
}

@keyframes spinner-border-b-nxebzsdhcx {
    to {
        transform: rotate(360deg);
    }
}

/* AI Suggestion Accordion Animation */
@keyframes slideDown-b-nxebzsdhcx {
    from {
        opacity: 0;
        max-height: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        max-height: 300px;
        transform: translateY(0);
    }
}

.ai-suggestion-accordion[b-nxebzsdhcx] {
    animation: slideDown-b-nxebzsdhcx 0.8s ease-out forwards;
}
/* /Shared/Components/Product/ProductMainCardDialog.razor.rz.scp.css */
.square-container[b-yjno4cmnzk] {
    width: 100%; /* Set the desired width */
    height: 100%; /* Set the desired height */
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
}

.square-image[b-yjno4cmnzk] {
    width: 100%; /* Make the image fill the container */
    height: 100%; /* Make the image fill the container */
    object-fit: cover; /* Maintain aspect ratio and cover the container */
}

.Attribute-Main-Queue-wrapper[b-yjno4cmnzk] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(6, 1fr);
    margin-top: 5px;
    margin-bottom: 5px;
}

.Attribute-Main-Queue-left[b-yjno4cmnzk] {
    text-align: left;
    grid-column: 1 / span 2; /* This will make it span from column 1 to column 2 */
    padding: 0 2px;
}

.Attribute-Main-Queue-right[b-yjno4cmnzk] {
    padding-left 5px;
    text-align: left;
    grid-column: 3 / span 6; /* This will make it span from column 2 to column 6 */
    padding-left: 5px;
}

.attribute-controls-header[b-yjno4cmnzk] {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 6px;
}

.attribute-row[b-yjno4cmnzk] {
    margin-top: 5px;
}

.attribute-delete-button[b-yjno4cmnzk] {
    display: flex;
    align-items: center;
}

.image-counter-badge[b-yjno4cmnzk] {
    position: absolute;
    bottom: 10px;
    right: 10px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 4px 8px;
    border-radius: 3px;
    font-size: 0.8em;
}

.placeholder-image[b-yjno4cmnzk] {
    position: relative;
}

/* Tab styling - cleaner design (override Syncfusion blue defaults) */
[b-yjno4cmnzk] .e-tab .e-tab-header {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #e0e0e0 !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item .e-tab-text {
    color: #555 !important;
    font-weight: 500 !important;
    font-size: 13px !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-text {
    color: #333 !important;
    font-weight: 600 !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item.e-active .e-tab-wrap {
    border-bottom: 2px solid #333 !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-indicator {
    background-color: #333 !important;
}

/* Override Syncfusion blue hover/focus states */
[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item:not(.e-active) .e-tab-text:hover {
    color: #333 !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:hover {
    background-color: #f0f0f0 !important;
}

[b-yjno4cmnzk] .e-tab .e-tab-header .e-toolbar-item .e-tab-wrap:focus {
    background-color: #f0f0f0 !important;
}

/* Minimum height for tab content to prevent dialog shrinking when switching tabs */
[b-yjno4cmnzk] .e-tab .e-content {
    min-height: 520px !important;
}

[b-yjno4cmnzk] .e-tab .e-content .e-item {
    min-height: 520px !important;
}
/* /Shared/Components/Product/ProductMultiImageManager.razor.rz.scp.css */
.multi-image-manager[b-gtu8t5m2p6] {
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.image-gallery-section h5[b-gtu8t5m2p6],
.upload-section h5[b-gtu8t5m2p6],
.ai-generation-section h5[b-gtu8t5m2p6] {
    margin-bottom: 12px;
    font-weight: 500;
    font-size: 13px;
    color: #333;
    padding-bottom: 8px;
    border-bottom: 1px solid #e0e0e0;
}

.image-count[b-gtu8t5m2p6] {
    color: #666;
    font-size: 0.9em;
}

.image-gallery[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.image-item[b-gtu8t5m2p6] {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    background: #fafafa;
}

.image-thumbnail-wrapper[b-gtu8t5m2p6] {
    position: relative;
    flex-shrink: 0;
}

.image-thumbnail[b-gtu8t5m2p6] {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #ddd;
}

[b-gtu8t5m2p6] .image-thumbnail-loading {
    width: 120px;
    height: 120px;
    border-radius: 4px;
    border: 1px solid #ddd;
}

.primary-badge[b-gtu8t5m2p6] {
    position: absolute;
    top: 5px;
    left: 5px;
    background: #4CAF50;
    color: white;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 0.75em;
    font-weight: bold;
}

.template-badge[b-gtu8t5m2p6] {
    position: absolute;
    top: 5px;
    right: 5px;
    background: #2196F3;
    color: white;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 0.75em;
    font-weight: bold;
}

.image-info[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
    min-width: 0;
}

.image-index-header[b-gtu8t5m2p6] {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.image-index[b-gtu8t5m2p6] {
    font-size: 0.9em;
    color: #666;
    font-weight: 500;
}

.stored-prompt[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    background: white;
    padding: 10px;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.prompt-preview-text[b-gtu8t5m2p6] {
    font-size: 0.85em;
    color: #555;
    line-height: 1.5;
    font-family: 'Courier New', monospace;
}

.prompt-actions[b-gtu8t5m2p6] {
    display: flex;
    gap: 8px;
}

.image-actions[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
}

/* Delete button - subtle X that turns red on hover */
.delete-image-btn[b-gtu8t5m2p6] {
    width: 28px;
    height: 28px;
    border: none;
    background: transparent;
    color: #999;
    font-size: 16px;
    cursor: pointer;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.15s ease;
}

.delete-image-btn:hover[b-gtu8t5m2p6] {
    background-color: #ffebee;
    color: #d32f2f;
}

/* Mini delete button for thumbnails */
.mini-delete-btn[b-gtu8t5m2p6] {
    position: absolute;
    top: -6px;
    right: -6px;
    width: 18px;
    height: 18px;
    border: none;
    background: #fff;
    color: #999;
    font-size: 10px;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
    opacity: 0;
    transition: all 0.15s ease;
}

.mini-delete-btn:hover[b-gtu8t5m2p6] {
    background-color: #ffebee;
    color: #d32f2f;
}

div:hover > .mini-delete-btn[b-gtu8t5m2p6] {
    opacity: 1;
}

/* Gallery delete button */
.gallery-delete-btn[b-gtu8t5m2p6] {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 22px;
    height: 22px;
    border: none;
    background: rgba(255,255,255,0.9);
    color: #999;
    font-size: 12px;
    cursor: pointer;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.15s ease;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}

.gallery-delete-btn:hover[b-gtu8t5m2p6] {
    background-color: #ffebee;
    color: #d32f2f;
}

.gallery-image-item:hover .gallery-delete-btn[b-gtu8t5m2p6] {
    opacity: 1;
}

/* AI button styling */
.ai-button[b-gtu8t5m2p6] {
    font-size: 12px;
    padding: 6px 16px;
}

.ai-button .spinner-border-sm[b-gtu8t5m2p6] {
    width: 12px;
    height: 12px;
    margin-right: 6px;
}

.no-images-message[b-gtu8t5m2p6] {
    text-align: center;
    padding: 24px;
    color: #999;
    font-size: 13px;
}

.form-group[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.form-group label[b-gtu8t5m2p6] {
    font-weight: 500;
    font-size: 12px;
    color: #666;
}

.generate-button-row[b-gtu8t5m2p6] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
}

/* Enhanced AI button styling */
[b-gtu8t5m2p6] .ai-button.e-primary {
    font-size: 14px;
    padding: 10px 24px;
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    border: none;
    color: white;
    font-weight: 500;
}

[b-gtu8t5m2p6] .ai-button.e-primary:hover:not(:disabled) {
    background: linear-gradient(135deg, #5a6fd6 0%, #6a4190 100%);
    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.4);
}

[b-gtu8t5m2p6] .ai-button.e-primary:disabled {
    background: #ccc;
    cursor: not-allowed;
}

.error-message[b-gtu8t5m2p6] {
    padding: 10px;
    background: #ffebee;
    color: #c62828;
    border-radius: 4px;
    font-size: 0.9em;
}

/* Accordion styling */
[b-gtu8t5m2p6] .e-accordion {
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    overflow: hidden;
}

[b-gtu8t5m2p6] .e-accordion .e-acrdn-item {
    border: none;
}

[b-gtu8t5m2p6] .e-accordion .e-acrdn-item .e-acrdn-header {
    background: #fafafa;
    border-bottom: 1px solid #e0e0e0;
    padding: 12px 16px;
}

[b-gtu8t5m2p6] .e-accordion .e-acrdn-item.e-select .e-acrdn-header {
    background: #f0f7ff;
    border-color: #90caf9;
}

[b-gtu8t5m2p6] .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content {
    padding: 16px;
    background: white;
}

.accordion-header[b-gtu8t5m2p6] {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 500;
    font-size: 14px;
    color: #333;
}

.accordion-icon[b-gtu8t5m2p6] {
    font-size: 16px;
}

/* AI Generation Content */
.ai-generation-content[b-gtu8t5m2p6] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Upload Content */
.upload-content[b-gtu8t5m2p6] {
    padding: 8px 0;
}

/* Image Context Textarea */
[b-gtu8t5m2p6] .image-context-textarea {
    min-height: 120px;
}

[b-gtu8t5m2p6] .image-context-textarea textarea {
    min-height: 120px;
    resize: vertical;
}

/* Field Label (matching ProductMainCard style) */
.field-label[b-gtu8t5m2p6] {
    font-size: 12px;
    font-weight: 500;
    color: #666;
    margin-bottom: 2px;
}

/* /Shared/Components/Product/ProductSingleCard.razor.rz.scp.css */
[b-horh0dr62q] .HeaderButton {
    background: rgba(255, 255, 255, 0.7);
    height: 4em;
    right: 1.0667em;
    position: absolute;
    bottom: 3.2em;
    width: 20em;
    font-size: large;
    color: #000000;
}

.HeaderImageHeight[b-horh0dr62q] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*Category Header*/
.e-listview .e-list-group-item .buttonPosition[b-horh0dr62q] {
    top: 0.5em;
    right: 0.5em;
    position: absolute;
}

#List .ProductNumber[b-horh0dr62q] {
    font-size: medium;
    padding-top: 5px;
    padding-left: 0.6em;
}

#List .ProductPrice[b-horh0dr62q] {
    font-size: small;
    padding-top: 20px;
    font-weight: 400;
}

#List .ProductDescription[b-horh0dr62q] {
    width: 98%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
    font-size: large;
    padding-top: 2px;
    padding-left: 0.6em;
}

#List .ProductName[b-horh0dr62q] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    font-size: large;
    padding-top: 5px;
    padding-left: 0.6em;
}

[b-horh0dr62q] .e-card .e-card-content {
    padding: 0;
    margin: 0; 
}

[b-horh0dr62q] .e-priceButtonWidth {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    height: 2rem;
    color: #6c757d;
    margin-top: 12px;
}

/*Sflistview row layout*/
#wrapper[b-horh0dr62q] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
}

#left[b-horh0dr62q] {
    height: 65px;
}

#Center[b-horh0dr62q] {
    text-align: left;
    height: 65px;
}

#right[b-horh0dr62q] {
    height: 65px;
}

.CardMargin[b-horh0dr62q] {
    padding-bottom: 10px;
}



[b-horh0dr62q] .e-dialog {
    max-height: 100%;
    max-width: 100%;
    min-width: 240px;
    position: absolute;
}

.line[b-horh0dr62q] {
    width: 112px;
    height: 47px;
    border-bottom: 1px solid black;
    position: absolute;
}

.Title[b-horh0dr62q] {
    background: rgba(0, 0, 0, 0.4);
    padding: 20px 40px;
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 700;
}

[b-horh0dr62q] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

[b-horh0dr62q] #MenyButtonGroup .e-btn {
    background-color: #FFFFFF;
    border-color: #cccccc;
    color: #6c757d;
}

    [b-horh0dr62q] #MenyButtonGroup .e-btn:hover {
        background-color: #DCDCDC;
        border-color: #cccccc;
        color: #6c757d;
    }

    [b-horh0dr62q] #MenyButtonGroup .e-btn:focus {
        background-color: #808080;
        border-color: #cccccc;
        color: #FFFFFF;
    }

    [b-horh0dr62q] #MenyButtonGroup .e-btn:active {
        background-color: #808080;
        border-color: #cccccc;
        color: #FFFFFF;
    }

[b-horh0dr62q] #MenyButtonGroup .e-select {
    background-color: #808080 !important;
    border-color: #cccccc;
    color: #FFFFFF;
}

.grid-container[b-horh0dr62q] {
    display: grid;
    grid-template-columns: auto auto;
    padding: 10px;
    font-size: 14px;
}

.grid-item-left[b-horh0dr62q] {
    font-size: small;
    text-align: left;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-right[b-horh0dr62q] {
    font-size: small;
    text-align: right;
    border-bottom: 2px solid #cccccc;
    color: #202020;
    font-size: smaller;
    padding-bottom: 5px;
    padding-top: 5px;
}

.grid-item-wide-Span-2[b-horh0dr62q] {
    grid-column: span 2;
    margin-left: 0;
    padding-bottom: 20px;
}
/* /Shared/Components/Product/ProductSingleCardV2.razor.rz.scp.css */
/* General Styles */

.HeaderButton[b-5qt0j52vfw] {
    background: rgba(255, 255, 255, 0.7);
    height: 4em;
    right: 1.0667em;
    position: absolute;
    bottom: 3.2em;
    width: 20em;
    font-size: large;
    color: #000000;
}

.HeaderImageHeight[b-5qt0j52vfw] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Category Header */
.e-listview .e-list-group-item .buttonPosition[b-5qt0j52vfw] {
    top: 0.5em;
    right: 0.5em;
    position: absolute;
}

/* Product List Styles */
#List .ProductNumber[b-5qt0j52vfw] {
    font-size: medium;
    padding-top: 5px;
    padding-left: 0.6em;
}

#List .ProductPrice[b-5qt0j52vfw] {
    font-size: small;
    padding-top: 20px;
    font-weight: 400;
}

#List .ProductDescription[b-5qt0j52vfw] {
    width: 98%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
    padding-top: 2px;
    padding-left: 0.6em;
}

#List .ProductName[b-5qt0j52vfw] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    padding-top: 5px;
    padding-left: 0.6em;
}


[b-5qt0j52vfw] .e-card .e-card-content {
    padding: 0;
    margin: 0;
}

/* Button Styles */
[b-5qt0j52vfw] .e-priceButtonWidth {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    height: 2rem;
    color: #6c757d;
    margin-top: 12px;
}

/* Sflistview row layout */
#wrapper[b-5qt0j52vfw] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
}

#left[b-5qt0j52vfw], #Center[b-5qt0j52vfw], #right[b-5qt0j52vfw] {
    height: 65px;
}

/* Dialog Styles */
[b-5qt0j52vfw] .e-dialog {
    max-height: 100%;
    max-width: 100%;
    min-width: 240px;
    position: absolute;
}

/* Other Styles */
.CardMargin[b-5qt0j52vfw] {
    padding-bottom: 10px;
}

.line[b-5qt0j52vfw] {
    width: 112px;
    height: 47px;
    border-bottom: 1px solid black;
    position: absolute;
}

.Title[b-5qt0j52vfw] {
    background: rgba(0, 0, 0, 0.4);
    padding: 20px 40px;
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 700;
}

/* Image Card Styles */
.ImageCard[b-5qt0j52vfw] {
    position: relative;
    width: 100%;
    /* For square aspect ratio */
    padding-top: 100%; /* Set the padding-top to make the height equal to the width */
    margin-bottom: -10px; /* Remove margin to the bottom */
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

/*.ImageCard .content {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.5);
    color: #f1f1f1;
    padding: 20px;
}*/

.ImageCardTitle[b-5qt0j52vfw] {
    font-size: 18px;
    font-weight: 700;
}

[b-5qt0j52vfw] .ImageCardButton {
    background-color: rgba(0,0,0,0.5);
    border-color: #FFF;
    box-shadow: none;
    color: #FFF;
    font-weight: 500;
    margin: 10px;
    /*width: 280px;*/ 
}

.centered-button[b-5qt0j52vfw] {
    display: flex;
    justify-content: center;
    margin-bottom: 10px; 
}

.CardHeader[b-5qt0j52vfw] {
    font-size: small;
    color: #808080;
    margin: 5px;
    font-weight: 500;
}  
/* /Shared/Components/Queue/QueueCard.razor.rz.scp.css */

.Grid-wrapper[b-22opotrhxl] {
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: repeat(1, 1fr);
    margin-bottom: 15px;
    margin-left: 10px;
    margin-right: 10px;
}

.Grid-left[b-22opotrhxl] {
    text-align: left;
    grid-column: 1/1;
    padding: 0 2px;
}
/* /Shared/Components/SocialMedia/ImageOverlayEditor.razor.rz.scp.css */
.overlay-editor[b-162do9oce5] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.canvas-container[b-162do9oce5] {
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    background: #f5f5f5;
    border: 1px solid #e0e0e0;
}

.canvas-container canvas[b-162do9oce5] {
    display: block;
    width: 100%;
    height: auto;
}

.overlay-controls[b-162do9oce5] {
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
}

.no-overlays[b-162do9oce5] {
    text-align: center;
    padding: 30px 20px;
    background: #f9f9f9;
    border-radius: 8px;
    border: 2px dashed #e0e0e0;
}

.no-overlays p[b-162do9oce5] {
    color: #666;
    margin: 0 0 16px 0;
    font-size: 14px;
}

.btn-add-overlay[b-162do9oce5] {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 24px;
    background: #1976d2;
    color: #fff;
    border: none;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s;
}

.btn-add-overlay:hover[b-162do9oce5] {
    background: #1565c0;
}

.overlay-item[b-162do9oce5] {
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    margin-bottom: 12px;
    overflow: hidden;
    transition: border-color 0.2s;
}

.overlay-item.active[b-162do9oce5] {
    border-color: #1976d2;
    box-shadow: 0 0 0 1px #1976d2;
}

.overlay-item-header[b-162do9oce5] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    background: #fafafa;
    cursor: pointer;
}

.overlay-preview-text[b-162do9oce5] {
    font-size: 14px;
    color: #333;
    font-weight: 500;
}

.btn-delete-overlay[b-162do9oce5] {
    background: none;
    border: none;
    color: #999;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s;
}

.btn-delete-overlay:hover[b-162do9oce5] {
    background: #ffebee;
    color: #d32f2f;
}

.overlay-item-controls[b-162do9oce5] {
    padding: 14px;
    border-top: 1px solid #e0e0e0;
}

.control-group[b-162do9oce5] {
    margin-bottom: 14px;
}

.control-group label[b-162do9oce5] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #666;
    margin-bottom: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.control-group.half[b-162do9oce5] {
    flex: 1;
}

.control-row[b-162do9oce5] {
    display: flex;
    gap: 12px;
}

.text-input[b-162do9oce5] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 14px;
    transition: border-color 0.2s;
}

.text-input:focus[b-162do9oce5] {
    outline: none;
    border-color: #1976d2;
}

/* Position Grid */
.position-grid[b-162do9oce5] {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 6px;
    max-width: 150px;
}

.position-grid .pos-btn:nth-child(4)[b-162do9oce5] {
    grid-column: 1 / 4;
    max-width: calc(33.33% - 4px);
    margin: 0 auto;
}

.pos-btn[b-162do9oce5] {
    width: 40px;
    height: 40px;
    border: 1px solid #e0e0e0;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    color: #666;
    transition: all 0.2s;
}

.pos-btn:hover[b-162do9oce5] {
    border-color: #1976d2;
    color: #1976d2;
}

.pos-btn.active[b-162do9oce5] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

/* Range Input */
input[type="range"][b-162do9oce5] {
    width: 100%;
    height: 6px;
    border-radius: 3px;
    background: #e0e0e0;
    outline: none;
    -webkit-appearance: none;
}

input[type="range"][b-162do9oce5]::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #1976d2;
    cursor: pointer;
}

.range-value[b-162do9oce5] {
    display: inline-block;
    font-size: 12px;
    color: #666;
    margin-top: 4px;
}

/* Color Input */
input[type="color"][b-162do9oce5] {
    width: 100%;
    height: 36px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    padding: 2px;
}

/* Select */
select[b-162do9oce5] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    font-size: 13px;
    background: #fff;
    cursor: pointer;
}

select:focus[b-162do9oce5] {
    outline: none;
    border-color: #1976d2;
}

/* Add More Button */
.btn-add-more[b-162do9oce5] {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 10px;
    background: #f5f5f5;
    border: 1px dashed #ccc;
    border-radius: 6px;
    color: #666;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
    margin-bottom: 16px;
}

.btn-add-more:hover[b-162do9oce5] {
    border-color: #1976d2;
    color: #1976d2;
    background: #e3f2fd;
}

/* Preset Templates */
.preset-templates[b-162do9oce5] {
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
}

.preset-templates label[b-162do9oce5] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #666;
    margin-bottom: 10px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.preset-buttons[b-162do9oce5] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.preset-btn[b-162do9oce5] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 20px;
    font-size: 12px;
    color: #555;
    cursor: pointer;
    transition: all 0.2s;
}

.preset-btn:hover[b-162do9oce5] {
    border-color: #1976d2;
    color: #1976d2;
    background: #e3f2fd;
}

.preset-btn i[b-162do9oce5] {
    font-size: 11px;
}

/* Responsive - already column layout, no changes needed */
/* /Shared/Components/SocialMedia/PostEditor.razor.rz.scp.css */
.post-editor[b-a49zn9lt93] {
    max-width: 900px;
    margin: 20px auto;
    background: #fff;
    border-radius: 4px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.06);
    border: 1px solid #e0e0e0;
    overflow: hidden;
}

.post-editor-header[b-a49zn9lt93] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    border-bottom: 1px solid #e0e0e0;
    background: #f5f5f5;
}

.post-editor-header h2[b-a49zn9lt93] {
    margin: 0;
    font-size: 16px;
    font-weight: 600;
    color: #333;
}

.close-btn[b-a49zn9lt93] {
    background: none;
    border: none;
    color: #666;
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
    padding: 4px;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    transition: background 0.2s;
}

.close-btn:hover[b-a49zn9lt93] {
    background: #e0e0e0;
    color: #333;
}

.post-editor-content[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px;
}

/* Image Section Row - horizontal layout with image and right panel */
.image-section-row[b-a49zn9lt93] {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 20px;
    align-items: flex-start;
}

/* Right panel containing label, caption, and toolbar */
.image-right-panel[b-a49zn9lt93] {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 280px;
}

/* Inline caption section */
.caption-inline[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.caption-inline label[b-a49zn9lt93] {
    font-weight: 500;
    font-size: 12px;
    color: #666;
}

.caption-inline .caption-editor[b-a49zn9lt93] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-family: inherit;
    resize: vertical;
    color: #333;
}

.caption-inline .hashtags-editor[b-a49zn9lt93] {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 13px;
    font-family: inherit;
    color: #333;
}

/* Separator between Feed and Story */
.image-section-separator[b-a49zn9lt93] {
    height: 2px;
    background: linear-gradient(to right, transparent, #e0e0e0, transparent);
    margin: 8px 0;
}

.image-section[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Image Preview Containers */
.image-preview-container[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex-shrink: 0;
    width: 300px;
    max-width: 300px;
}

/* Wrapper for image and overlay icon */
.image-wrapper[b-a49zn9lt93] {
    position: relative !important;
    display: block;
    width: 300px;
    height: auto;
    min-height: 300px;
    overflow: visible;
}

/* Story wrapper needs taller container for 9:16 aspect */
.story-preview .image-wrapper[b-a49zn9lt93] {
    height: auto;
    min-height: auto;
}

.image-wrapper > .image-prompt-info[b-a49zn9lt93] {
    position: absolute !important;
    top: 8px !important;
    right: 8px !important;
    bottom: auto !important;
    left: auto !important;
}

.image-preview-label[b-a49zn9lt93] {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    color: #333;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 8px 12px;
    background: #f0f4f8;
    border-radius: 4px;
    margin-bottom: 8px;
}

.image-preview-label i[b-a49zn9lt93] {
    font-size: 14px;
    color: #1976d2;
}

.platform-hint[b-a49zn9lt93] {
    font-size: 10px;
    font-weight: 400;
    color: #888;
    text-transform: none;
    margin-left: auto;
}

/* Feed Image (1:1 square) */
.feed-image[b-a49zn9lt93] {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

/* Story Preview Container */
.story-preview[b-a49zn9lt93] {
    /* No extra styling needed - separator is handled by .image-section-separator */
}

/* Story Image (9:16 vertical) - scaled down */
.story-image-fix[b-a49zn9lt93] {
    width: 100%;
    aspect-ratio: 9/16;
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Image Toolbar - Light theme matching idea cards */
.image-toolbar[b-a49zn9lt93] {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

/* Horizontal toolbar on right side of images */
.image-toolbar-vertical[b-a49zn9lt93] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
}

/* Image type label at top of toolbar */
.image-type-label[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 12px;
    background: #f5f5f5;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    margin-bottom: 4px;
}

.image-type-title[b-a49zn9lt93] {
    font-size: 14px;
    font-weight: 600;
    color: #333;
}

.image-type-label .platform-hint[b-a49zn9lt93] {
    font-size: 11px;
    color: #666;
    margin-left: 0;
}

.toolbar-btn[b-a49zn9lt93] {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 14px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    cursor: pointer;
    color: #555;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.toolbar-btn:hover[b-a49zn9lt93] {
    border-color: #1976d2;
    color: #1976d2;
    background: #f5f9ff;
}

.toolbar-btn.active[b-a49zn9lt93] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.toolbar-btn i[b-a49zn9lt93] {
    font-size: 13px;
}

/* Overlay controls section - now in right panel */
.overlay-controls-section[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 12px;
    background: #f8f9fa;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
}

/* Done button in overlay editor */
.done-btn[b-a49zn9lt93] {
    background: #2e7d32 !important;
    border-color: #2e7d32 !important;
    color: #fff !important;
    margin-top: 8px;
}

.done-btn:hover[b-a49zn9lt93] {
    background: #1b5e20 !important;
    border-color: #1b5e20 !important;
}

/* Base post image style - specific sizes in feed-image and story-image */
.post-image[b-a49zn9lt93] {
    object-fit: cover;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

/* Feed image must be fixed 300x300 square */
.post-image.feed-image[b-a49zn9lt93] {
    width: 300px !important;
    height: 300px !important;
    flex-shrink: 0;
}

.image-actions[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.action-btn[b-a49zn9lt93] {
    padding: 10px 16px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    cursor: pointer;
    font-size: 13px;
    transition: all 0.2s;
    text-align: center;
    font-weight: 500;
    color: #666;
}

.action-btn:hover[b-a49zn9lt93] {
    background: #f5f5f5;
    border-color: #1976d2;
    color: #1976d2;
}

.action-btn i[b-a49zn9lt93] {
    margin-right: 6px;
}

.upload-btn[b-a49zn9lt93] {
    position: relative;
    display: block;
}

.hidden-file-input[b-a49zn9lt93] {
    position: absolute;
    opacity: 0;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    cursor: pointer;
}

.caption-section[b-a49zn9lt93] {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.caption-section label[b-a49zn9lt93] {
    font-weight: 500;
    font-size: 12px;
    color: #666;
    margin-bottom: -4px;
}

.caption-editor[b-a49zn9lt93],
.hashtags-editor[b-a49zn9lt93] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    resize: vertical;
    color: #333;
}

.caption-editor:focus[b-a49zn9lt93],
.hashtags-editor:focus[b-a49zn9lt93] {
    outline: none;
    border-color: #1976d2;
    box-shadow: 0 0 0 2px rgba(25, 118, 210, 0.1);
}

.update-btn[b-a49zn9lt93] {
    padding: 8px 16px;
    background: #1976d2;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    font-size: 13px;
    transition: background 0.2s;
}

.update-btn:hover[b-a49zn9lt93] {
    background: #1565c0;
}

.update-btn i[b-a49zn9lt93] {
    margin-right: 6px;
}


.confidence-indicator[b-a49zn9lt93] {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px;
    background: #f5f5f5;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.confidence-label[b-a49zn9lt93] {
    font-weight: 500;
    font-size: 13px;
    color: #666;
}

.confidence-badge[b-a49zn9lt93] {
    padding: 4px 12px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 12px;
}

.confidence-high[b-a49zn9lt93] {
    background: #e8f5e9;
    color: #2e7d32;
}

.confidence-medium[b-a49zn9lt93] {
    background: #fff8e1;
    color: #f57f17;
}

.confidence-low[b-a49zn9lt93] {
    background: #ffebee;
    color: #c62828;
}

.post-editor-footer[b-a49zn9lt93] {
    display: flex;
    justify-content: space-between;
    padding: 16px 24px;
    border-top: 1px solid #e0e0e0;
    background: #fafafa;
}

.btn-cancel[b-a49zn9lt93] {
    padding: 10px 24px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    font-size: 13px;
    color: #666;
    transition: all 0.2s;
}

.btn-cancel:hover[b-a49zn9lt93] {
    background: #f5f5f5;
    color: #d32f2f;
}

.btn-cancel i[b-a49zn9lt93] {
    margin-right: 6px;
}

.btn-approve[b-a49zn9lt93] {
    padding: 10px 32px;
    background: #1976d2;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
}

.btn-approve:hover[b-a49zn9lt93] {
    background: #1565c0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-approve i[b-a49zn9lt93] {
    margin-right: 6px;
}

/* === Scheduling Section === */
.scheduling-section[b-a49zn9lt93] {
    grid-column: 1 / -1;
    padding: 16px;
    background: #f8f9fa;
    border-radius: 4px;
    border: 1px solid #e0e0e0;
}

.scheduling-toggle[b-a49zn9lt93] {
    display: flex;
    gap: 0;
    margin-bottom: 0;
}

.toggle-btn[b-a49zn9lt93] {
    flex: 1;
    padding: 10px 16px;
    background: #fff;
    border: 1px solid #e0e0e0;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    color: #666;
    transition: all 0.2s;
}

.toggle-btn:first-child[b-a49zn9lt93] {
    border-radius: 4px 0 0 4px;
    border-right: none;
}

.toggle-btn:last-child[b-a49zn9lt93] {
    border-radius: 0 4px 4px 0;
}

.toggle-btn:hover[b-a49zn9lt93] {
    background: #f5f5f5;
}

.toggle-btn.active[b-a49zn9lt93] {
    background: #1976d2;
    border-color: #1976d2;
    color: #fff;
}

.toggle-btn i[b-a49zn9lt93] {
    margin-right: 6px;
}

.schedule-picker[b-a49zn9lt93] {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #e0e0e0;
}

.schedule-inputs[b-a49zn9lt93] {
    display: flex;
    gap: 16px;
}

.schedule-field[b-a49zn9lt93] {
    flex: 1;
}

.schedule-field label[b-a49zn9lt93] {
    display: block;
    font-size: 12px;
    font-weight: 500;
    color: #666;
    margin-bottom: 6px;
}

.schedule-field input[b-a49zn9lt93] {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 14px;
    font-family: inherit;
    color: #333;
    background: #fff;
}

.schedule-field input:focus[b-a49zn9lt93] {
    outline: none;
    border-color: #1976d2;
}

.schedule-preview[b-a49zn9lt93] {
    margin-top: 12px;
    padding: 10px 12px;
    background: #e3f2fd;
    border-radius: 4px;
    font-size: 13px;
    color: #1565c0;
}

.schedule-preview i[b-a49zn9lt93] {
    margin-right: 6px;
}

.btn-schedule[b-a49zn9lt93] {
    padding: 10px 32px;
    background: #1565c0;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.2s;
}

.btn-schedule:hover[b-a49zn9lt93] {
    background: #0d47a1;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.btn-schedule:disabled[b-a49zn9lt93] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-schedule i[b-a49zn9lt93] {
    margin-right: 6px;
}

/* === Split Button Styling === */
.btn-publish-split[b-a49zn9lt93] {
    background: #2e7d32 !important;
    border: none !important;
    border-radius: 4px !important;
}

[b-a49zn9lt93] .btn-publish-split .e-split-btn {
    background: #2e7d32 !important;
    color: #fff !important;
    padding: 10px 24px !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    border: none !important;
    border-radius: 4px 0 0 4px !important;
}

[b-a49zn9lt93] .btn-publish-split .e-split-btn:hover {
    background: #1b5e20 !important;
}

[b-a49zn9lt93] .btn-publish-split .e-dropdown-btn {
    background: #1b5e20 !important;
    color: #fff !important;
    border: none !important;
    border-left: 1px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 0 4px 4px 0 !important;
    padding: 10px 12px !important;
}

[b-a49zn9lt93] .btn-publish-split .e-dropdown-btn:hover {
    background: #145214 !important;
}

[b-a49zn9lt93] .btn-publish-split .e-icon-btn {
    color: #fff !important;
}

/* Dropdown menu styling */
[b-a49zn9lt93] .e-dropdown-popup {
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    border: 1px solid #e0e0e0;
}

[b-a49zn9lt93] .e-dropdown-popup .e-item {
    padding: 10px 16px;
    font-size: 13px;
    color: #333;
}

[b-a49zn9lt93] .e-dropdown-popup .e-item:hover {
    background: #f5f5f5;
}

[b-a49zn9lt93] .e-dropdown-popup .e-item .e-menu-icon {
    margin-right: 8px;
    color: #666;
}

/* Schedule picker styling */
.schedule-picker-header[b-a49zn9lt93] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    font-weight: 500;
    color: #333;
}

.close-picker-btn[b-a49zn9lt93] {
    background: none;
    border: none;
    color: #666;
    font-size: 18px;
    cursor: pointer;
    padding: 4px 8px;
    border-radius: 4px;
}

.close-picker-btn:hover[b-a49zn9lt93] {
    background: #e0e0e0;
}

.btn-confirm-schedule[b-a49zn9lt93] {
    width: 100%;
    margin-top: 12px;
    padding: 10px 16px;
    background: #1976d2;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-weight: 500;
    font-size: 13px;
    transition: background 0.2s;
}

.btn-confirm-schedule:hover[b-a49zn9lt93] {
    background: #1565c0;
}

.btn-confirm-schedule:disabled[b-a49zn9lt93] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-confirm-schedule i[b-a49zn9lt93] {
    margin-right: 6px;
}

/* === Image Prompt Info Icon & Popover === */
.image-prompt-info[b-a49zn9lt93] {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 10;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.2s ease;
}

.image-prompt-info:hover[b-a49zn9lt93] {
    background: rgba(0, 0, 0, 0.7);
}

.prompt-info-icon[b-a49zn9lt93] {
    color: rgba(255, 255, 255, 0.95);
    font-size: 16px;
    cursor: pointer;
}

.prompt-info-icon:hover[b-a49zn9lt93] {
    color: #fff;
}

.prompt-popover[b-a49zn9lt93] {
    position: absolute;
    top: 30px;
    right: 0;
    width: 320px;
    max-height: 300px;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 6px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    z-index: 100;
    overflow: hidden;
}

.prompt-popover-header[b-a49zn9lt93] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 12px;
    background: #f5f5f5;
    border-bottom: 1px solid #e0e0e0;
    font-weight: 600;
    font-size: 13px;
    color: #333;
}

.prompt-popover-actions[b-a49zn9lt93] {
    display: flex;
    align-items: center;
    gap: 4px;
}

.copy-prompt-btn[b-a49zn9lt93] {
    background: none;
    border: none;
    color: #666;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
    border-radius: 4px;
    transition: all 0.2s ease;
}

.copy-prompt-btn:hover[b-a49zn9lt93] {
    background: #e0e0e0;
    color: #1976d2;
}

.copy-prompt-btn .fa-check[b-a49zn9lt93] {
    color: #2e7d32;
}

.close-popover[b-a49zn9lt93] {
    background: none;
    border: none;
    color: #666;
    cursor: pointer;
    font-size: 16px;
    padding: 2px 6px;
    border-radius: 4px;
}

.close-popover:hover[b-a49zn9lt93] {
    background: #e0e0e0;
}

.prompt-popover-content[b-a49zn9lt93] {
    padding: 12px;
    font-size: 12px;
    line-height: 1.5;
    color: #555;
    max-height: 240px;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-word;
}

@media (max-width: 768px) {
    .post-editor-content[b-a49zn9lt93] {
        grid-template-columns: 1fr;
        padding: 16px;
    }

    /* Stack image and right panel vertically on mobile */
    .image-section-row[b-a49zn9lt93] {
        flex-direction: column !important;
        flex-wrap: wrap !important;
        align-items: stretch;
    }

    /* Make image container full width on mobile */
    .image-preview-container[b-a49zn9lt93] {
        width: 100%;
        max-width: 100%;
    }

    .image-wrapper[b-a49zn9lt93] {
        width: 100%;
    }

    /* Feed image responsive on mobile */
    .post-image.feed-image[b-a49zn9lt93] {
        width: 100% !important;
        height: auto !important;
        aspect-ratio: 1/1;
    }

    /* Right panel full width below image */
    .image-right-panel[b-a49zn9lt93] {
        width: 100%;
        min-width: unset;
    }

    .confidence-indicator[b-a49zn9lt93] {
        grid-column: 1;
    }

    .post-editor-footer[b-a49zn9lt93] {
        flex-direction: column;
        gap: 10px;
    }

    .btn-cancel[b-a49zn9lt93],
    .btn-approve[b-a49zn9lt93] {
        width: 100%;
    }

    /* Schedule picker responsive */
    .schedule-inputs[b-a49zn9lt93] {
        flex-direction: column;
    }

    /* Prompt popover responsive */
    .prompt-popover[b-a49zn9lt93] {
        width: 280px;
        right: -8px;
    }
}
/* /Shared/Components/Start/AddressCard.razor.rz.scp.css */
.CardBottomMargin[b-7gvvag73tk] {
    padding-bottom: 10px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.CardBottomMargin[b-7gvvag73tk]  .e-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start !important;
    align-items: stretch;
}

[b-7gvvag73tk] .e-card .e-card-content {
    padding: 0;
    flex: 0 0 auto;
}

.address-card[b-7gvvag73tk] {
    padding: 16px 20px;
}

.card-title[b-7gvvag73tk] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 14px;
}

.address-content[b-7gvvag73tk] {
    padding: 10px 0;
}

.address-link[b-7gvvag73tk] {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease;
}

.address-link:hover[b-7gvvag73tk] {
    color: #32a852;
}

.address-icon[b-7gvvag73tk] {
    font-size: 1.2rem;
    color: #32a852;
    margin-top: 2px;
}

.address-text[b-7gvvag73tk] {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.street[b-7gvvag73tk] {
    font-size: 1rem;
    font-weight: 500;
}

.city[b-7gvvag73tk] {
    font-size: 0.95rem;
    color: #666;
}

@media (max-width: 480px) {
    .address-card[b-7gvvag73tk] {
        padding: 14px 16px;
    }

    .street[b-7gvvag73tk] {
        font-size: 0.95rem;
    }

    .city[b-7gvvag73tk] {
        font-size: 0.9rem;
    }
}
/* /Shared/Components/Start/ImageCard.razor.rz.scp.css */
[b-jvq3nau58n] .e-card .e- {
    padding: 0px;
}

[b-jvq3nau58n] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

.CardBottomMargin[b-jvq3nau58n] {
    padding-bottom: 10px;
}

.HeaderImageHeight[b-jvq3nau58n] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}
/* /Shared/Components/Start/LandingFullStretchedImage.razor.rz.scp.css */
[b-y0x29mm8vd] .e-card {
    padding: 0px;
    height: 100vh; /* Full viewport height */
    top: 0;
    left: 0;
}

[b-y0x29mm8vd] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/3afdf115-bdb5-4375-b8da-f0a4bb426956.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 100vh; /* Full viewport height */
}

.CardBottomMargin[b-y0x29mm8vd] {
    padding-bottom: 10px;
}

.HeaderImageHeight[b-y0x29mm8vd] {
    height: 100%; /* Adjust to full height */
    display: flex;
    flex-direction: column; /* Arrange children in a column */
    justify-content: center;
    align-items: center;
}

.Title[b-y0x29mm8vd] {
    color: white;
    font-size: 2rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}

.Logo[b-y0x29mm8vd] {
    max-width: 80%;  /* Adjust the width as needed */
    max-height: 80%; /* Adjust the height as needed */
    object-fit: contain;
    margin-top: 20px
}
/* /Shared/Components/Start/OpeningHoursCard.razor.rz.scp.css */
/* OpeningHoursCard - follows existing design system */

.CardBottomMargin[b-6eyj3pw6yw] {
    padding-bottom: 10px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.CardBottomMargin[b-6eyj3pw6yw]  .e-card {
    flex: 1;
}

[b-6eyj3pw6yw] .e-card .e-card-content {
    padding: 0;
}

.opening-hours-card[b-6eyj3pw6yw] {
    padding: 16px 20px;
}

.card-title[b-6eyj3pw6yw] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 14px;
}

/* Weekly Schedule */
.weekly-schedule[b-6eyj3pw6yw] {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.day-row[b-6eyj3pw6yw] {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.95rem;
    color: #555;
    padding: 6px 0;
    border-bottom: 1px solid #f5f5f5;
}

.day-row:last-child[b-6eyj3pw6yw] {
    border-bottom: none;
}

.day-row .day-name[b-6eyj3pw6yw] {
    font-weight: 400;
}

.day-row .hours[b-6eyj3pw6yw] {
    font-weight: 400;
    color: #666;
}

.day-row.today[b-6eyj3pw6yw] {
    font-weight: 600;
    color: #333;
    background: #f9f9f9;
    margin: 0 -20px;
    padding: 6px 20px;
}

.day-row.today .day-name[b-6eyj3pw6yw] {
    font-weight: 600;
}

.day-row.today .hours[b-6eyj3pw6yw] {
    font-weight: 600;
    color: #333;
}

.day-row.closed .hours[b-6eyj3pw6yw] {
    color: #999;
    font-style: italic;
}

/* Exceptions Section */
.exceptions-section[b-6eyj3pw6yw] {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid #eee;
}

.section-title[b-6eyj3pw6yw] {
    font-size: 0.9rem;
    font-weight: 500;
    color: #666;
    margin-bottom: 10px;
}

.exception-row[b-6eyj3pw6yw] {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 0.9rem;
    color: #555;
    padding: 5px 0;
}

.exception-row .date[b-6eyj3pw6yw] {
    min-width: 50px;
    font-weight: 500;
    color: #444;
}

.exception-row .status[b-6eyj3pw6yw] {
    font-weight: 400;
}

.exception-row .reason[b-6eyj3pw6yw] {
    color: #888;
    font-style: italic;
    flex: 1;
    text-align: right;
}

/* Responsive */
@media (max-width: 480px) {
    .opening-hours-card[b-6eyj3pw6yw] {
        padding: 14px 16px;
    }

    .day-row[b-6eyj3pw6yw] {
        font-size: 0.9rem;
    }

    .day-row.today[b-6eyj3pw6yw] {
        margin: 0 -16px;
        padding: 6px 16px;
    }

    .exception-row[b-6eyj3pw6yw] {
        flex-wrap: wrap;
        gap: 6px;
    }

    .exception-row .reason[b-6eyj3pw6yw] {
        width: 100%;
        text-align: left;
        padding-left: 62px;
    }
}
/* /Shared/Components/Start/PhoneCard.razor.rz.scp.css */
.CardBottomMargin[b-yfo4ywrfnu] {
    padding-bottom: 10px;
    width: 100%;
    display: flex;
    flex-direction: column;
}

.CardBottomMargin[b-yfo4ywrfnu]  .e-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start !important;
    align-items: stretch;
}

[b-yfo4ywrfnu] .e-card .e-card-content {
    padding: 0;
    flex: 0 0 auto;
}

.phone-card[b-yfo4ywrfnu] {
    padding: 16px 20px;
}

.card-title[b-yfo4ywrfnu] {
    font-size: 1.1rem;
    font-weight: 600;
    color: #333;
    margin-bottom: 14px;
}

.phone-content[b-yfo4ywrfnu] {
    padding: 10px 0;
}

.phone-link[b-yfo4ywrfnu] {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #333;
    text-decoration: none;
    font-size: 1.2rem;
    font-weight: 500;
    transition: color 0.2s ease;
}

.phone-link:hover[b-yfo4ywrfnu] {
    color: #32a852;
}

.phone-icon[b-yfo4ywrfnu] {
    font-size: 1.1rem;
    color: #32a852;
}

.phone-number[b-yfo4ywrfnu] {
    letter-spacing: 0.5px;
}

@media (max-width: 480px) {
    .phone-card[b-yfo4ywrfnu] {
        padding: 14px 16px;
    }

    .phone-link[b-yfo4ywrfnu] {
        font-size: 1.1rem;
    }
}
/* /Shared/Components/Start/ProductListView.razor.rz.scp.css */
/* ProductListView component styles - cleaned and improved for better UX */

:global(:root)[b-55gh7x14hl] {
    --product-name-size: 2.325rem;
    --product-secondary-size: 0.95rem;
    --product-desc-size: 0.9rem;
    --muted-color: #6c757d;
}

/* --- Floating edit button --- */
.product-view-wrapper[b-55gh7x14hl] {
    position: relative;
    width: 100%;
}

.product-view-wrapper:hover .floating-edit-btn[b-55gh7x14hl] {
    opacity: 1;
}

.floating-edit-btn[b-55gh7x14hl] {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #32a852;
    border: none;
    color: white;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 1000;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

.floating-edit-btn:hover[b-55gh7x14hl] {
    transform: scale(1.1);
    background-color: #28a745;
}

.floating-edit-btn .e-icons[b-55gh7x14hl] {
    font-size: 16px;
}

/* --- Card & Header --- */
.CardMargin[b-55gh7x14hl] {
    padding-bottom: 10px;
    width: 100%;
}

.CardBottomMargin[b-55gh7x14hl] { /* kept for compatibility */
    padding-bottom: 20px;
}

[b-55gh7x14hl] .e-card .e-card-content {
    padding: 0;
}

.HeaderImageHeight[b-55gh7x14hl] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.Title[b-55gh7x14hl] {
    background: rgba(0, 0, 0, 0.4);
    padding: 20px 40px;
    color: #fff;
    font-size: 48px;
    font-weight: 700;
}

/* --- ListView selection override --- */
[b-55gh7x14hl] .e-listview .e-list-item.e-active,
[b-55gh7x14hl] .e-listview .e-list-item.e-focused,
[b-55gh7x14hl] .e-listview .e-list-item:focus,
[b-55gh7x14hl] .e-listview .e-list-item.e-hover,
[b-55gh7x14hl] .e-listview .e-list-item:hover {
    background-color: transparent !important;
    color: inherit !important;
}

[b-55gh7x14hl] .e-listview .e-list-item.e-active::before,
[b-55gh7x14hl] .e-listview .e-list-item.e-focused::before {
    background: transparent !important;
}

/* --- ListView / Row layout --- */
#wrapper[b-55gh7x14hl] {
    width: 100%;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-auto-rows: auto; /* let each row size to its content */
}

#left[b-55gh7x14hl], #Center[b-55gh7x14hl], #right[b-55gh7x14hl] {
    min-height: 65px; /* baseline height, but will grow if content needs more space */
}

#Center[b-55gh7x14hl] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    justify-content: flex-start; /* align items at top so title aligns with left column */
    padding: 8px 0 8px 10px; /* top, right, bottom, left */
    gap: 2px; /* reduced space between name and secondary name */
    text-align: left;
    align-items: flex-start;
}

#left[b-55gh7x14hl], #right[b-55gh7x14hl] {
    display: flex;
    align-items: center;
}

#left[b-55gh7x14hl] {
    padding-left: 0.6em;
}

#left[b-55gh7x14hl], #right[b-55gh7x14hl] {
    display: flex;
}

#left[b-55gh7x14hl] {
    align-items: flex-start;
    padding-left: 0.6em;
    padding-top: 8px;
}
/* align left column to top and match center's top padding */
#right[b-55gh7x14hl] {
    align-items: center;
}

#List .ProductNumber[b-55gh7x14hl] {
    font-size: 0.95rem;
    margin: 0;
}

/* New provided styles mapped to component */
.main-title[b-55gh7x14hl] {
    font-weight: 550;
    /* Use direct font-size to avoid scoping issues with CSS variables in isolated CSS */
    font-size: 1.00rem;
    color: #000;
    margin: 0 0 0 0; /* remove bottom margin to tighten with secondary name */
}

.second-title[b-55gh7x14hl] {
    font-weight: 400;
    font-size: 14px;
    color: #666;
    margin: 0 0 10px 0; /* increased bottom margin to create larger gap to description */
}

.description[b-55gh7x14hl] {
    font-size: 14px;
    color: #555;
    line-height: 1.4;
    margin: 0 0 8px 0;
}

#List .ProductPrice[b-55gh7x14hl] {
    font-size: 0.95rem;
    padding-top: 0;
    font-weight: 400;
    color: var(--muted-color);
    margin: 0;
}

[b-55gh7x14hl] .e-priceButtonWidth {
    background: rgba(255, 255, 255, 0.85);
    width: 3.6rem;
    height: 2.1rem;
    color: var(--muted-color);
    margin-top: 0.25rem; /* small offset to visually align with text */
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    font-size: 0.95rem;
}

.e-listview .e-list-group-item .buttonPosition[b-55gh7x14hl] {
    top: 0.5em;
    right: 0.5em;
    position: absolute;
}

[b-55gh7x14hl] #MenyButtonGroup .e-btn {
    background-color: #fff;
    border-color: #cccccc;
    color: var(--muted-color);
}

    [b-55gh7x14hl] #MenyButtonGroup .e-btn:hover {
        background-color: #DCDCDC;
    }

    [b-55gh7x14hl] #MenyButtonGroup .e-btn:focus, [b-55gh7x14hl] #MenyButtonGroup .e-btn:active {
        background-color: #808080;
        color: #fff;
    }

[b-55gh7x14hl] #MenyButtonGroup .e-select {
    background-color: #808080 !important;
    color: #fff;
}

[b-55gh7x14hl] .e-dialog {
    max-height: 100%;
    max-width: 100%;
    min-width: 240px;
    position: absolute;
}

[b-55gh7x14hl] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png") no-repeat center center / cover;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
}

.line[b-55gh7x14hl] {
    width: 112px;
    height: 47px;
    border-bottom: 1px solid #000;
    position: absolute;
}

/* Sushi chips - larger pill design for better touch targets */
[b-55gh7x14hl] .sushi-list {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.45rem !important; /* slightly larger gap */
    padding-top: 8px !important;
    padding-bottom: 12px !important;
    align-items: center !important;
}

[b-55gh7x14hl] .sushi-chip {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
    border: 1px solid #e5e7eb !important;
    padding: 0.22rem 0.6rem 0.32rem 0.6rem !important;
    border-radius: 999px !important;
    font-size: 1rem !important;
    color: #374151 !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03) !important;
}

@media (max-width: 480px) {
    #left[b-55gh7x14hl], #Center[b-55gh7x14hl], #right[b-55gh7x14hl] {
        height: auto;
    }

    #Center[b-55gh7x14hl] {
        padding-left: 8px;
    }

    [b-55gh7x14hl] .e-priceButtonWidth {
        width: 3rem;
        height: 1.9rem;
        font-size: 0.9rem;
    }

    [b-55gh7x14hl] .sushi-chip { font-size: 0.9rem !important; padding: 0.18rem 0.5rem 0.28rem 0.5rem !important; }
    [b-55gh7x14hl] .sushi-list { gap: 0.36rem !important; }
}
/* /Shared/ImageCard.razor.rz.scp.css */
.ImageCardTitle[b-2ca3u6ugaa] {
    font-size: 20px;
    font-weight: 700;
    /*padding-top: 50px;*/
}

.ImageCardPrice[b-2ca3u6ugaa] {
    font-size: larger;
    font-weight: 700;
    right: 1em;
    top: 12px;
    position: absolute;
}

.ImageCard[b-2ca3u6ugaa] {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/7d841ce9-4d80-4647-8f7d-9f8b243bd05d.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

.ImageCard .content[b-2ca3u6ugaa] {
    position: absolute; /* Position the background text */
    bottom: 5px; /* At the bottom. Use top:0 to append it to the top */
    background: rgb(0, 0, 0); /* Fallback color */
    background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
    color: #f1f1f1; /* Grey text */
    width: 100%; /* Full width */
    padding: 5px; /* Some padding */
}

[b-2ca3u6ugaa] .e-btn.e-outline, .e-css.e-btn.e-outline[b-2ca3u6ugaa] {
    background-color: rgba(0,0,0,0);
    border-color: #FFF;
    box-shadow: none;
    color: #FFF;
    margin: 2px;
    font-weight: 500;
    width: 180px;
}

.CardBottomMargin[b-2ca3u6ugaa] {
    padding-bottom: 10px;
}

[b-2ca3u6ugaa] .e-card .e-card-content {
    padding: 0px;
}

.e-priceButtonWidth[b-2ca3u6ugaa] {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    color: #6c757d;
    margin-top: 10px;
}
/* /Shared/ImageCardBunThitNuong.razor.rz.scp.css */
.ImageCardTitle[b-wg2sqpzhw3] {
    font-size: 20px;
    font-weight: 700;
    /*padding-top: 50px;*/
}

.ImageCardPrice[b-wg2sqpzhw3] {
    font-size: larger;
    font-weight: 700;
    right: 1em;
    top: 12px;
    position: absolute;
}

.ImageCard2[b-wg2sqpzhw3] {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/3392acd3-6617-4169-91c0-9bdb04bbcd4f.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

.ImageCard2 .content[b-wg2sqpzhw3] {
    position: absolute; /* Position the background text */
    bottom: 5px; /* At the bottom. Use top:0 to append it to the top */
    background: rgb(0, 0, 0); /* Fallback color */
    background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
    color: #f1f1f1; /* Grey text */
    width: 100%; /* Full width */
    padding: 5px; /* Some padding */
}

[b-wg2sqpzhw3] .ImageCardButton {
    background-color: rgba(0,0,0,0);
    border-color: #FFF;
    box-shadow: none;
    color: #FFF;
    font-weight: 500;
    margin: 2px;
    width: 280px;
}

.CardBottomMargin[b-wg2sqpzhw3] {
    padding-bottom: 10px;
}

[b-wg2sqpzhw3] .e-card .e-card-content {
    padding: 0px;
}

.e-priceButtonWidth[b-wg2sqpzhw3] {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    color: #6c757d;
    margin-top: 10px;
}
/* /Shared/LogoCard.razor.rz.scp.css */

#LogoContent[b-zyo0xbjjuj] {
    padding-top: 1rem;
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.LogoTitle[b-zyo0xbjjuj] {
    padding-left: 5px;
    font-size: large;
    font-weight: 500;
}

.container[b-zyo0xbjjuj] {
    width: 100%;
    padding-top: 20px; 
}

.center[b-zyo0xbjjuj] {
    margin: auto;
    display: block;
}
/* /Shared/MainLayout.razor.rz.scp.css */
.page[b-5b27zmpcxc] {
    position: relative;
    display: flex;
    flex-direction: column;
}

.main[b-5b27zmpcxc] {
    flex: 1;
}

.sidebar[b-5b27zmpcxc] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
}

.top-row[b-5b27zmpcxc] {
    background-color: #f7f7f7;
    border-bottom: 1px solid #d6d5d5;
    justify-content: flex-end;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

    .top-row[b-5b27zmpcxc]  a, .top-row .btn-link[b-5b27zmpcxc] {
        white-space: nowrap;
        margin-left: 1.5rem;
    }

    .top-row a:first-child[b-5b27zmpcxc] {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row:not(.auth)[b-5b27zmpcxc] {
        display: none;
    }

    .top-row.auth[b-5b27zmpcxc] {
        justify-content: space-between;
    }

    .top-row a[b-5b27zmpcxc], .top-row .btn-link[b-5b27zmpcxc] {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-5b27zmpcxc] {
        flex-direction: row;
    }

    .sidebar[b-5b27zmpcxc] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .top-row[b-5b27zmpcxc] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .main > div[b-5b27zmpcxc] {
        /*padding-left: 2rem !important;*/
        padding-right: 1.5rem !important;
    }
}
/* /Shared/NavMenu.razor.rz.scp.css */
.navbar-toggler[b-v57n6p1647] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-v57n6p1647] {
    height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-v57n6p1647] {
    font-size: 1.1rem;
}

.oi[b-v57n6p1647] {
    width: 2rem;
    font-size: 1.1rem;
    vertical-align: text-top;
    top: -2px;
}

.nav-item[b-v57n6p1647] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-v57n6p1647] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-v57n6p1647] {
        padding-bottom: 1rem;
    }

    .nav-item[b-v57n6p1647]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
    }

.nav-item[b-v57n6p1647]  a.active {
    background-color: rgba(255,255,255,0.25);
    color: white;
}

.nav-item[b-v57n6p1647]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-v57n6p1647] {
        display: none;
    }

    .collapse[b-v57n6p1647] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }
}
/* /Shared/PokeBowl.razor.rz.scp.css */
.ImageCardTitle[b-0corq0m945] {
    font-size: 20px;
    font-weight: 700;
    /*padding-top: 50px;*/
}

.ImageCardPrice[b-0corq0m945] {
    font-size: larger;
    font-weight: 700;
    right: 1em;
    top: 12px;
    position: absolute;
}

.ImageCardPoke[b-0corq0m945] {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

.ImageCardPoke .content[b-0corq0m945] {
    position: absolute; /* Position the background text */
    bottom: 5px; /* At the bottom. Use top:0 to append it to the top */
    background: rgb(0, 0, 0); /* Fallback color */
    background: rgba(0, 0, 0, 0.5); /* Black background with 0.5 opacity */
    color: #f1f1f1; /* Grey text */
    width: 100%; /* Full width */
    padding: 5px; /* Some padding */
}

[b-0corq0m945] .e-btn.e-outline, .e-css.e-btn.e-outline[b-0corq0m945] {
    background-color: rgba(0,0,0,0);
    border-color: #FFF;
    box-shadow: none;
    color: #FFF;
    margin: 2px;
    font-weight: 500;
    width: 180px;
}

.CardPositionCenter[b-0corq0m945] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.CardBottomMargin[b-0corq0m945] {
    padding-bottom: 10px;
}

[b-0corq0m945] .e-card .e-card-content {
    padding: 0px;
}
/* /Shared/PricingSelectPrompt.razor.rz.scp.css */
.CardPositionCenter[b-t6ow5b4pmw] {
    display: flex;
    justify-content: center;
    align-items: center;
}

.Welcome[b-t6ow5b4pmw] {
    text-align: center;
    font-size: 4rem;
    color: #696969;
}

[b-t6ow5b4pmw] .PriceSelectionButton {
    background: #FFFFFF;
    color: #6c757d;
    text-align: left;
    height: 4rem;
    width: 10rem;
    margin-right: 5px;
}

[b-t6ow5b4pmw] .PriceSelectionButtonSelected {
    background: #28A745;
    color: #FFFFFF;
}

.fade-in-text-2[b-t6ow5b4pmw] {
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 150px;
    animation: fadeIn-b-t6ow5b4pmw linear 2s;
    -webkit-animation: fadeIn linear 2s;
    -moz-animation: fadeIn linear 2s;
    -o-animation: fadeIn linear 2s;
    -ms-animation: fadeIn linear 2s;
}

.fade-in-text-4[b-t6ow5b4pmw] {
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 150px;
    animation: fadeIn-b-t6ow5b4pmw linear 4s;
    -webkit-animation: fadeIn linear 4s;
    -moz-animation: fadeIn linear 4s;
    -o-animation: fadeIn linear 4s;
    -ms-animation: fadeIn linear 4s;
}

.fade-in-text-6[b-t6ow5b4pmw] {
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 150px;
    animation: fadeIn-b-t6ow5b4pmw linear 6s;
    -webkit-animation: fadeIn linear 6s;
    -moz-animation: fadeIn linear 6s;
    -o-animation: fadeIn linear 6s;
    -ms-animation: fadeIn linear 6s;
}

@keyframes fadeIn-b-t6ow5b4pmw {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-ms-keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
/* /Shared/ProductDetailDialog.razor.rz.scp.css */
#wrapper[b-35yw8arshl] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 50px auto 65px;
}

#left[b-35yw8arshl] {
    height: 65px;
}

#Center[b-35yw8arshl] {
    text-align: left;
    height: 65px;
}

#right[b-35yw8arshl] {
    height: 65px;
}

[b-35yw8arshl] .multilineHeight {
    height: 5em;
}

[b-35yw8arshl] .Pay {
    position: absolute;
    right: 15px;
}
/* /Shared/ProductKinnaMenuCard.razor.rz.scp.css */
[b-p1ts90zg81] .HeaderButton {
    background: rgba(255, 255, 255, 0.7);
    height: 4em;
    right: 1.0667em;
    position: absolute;
    bottom: 3.2em;
    width: 20em;
    font-size: large;
    color: #000000;
}

.HeaderImageHeight[b-p1ts90zg81] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*Category Header*/
.e-listview .e-list-group-item .buttonPosition[b-p1ts90zg81] {
    top: 0.5em;
    right: 0.5em;
    position: absolute;
}

#List .ProductNumber[b-p1ts90zg81] {
    font-size: large;
    padding-top: 5px;
    padding-left: 0.6em;
}

#List .ProductPrice[b-p1ts90zg81] {
    font-size: small;
    padding-top: 20px;
    font-weight: 400;
}

#List .ProductDescription[b-p1ts90zg81] {
    width: 98%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
    font-size: large;
    padding-top: 2px;
    padding-left: 0.6em;
}

#List .ProductName[b-p1ts90zg81] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    font-size: large;
    padding-top: 5px;
    padding-left: 0.6em;
}

[b-p1ts90zg81] .e-card .e-
{
    padding: 0px;
}

[b-p1ts90zg81] .e-priceButtonWidth {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    height: 2rem;
    color: #6c757d;
    margin-top: 12px;
}

/*Sflistview row layout*/
#wrapper[b-p1ts90zg81] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: 50px auto 65px;
}

#left[b-p1ts90zg81] {
    height: 65px;
}

#Center[b-p1ts90zg81] {
    text-align: left;
    height: 65px;
}

#right[b-p1ts90zg81] {
    height: 65px;
}

.CardBottomMargin[b-p1ts90zg81] {
    padding-bottom: 10px;
}



[b-p1ts90zg81] .e-dialog {
    max-height: 100%;
    max-width: 100%;
    min-width: 240px;
    position: absolute;
}

.line[b-p1ts90zg81] {
    width: 112px;
    height: 47px;
    border-bottom: 1px solid black;
    position: absolute;
}

.Title[b-p1ts90zg81] {
    background: rgba(0, 0, 0, 0.4);
    padding: 20px 40px; 
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 700;

}

[b-p1ts90zg81] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}

[b-p1ts90zg81] #MenyButtonGroup .e-btn {
    background-color: #FFFFFF;
    border-color: #cccccc;
    color: #6c757d;
}

[b-p1ts90zg81] #MenyButtonGroup .e-btn:hover {
    background-color: #DCDCDC;
    border-color: #cccccc;
    color: #6c757d;
}

[b-p1ts90zg81] #MenyButtonGroup .e-btn:focus {
    background-color: #808080;
    border-color: #cccccc;
    color: #FFFFFF;
}

[b-p1ts90zg81] #MenyButtonGroup .e-btn:active {
    background-color: #808080;
    border-color: #cccccc;
    color: #FFFFFF;
}

[b-p1ts90zg81] #MenyButtonGroup .e-select {
    background-color: #808080 !important;
    border-color: #cccccc;
    color: #FFFFFF;
} 
/* /Shared/ProductList.razor.rz.scp.css */
[b-nsbort3wpf] .HeaderButton {
    background: rgba(255, 255, 255, 0.7);
    height: 4em;
    right: 1.0667em;
    position: absolute;
    bottom: 3.2em;
    width: 20em;
    font-size: large;
    color: #000000;
}

.HeaderImageHeight[b-nsbort3wpf] {
    height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/*Category Header*/
.e-listview .e-list-group-item .buttonPosition[b-nsbort3wpf] {
    right: 1em;
    position: absolute;
}

#List .ProductNumber[b-nsbort3wpf] {
    font-size: large;
    padding-top: 5px;
    padding-left: 0.6em;
}

#List .ProductPrice[b-nsbort3wpf] {
    font-size: small;
    padding-top: 20px;
    font-weight: 400;
}

#List .ProductDescription[b-nsbort3wpf] {
    width: 98%;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 12px !important;
    font-size: large;
    padding-top: 2px;
    padding-left: 0.6em;
}

#List .ProductName[b-nsbort3wpf] {
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 14px !important;
    font-weight: 700;
    font-size: large;
    padding-top: 5px;
    padding-left: 0.6em;
}

[b-nsbort3wpf] .e-card .e-card-content {
    padding: 0px;
}

[b-nsbort3wpf] .e-priceButtonWidth {
    background: rgba(255, 255, 255, 0.7);
    width: 3.5rem;
    height: 2rem;
    color: #6c757d;
    margin-top: 10px;
    margin-bottom: 10px;
}

/*Sflistview row layout*/
#wrapper[b-nsbort3wpf] {
    width: auto;
    height: auto;
    box-sizing: border-box;
    display: grid;
    grid-auto-flow: row;
    grid-template-columns: auto 65px;
}

#left[b-nsbort3wpf] {

}

#Center[b-nsbort3wpf] {
    text-align: left;

}

#right[b-nsbort3wpf] {

}

.CardBottomMargin[b-nsbort3wpf] {
    padding-bottom: 10px;
}

[b-nsbort3wpf] .e-dialog {
    max-height: 100%;
    max-width: 100%;
    min-width: 240px;
    position: absolute;
}

.line[b-nsbort3wpf] {
    width: 112px;
    height: 47px;
    border-bottom: 1px solid black;
    position: absolute;
}

.Title[b-nsbort3wpf] {
    background: rgba(0, 0, 0, 0.4);
    padding: 20px 40px; 
    color: #FFFFFF;
    font-size: 48px;
    font-weight: 700;

}

[b-nsbort3wpf] .ImageCard {
    background: url("https://storageaccountqonnect.blob.core.windows.net/web/fc3eeb7b-f3c8-46ca-b1c5-1d79c16fb1c4.png");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    height: 450px;
    left: 0;
    bottom: 0;
    width: 100%;
    /*padding-top: 50px;*/
}
/* /Shared/RestaurantFooter.razor.rz.scp.css */
.FooterBottom[b-wr7vrxbrkr] {
    padding-bottom: 20px;
}

[b-wr7vrxbrkr] .WelcomeCard {
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #4e4e4e;
    left: 0;
    bottom: 0;
    border-color: #ffffff;
}

.h4[b-wr7vrxbrkr], h4[b-wr7vrxbrkr] {
    font-size: 1.5rem;
    color: #f2f2f2;
}

.footer-icon[b-wr7vrxbrkr] {
    margin-right: 8px;
    opacity: 0.9;
}

.footerContent[b-wr7vrxbrkr] {
    padding: 0;
    margin: 0 auto;
    height: 5rem;
    color: #f2f2f2;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* DivTable.com */
.divTable[b-wr7vrxbrkr] {
    display: table;
    width: 65%;
    min-width: 250px;
    margin: 0 auto;
    padding-bottom: 1rem;
}

.divTableRow[b-wr7vrxbrkr] {
    display: table-row;
}

.divTableCell[b-wr7vrxbrkr], .divTableHead[b-wr7vrxbrkr] {
    border: 0px solid #999999;
    display: table-cell;
    padding: 3px 10px;
    font-family: Helvetica, 'Segoe UI' !important;
    font-size: 16px !important;
}

.divTableHeading[b-wr7vrxbrkr] {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot[b-wr7vrxbrkr] {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody[b-wr7vrxbrkr] {
    display: table-row-group;
}

/* Clickable links */
.footer-link[b-wr7vrxbrkr],
.footer-link:visited[b-wr7vrxbrkr],
.footer-link:link[b-wr7vrxbrkr] {
    color: #f2f2f2 !important;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.footer-link:hover[b-wr7vrxbrkr] {
    color: #ffffff !important;
    opacity: 0.8;
    text-decoration: underline;
}

.phone-content[b-wr7vrxbrkr] {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    font-size: 18px;
}

.address-link[b-wr7vrxbrkr] {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    line-height: 1.6;
    text-align: center;
}

/* /Shared/Welcome.razor.rz.scp.css */
<h3>Welcome.razor</h3>

@code[b-biozuy0if7] {

}