/* Resize Video Tool — extends trim/css/style.css with resize-specific controls */

.resize-buttons {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}

.resize-btn {
    flex: 1 1 100px;
    background: var(--color-bg-card);
    border: 1px solid var(--color-border);
    border-radius: 10px;
    color: #cbd5e1;
    padding: 14px 18px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 0.95rem;
    font-weight: 600;
    transition: all 0.15s ease;
}

.resize-btn:hover:not(:disabled) {
    border-color: var(--color-accent);
    color: #fff;
}

.resize-btn.active {
    background: var(--color-accent-subtle);
    border-color: var(--color-accent);
    color: var(--color-accent);
}

.resize-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}

.resize-current-inline {
    font-family: 'Outfit', system-ui, sans-serif;
    font-size: 0.8rem;
    color: #64748b;
    font-weight: 500;
    text-transform: none;
    letter-spacing: 0;
    margin-left: 8px;
}

@media (max-width: 600px) {
    .resize-buttons { gap: 8px; }
    .resize-btn { flex: 1 1 80px; padding: 12px 8px; }
}