/* PDF Merge & Split */

.pms-container {
    width: 100%;
    max-width: var(--app-container-max);
    margin: 0 auto;
}

.pms-app:focus {
    outline: none;
}

.pms-app:focus-visible {
    box-shadow: var(--focus-ring);
    border-radius: var(--radius-md);
}

/* Privacy note (F5 — visible beside the file controls) */
.pms-privacy {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-3);
    margin-bottom: var(--space-4);
    background: var(--color-bg-alt);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
}

.pms-badge {
    display: inline-flex;
    align-items: center;
    padding: var(--space-1) var(--space-3);
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--color-success) 15%, transparent);
    color: var(--color-success-text);
    font-size: var(--font-size-xs);
    font-weight: 600;
    white-space: nowrap;
}

.pms-privacy-text {
    margin: 0;
    font-size: var(--font-size-sm);
    color: var(--color-text);
}

/* Drop zone (one affordance: click or drag-and-drop) */
.pms-drop-zone {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    min-height: 160px;
    padding: var(--space-6);
    text-align: center;
    border: 2px dashed var(--color-border-dark);
    border-radius: var(--radius-lg);
    background: var(--color-bg-alt);
    color: var(--color-text-muted);
    cursor: pointer;
    transition: border-color var(--transition-fast), background-color var(--transition-fast);
}

.pms-drop-zone:hover {
    border-color: var(--color-primary);
    background: var(--color-bg-alt);
}

.pms-drop-zone:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
    border-color: var(--color-primary);
}

.pms-drop-zone.is-dragover {
    border-color: var(--color-primary);
    background: color-mix(in srgb, var(--color-primary) 8%, var(--color-bg-alt));
}

.pms-drop-zone.is-disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.pms-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

.pms-drop-zone strong {
    font-size: var(--font-size-lg);
    color: var(--color-text);
}

.pms-choose-btn {
    display: inline-block;
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-full);
    background: var(--color-primary);
    color: var(--color-text-inverse);
    font-size: var(--font-size-sm);
    font-weight: 600;
}

/* File list */
.pms-list-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

.pms-list-header h2 {
    margin: 0;
    font-size: var(--font-size-lg);
}

.pms-file-list {
    list-style: none;
    margin: 0 0 var(--space-4);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.pms-file {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-card);
    cursor: grab;
}

.pms-file:active {
    cursor: grabbing;
}

.pms-file-grip {
    flex: 0 0 auto;
    color: var(--color-text-muted);
    font-size: var(--font-size-xs);
    user-select: none;
}

.pms-file-text {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.pms-file-name {
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.pms-file-meta {
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.pms-file-status {
    flex: 0 0 auto;
    min-width: 64px;
    text-align: right;
    font-size: var(--font-size-xs);
    font-weight: 600;
    color: var(--color-text-light);
}

.pms-file-status[data-status='error'] {
    color: var(--color-error-text);
}

.pms-file-status[data-status='parsing'],
.pms-file-status[data-status='queued'] {
    color: var(--color-warning-text);
}

.pms-file-actions {
    flex: 0 0 auto;
    display: flex;
    gap: var(--space-1);
}

.pms-btn-move,
.pms-btn-remove {
    width: 44px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--color-border);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: var(--font-size-base);
    cursor: pointer;
    transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);
}

.pms-btn-move:hover:not(:disabled),
.pms-btn-remove:hover {
    background: var(--color-bg-alt);
    border-color: var(--color-border-dark);
}

.pms-btn-move:active:not(:disabled),
.pms-btn-remove:active {
    transform: scale(0.98);
}

.pms-btn-move:focus-visible,
.pms-btn-remove:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

.pms-btn-move:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.pms-btn-remove {
    color: var(--color-error-text);
}

.pms-btn-remove:hover {
    background: color-mix(in srgb, var(--color-error) 10%, transparent);
    border-color: var(--color-error);
}

.pms-file-error {
    flex-basis: 100%;
    margin: var(--space-1) 0 0;
    padding: 0;
    font-size: var(--font-size-sm);
    color: var(--color-error-text);
}

.pms-file-empty {
    margin: 0 0 var(--space-4);
    font-size: var(--font-size-sm);
    color: var(--color-text-muted);
}

/* Mode toggle */
.pms-modes {
    display: flex;
    gap: var(--space-2);
    margin-bottom: var(--space-3);
}

.pms-mode {
    min-height: 44px;
    padding: var(--space-2) var(--space-5);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-full);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: var(--font-size-sm);
    font-weight: 600;
    cursor: pointer;
    transition: background-color var(--transition-fast), color var(--transition-fast), border-color var(--transition-fast), transform var(--transition-fast);
}

.pms-mode:hover {
    border-color: var(--color-primary);
}

.pms-mode:active {
    transform: scale(0.98);
}

.pms-mode:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

.pms-mode[aria-pressed='true'] {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-text-inverse);
}

/* Mode panels */
.pms-panel {
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    background: var(--color-bg-card);
}

.pms-panel > .btn {
    min-height: 44px;
}

.pms-extract-fields {
    display: grid;
    grid-template-columns: 1fr;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

.pms-field label {
    display: block;
    margin-bottom: var(--space-1);
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-text);
}

.pms-field select,
.pms-field input[type='text'] {
    width: 100%;
    min-height: 44px;
    padding: var(--space-2) var(--space-3);
    border: 1px solid var(--color-border-dark);
    border-radius: var(--radius-sm);
    background: var(--color-bg);
    color: var(--color-text);
    font-size: var(--font-size-sm);
}

.pms-field select:focus-visible,
.pms-field input[type='text']:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
    border-color: var(--color-primary);
}

.pms-field input[aria-invalid='true'] {
    border-color: var(--color-error);
}

.pms-range-hint {
    margin: var(--space-1) 0 0;
    font-size: var(--font-size-xs);
    color: var(--color-text-muted);
}

.pms-range-error {
    margin: var(--space-1) 0 0;
    font-size: var(--font-size-sm);
    color: var(--color-error-text);
}

.pms-panel-actions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-2);
}

/* Honesty warning (F6) */
.pms-warning {
    display: flex;
    gap: var(--space-2);
    padding: var(--space-3);
    margin: 0 0 var(--space-3);
    border: 1px solid color-mix(in srgb, var(--color-warning) 40%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--color-warning) 8%, transparent);
    color: var(--color-text);
    font-size: var(--font-size-sm);
}

.pms-warning-icon {
    flex: 0 0 auto;
    font-style: normal;
    font-weight: 700;
    color: var(--color-warning-text);
}

/* Progress + controls */
.pms-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--space-2);
    margin-bottom: var(--space-4);
}

.pms-progress {
    flex: 1 1 200px;
    font-size: var(--font-size-sm);
    font-weight: 600;
    color: var(--color-primary-text);
}

.pms-error-note {
    padding: var(--space-3);
    margin-bottom: var(--space-4);
    border: 1px solid color-mix(in srgb, var(--color-error) 40%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--color-error) 8%, transparent);
    color: var(--color-error-text);
    font-size: var(--font-size-sm);
}

/* Results */
.pms-results {
    padding: var(--space-4);
    margin-bottom: var(--space-4);
    border: 1px solid color-mix(in srgb, var(--color-success) 40%, transparent);
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--color-success) 6%, var(--color-bg-card));
}

.pms-results h2 {
    margin: 0 0 var(--space-2);
    font-size: var(--font-size-lg);
    color: var(--color-success-text);
}

.pms-result-list {
    list-style: none;
    margin: var(--space-3) 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.pms-result-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.pms-result-name {
    font-size: var(--font-size-sm);
    color: var(--color-text);
    word-break: break-all;
}

.pms-download {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: var(--space-2) var(--space-4);
    border-radius: var(--radius-full);
    background: var(--color-primary);
    color: var(--color-text-inverse);
    font-size: var(--font-size-sm);
    font-weight: 600;
    text-decoration: none;
    transition: background-color var(--transition-fast), transform var(--transition-fast);
}

.pms-download:hover {
    background: var(--color-primary-hover);
}

.pms-download:active {
    transform: scale(0.98);
}

.pms-download:focus-visible {
    outline: none;
    box-shadow: var(--focus-ring);
}

/* Screen-reader-only live region */
.pms-announcer {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
    border: 0;
}

/* Mobile-first single column: everything above is stacked; on wide screens
   keep file rows a single row and let the text column shrink (ellipsis). */
@media (min-width: 768px) {
    .pms-extract-fields {
        grid-template-columns: 1fr 1.4fr;
    }
}
