/* ========================================================
   AI Schedule Recommendations — skeleton loading + modals
   ======================================================== */

.ai-skeleton-bar {
    height: 12px;
    border-radius: 6px;
    background: linear-gradient(90deg, #e9ecef 25%, #f3f4f6 37%, #e9ecef 63%);
    background-size: 400% 100%;
    animation: ai-skeleton-shimmer 1.4s ease infinite;
}

@keyframes ai-skeleton-shimmer {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

.ai-generating-badge {
    background-color: #d1fae5;
    color: #065f46;
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.2rem 0.6rem;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.ai-generating-badge .dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #10b981;
    display: inline-block;
}

/* Non-blocking "Generating" toast — bottom-right, does not cover the screen */
.ai-generating-toast {
    background-color: #ffffff;
    border: 1px solid #e5e7eb;
}

/* Small confirmation modals (Accept All / Reject All / Infeasible) */
.ai-confirm-modal {
    width: 100%;
    max-width: 380px;
}

.ai-confirm-icon {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
}

.ai-confirm-icon--success {
    background-color: #d1fae5;
    color: #16a34a;
}

.ai-confirm-icon--danger {
    background-color: #fee2e2;
    color: #dc2626;
}

.ai-confirm-icon--warning {
    background-color: #fff3e0;
    color: #f57c00;
}

/* ========================================================
   Accept All / Reject All toolbar buttons (AIDraftsToolbar)
   Explicit CSS instead of Bootstrap utility classes, since
   btn-outline-danger/btn-success were being overridden.
   ======================================================== */
.ai-btn-reject-all {
    background-color: #ffffff;
    border: 1px solid #dc2626;
    color: #dc2626;
    font-weight: 600;
}

.ai-btn-reject-all:hover,
.ai-btn-reject-all:focus {
    background-color: #fee2e2;
    border-color: #dc2626;
    color: #dc2626;
}

.ai-btn-accept-all {
    background-color: #16a34a;
    border: 1px solid #16a34a;
    color: #ffffff;
    font-weight: 600;
}

.ai-btn-accept-all:hover,
.ai-btn-accept-all:focus {
    background-color: #15803d;
    border-color: #15803d;
    color: #ffffff;
}

/* ========================================================
   Individual AI draft schedule — "Schedule Modal" badge
   ======================================================== */

.ai-recommendation-badge {
    background-color: #1e3a8a;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.75rem;
    padding: 0.25rem 0.65rem;
    border-radius: 999px;
    white-space: nowrap;
}

.ai-recommendation-badge i {
    font-size: 0.75rem;
}

/* Quarter selector buttons in the Generate Recommendations modal.
   Using explicit borders/colors instead of Bootstrap's btn-outline-* + disabled
   combo, since disabled outline buttons render with a faint/inconsistent border. */

.quarter-btn {
    border-radius: 0.5rem;
    font-weight: 600;
    padding: 0.5rem 0.75rem;
    border-width: 1px;
    border-style: solid;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

/* Default (future/current, unselected) quarter */
.quarter-btn-default {
    background-color: #ffffff;
    border-color: #ced4da;
    color: #495057;
}

.quarter-btn-default:hover:not(:disabled) {
    background-color: #f8f9fa;
    border-color: #adb5bd;
}

/* Selected quarter */
.quarter-btn-selected {
    background-color: #0d3d91;
    border-color: #0d3d91;
    color: #ffffff;
}

/* Past quarter — fully disabled, non-clickable, shown in light red like the
   date-picker's "locked" styling to make it visually obvious it can't be chosen. */
.quarter-btn-past {
    background-color: #fdecec;
    border-color: #f5c2c2;
    color: #b02a2a;
    opacity: 1;
    cursor: not-allowed;
    pointer-events: none;
}

/* ========================================================
   CreateScheduleAIDraftFooter — Reject / Modify / Accept buttons
   Explicit CSS instead of Bootstrap's btn-outline-danger/btn-outline-secondary,
   since disabled outline buttons were rendering with no visible border.
   ======================================================== */

.ai-draft-btn {
    border-radius: 0.5rem;
    font-weight: 600;
    padding: 0.5rem 0.9rem;
    border-width: 1px;
    border-style: solid;
    background-color: #ffffff;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.ai-draft-btn:disabled {
    opacity: 0.65;
}

/* Reject */
.ai-draft-btn-reject {
    border-color: #dc2626;
    color: #dc2626;
}

.ai-draft-btn-reject:hover:not(:disabled) {
    background-color: #fee2e2;
    border-color: #dc2626;
    color: #dc2626;
}

/* Modify */
.ai-draft-btn-modify {
    border-color: #ced4da;
    color: #495057;
}

.ai-draft-btn-modify:hover:not(:disabled) {
    background-color: #f8f9fa;
    border-color: #adb5bd;
    color: #495057;
}

/* Accept */
.ai-draft-btn-accept {
    border-color: #0d3d91;
    background-color: #0d3d91;
    color: #ffffff;
}

.ai-draft-btn-accept:hover:not(:disabled) {
    background-color: #0a2f70;
    border-color: #0a2f70;
    color: #ffffff;
}