/**
 * 处方历史样式
 */

.prescription-history-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 30px;
}

.prescription-history-table th,
.prescription-history-table td {
    padding: 12px;
    text-align: left;
    border-bottom: 1px solid var(--ep-border);
    vertical-align: top;
}

.prescription-history-table th {
    background-color: var(--ep-bg);
    font-weight: 600;
}

.prescription-record {
    margin-bottom: 5px;
}

/* 水平显示处方记录详情 */
.prescription-record-detail {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: flex-start;
}

.prescription-record-form {
    flex: 1 1 300px;
    min-width: 300px;
}

.prescription-record-pd {
    flex: 0 0 auto;
    margin: 8px 20px 8px 0;
    font-size: 14px;
    white-space: nowrap;
}

.prescription-record-type {
    flex: 0 0 auto;
    margin: 8px 20px 8px 0;
    padding: 3px 10px;
    background-color: var(--ep-brand-soft);
    border-radius: 4px;
    font-size: 14px;
    color: var(--ep-brand-dark);
    border-left: 3px solid var(--ep-brand);
}

.prescription-record-upload {
    flex: 0 0 auto;
    margin: 8px 0;
}

.prescription-record-note {
    flex: 1 1 100%;
    margin: 8px 0;
    padding: 10px;
    background-color: var(--ep-accent-soft);
    border-left: 3px solid var(--ep-accent);
    color: var(--ep-text);
    font-size: 14px;
}

.prescription-record-form table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
    font-size: 14px;
}

.prescription-record-form th,
.prescription-record-form td {
    border: 1px solid var(--ep-border-strong);
    padding: 5px 8px;
    text-align: center;
}

.prescription-record-form th {
    background-color: var(--ep-bg);
    font-weight: 500;
}

.prescription-record-upload a {
    display: inline-flex;
    align-items: center;
    padding: 5px 10px;
    background: var(--ep-bg);
    border: 1px solid var(--ep-border-strong);
    border-radius: var(--ep-radius-sm);
    text-decoration: none;
    color: var(--ep-brand-dark);
    font-size: 13px;
}

.prescription-record-upload a:hover {
    background: var(--ep-brand-soft);
}

.prescription-record-order {
    color: var(--ep-brand-dark);
    font-weight: 500;
    text-align: center;
    white-space: nowrap;
}

.prescription-record-order a {
    color: var(--ep-brand-dark);
    text-decoration: none;
    transition: color var(--ep-transition);
}

.prescription-record-order a:hover {
    color: var(--ep-brand);
    text-decoration: underline;
}

.prescription-record-date {
    color: var(--ep-text);
    font-size: 14px;
    text-align: center;
    white-space: nowrap;
}

.prescription-record-item {
    font-weight: 500;
}

.prescription-record-number {
    color: var(--ep-muted);
    font-weight: 600;
    text-align: center;
}

.empty-prescriptions {
    padding: 30px;
    text-align: center;
    background: var(--ep-bg);
    border-radius: var(--ep-radius-sm);
    color: var(--ep-text);
}

.prescription-record.type-mismatch {
    opacity: 0.6;
    background-color: var(--ep-bg);
}

.prescription-record.type-mismatch:hover {
    opacity: 0.8;
}

.prescription-type-notice {
    padding: 10px 15px;
    margin-bottom: 15px;
    background-color: var(--ep-brand-softer);
    border-left: 4px solid var(--ep-brand);
    color: var(--ep-brand-dark);
}

.prescription-record-actions {
    text-align: center;
    width: 100px;
}

.prescription-import-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 6px 12px;
    background-color: var(--ep-brand);
    color: #ffffff;
    border: none;
    border-radius: var(--ep-radius-sm);
    cursor: pointer;
    font-size: 13px;
    line-height: 1.3;
    transition: all var(--ep-transition);
}

.prescription-import-btn:hover {
    background-color: var(--ep-brand-dark);
}

.prescription-import-btn .dashicons {
    margin-right: 5px;
    font-size: 16px;
}

.prescription-import-btn[disabled],
.type-mismatch .prescription-import-btn {
    background-color: var(--ep-border-strong);
    color: var(--ep-text);
    cursor: not-allowed;
}

.dashicons.rotating {
    animation: spin 1.5s linear infinite;
}

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

@media screen and (max-width: 768px) {
    .prescription-record-detail {
        flex-direction: column;
    }

    .prescription-record-pd,
    .prescription-record-upload {
        margin: 10px 0;
    }

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