/* Roll Call (mobile-first)
   ------------------------------------------------------------
   One member at a time, swipe left to advance, swipe right to go back.
*/

.eac-wrapper-roll-call {
    max-width: 520px;
    margin: 0 auto;
}

.eac-rc-controls {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
}

.eac-rc-controls .eac-rc-shift {
    flex: 1;
}

.eac-rc-controls select {
    width: 100%;
    padding: 12px 12px;
    font-size: 16px;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,0.12);
    background: #fff;
}

.eac-rc-meta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.eac-rc-count {
    font-size: 13px;
    color: rgba(0,0,0,0.65);
    white-space: nowrap;
}

.eac-rc-help {
    font-size: 12px;
    color: rgba(0,0,0,0.6);
    margin-top: 6px;
}


.eac-rc-hidden {
    display: none;
}
.eac-rc-card {
    margin-top: 14px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.10);
    background: #fff;
    overflow: hidden;
    box-shadow: 0 10px 26px rgba(0,0,0,0.06);
    min-height: 52vh;
    touch-action: pan-y;
}

.eac-rc-card-header {
    padding: 14px 14px 10px 14px;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.eac-rc-name {
    font-size: 20px;
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
}

.eac-rc-sub {
    margin-top: 6px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.eac-rc-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.10);
    background: rgba(0,0,0,0.02);
    font-size: 12px;
    color: rgba(0,0,0,0.75);
}


.eac-rc-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}



.eac-rc-late-btn {
    border: 1px solid rgba(178,34,34,0.55);
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 800;
    cursor: pointer;
    background: #fff;
    color: #b22222;
}

.eac-rc-late-btn:active {
    transform: scale(0.98);
}

.eac-rc-late-btn[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}
.eac-rc-prev-btn {
    border: 1px solid rgba(0,0,0,0.18);
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    background: #fff;
    color: #111;
}

.eac-rc-prev-btn:active {
    transform: scale(0.98);
}
.eac-rc-next-btn {
    border: none;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    background: #111;
    color: #fff;
}

.eac-rc-next-btn:active {
    transform: scale(0.98);
}

.eac-rc-body {
    padding: 12px;
}

.eac-rc-blocks {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
}

.eac-rc-block {
    border-radius: 14px;
    border: 1px solid rgba(0,0,0,0.10);
    background: rgba(0,0,0,0.02);
    padding: 10px;
    min-height: 140px;
}

.eac-rc-block-title {
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: rgba(0,0,0,0.75);
    margin: 0 0 8px 0;
}

.eac-rc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.eac-rc-item {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 8px 8px;
    border-radius: 12px;
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    margin-bottom: 8px;
}

/* ------------------------------------------------------------
   Appointment color coding (match weekly calendar view)

   Weekly palette reference (assets/css/eac-calendar.css):
   - Pending (yellow)          #fbbf24
   - Approved (blue)           #3b82f6
   - Leave/CTO (cyan)          #27F5DD
   - Birthday (green)          #27F579
   - TDY (greens)              #22c55e / #4ade80 / #15803d
   - Weekend Duty (orange)     #f97316
   - Event (purple)            #a855f7
   - Other (grey)              #6b7280
   - Late (firebrick)          #b22222
   - Rejected (red)            #ef4444
------------------------------------------------------------- */

/* Default to "approved blue" when status is approved and no type override applies */
.eac-rc-item.eac-rc-status-approved {
    background-color: #3b82f6;
    border-color: rgba(59,130,246,0.35);
    color: #f9fafb;
}

/* Pending – yellow */
.eac-rc-item.eac-rc-status-pending {
    background-color: #fbbf24;
    border-color: rgba(251,191,36,0.40);
    color: #111827;
}

/* Rejected / Denied – red */
.eac-rc-item.eac-rc-status-rejected,
.eac-rc-item.eac-rc-status-denied {
    background-color: #ef4444;
    border-color: rgba(239,68,68,0.40);
    color: #f9fafb;
}

/* Leave + CTO – cyan (only when approved, pending stays yellow) */
.eac-rc-item.eac-rc-status-approved.eac-rc-type-leave,
.eac-rc-item.eac-rc-status-approved.eac-rc-type-cto {
    background-color: #27F5DD;
    border-color: rgba(39,245,221,0.55);
    color: #111827;
}

/* Birthday – bright green */
.eac-rc-item.eac-rc-type-birthday {
    background-color: #27F579;
    border-color: rgba(39,245,121,0.55);
    color: #111827;
}

/* TDY / Deployment – greens */
.eac-rc-item.eac-rc-type-tdy {
    background-color: #22c55e;
    border-color: rgba(34,197,94,0.45);
    color: #022c22;
}
.eac-rc-item.eac-rc-type-tdy-advon {
    background-color: #4ade80;
    border-color: rgba(74,222,128,0.45);
    color: #022c22;
}
.eac-rc-item.eac-rc-type-tdy-rear {
    background-color: #15803d;
    border-color: rgba(21,128,61,0.45);
    color: #e5f9ef;
}

/* Weekend Duty – orange */
.eac-rc-item.eac-rc-type-weekend-duty {
    background-color: #f97316;
    border-color: rgba(249,115,22,0.45);
    color: #111827;
}

/* Event – purple */
.eac-rc-item.eac-rc-type-event {
    background-color: #a855f7;
    border-color: rgba(168,85,247,0.40);
    color: #f9fafb;
}

/* Other – grey */
.eac-rc-item.eac-rc-type-other {
    background-color: #6b7280;
    border-color: rgba(107,114,128,0.40);
    color: #f9fafb;
}

/* Late – firebrick */
.eac-rc-item.eac-rc-type-late {
    background-color: #b22222;
    border-color: rgba(178,34,34,0.45);
    color: #fff;
}

/* Ensure text inherits the pill colors */
.eac-rc-item .eac-rc-time,
.eac-rc-item .eac-rc-title {
    color: inherit;
}

/* Tags/badges should remain readable on colored pills */
.eac-rc-item .eac-rc-tag {
    color: inherit;
    background: rgba(255,255,255,0.18);
    border-color: rgba(255,255,255,0.25);
}

.eac-rc-time {
    font-variant-numeric: tabular-nums;
    font-size: 12px;
    font-weight: 800;
    color: rgba(0,0,0,0.78);
    min-width: 68px;
}

.eac-rc-item-main {
    flex: 1;
}

.eac-rc-title {
    font-size: 13px;
    font-weight: 800;
    margin: 0;
    color: rgba(0,0,0,0.88);
}

.eac-rc-tags {
    margin-top: 4px;
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.eac-rc-tag {
    font-size: 11px;
    padding: 3px 8px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.10);
    background: rgba(0,0,0,0.02);
    color: rgba(0,0,0,0.72);
}

.eac-rc-empty {
    font-size: 13px;
    color: rgba(0,0,0,0.55);
    padding: 10px 6px;
}

.eac-rc-loading {
    padding: 18px 12px;
    font-size: 14px;
    color: rgba(0,0,0,0.7);
}

.eac-rc-anim {
    transition: transform 160ms ease, opacity 160ms ease;
}

.eac-rc-anim.out {
    transform: translateX(40px);
    opacity: 0;
}

.eac-rc-anim.in {
    transform: translateX(0);
    opacity: 1;
}


.eac-rc-swipe-next {
    animation: eacRcSwipeNext 180ms ease;
}

.eac-rc-swipe-prev {
    animation: eacRcSwipePrev 180ms ease;
}

@keyframes eacRcSwipeNext {
    0% { transform: translateX(0); opacity: 1; }
    50% { transform: translateX(-18px); opacity: 0.85; }
    100% { transform: translateX(0); opacity: 1; }
}

@keyframes eacRcSwipePrev {
    0% { transform: translateX(0); opacity: 1; }
    50% { transform: translateX(18px); opacity: 0.85; }
    100% { transform: translateX(0); opacity: 1; }
}


/* Launcher (shortcode output)
   ------------------------------------------------------------ */
.eac-rc-launcher {
    margin-top: 14px;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.10);
    background: #fff;
    padding: 14px;
    box-shadow: 0 10px 26px rgba(0,0,0,0.06);
}

.eac-rc-launcher-row + .eac-rc-launcher-row {
    margin-top: 10px;
}

.eac-rc-open-btn {
    width: 100%;
    border: none;
    padding: 14px 16px;
    border-radius: 14px;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
    background: #111;
    color: #fff;
}

.eac-rc-open-btn:active {
    transform: scale(0.99);
}

.eac-rc-launcher-hint {
    margin-top: 10px;
    font-size: 12px;
    color: rgba(0,0,0,0.6);
}

/* Full-screen window overrides
   ------------------------------------------------------------ */
body.eac-rollcall-fullscreen-body {
    margin: 0;
}

.eac-rollcall-fullscreen.eac-wrapper-roll-call {
    max-width: none;
    margin: 0;
    padding: 10px 10px 14px 10px;
}