/*
 * TimeItUp skin for the Filament panel. Matches the Figma file
 * "TimeItUp — Brand & Product Design". Plain CSS, no build step.
 */
:root {
    --tiu-navy: #10243E;
    --tiu-blue: #2F80ED;
    --tiu-teal: #19C2C9;
    --tiu-orange: #FF8A3D;
    --tiu-off-white: #F7F9FC;
    --tiu-tint: #EEF4FD;
    --tiu-border: #E3E9F1;
    --tiu-heading: #1F2933;
    --tiu-body: #5B6B7A;
    --tiu-shadow: 0 1px 2px rgba(16, 36, 62, .06), 0 8px 24px rgba(16, 36, 62, .06);
}

.fi-body { background: var(--tiu-off-white); color: var(--tiu-heading); }

/* Headings in Sora */
.fi-header-heading,
.fi-simple-header-heading,
.fi-section-header-heading,
.fi-wi-stats-overview-stat-value,
.fi-modal-heading,
.tiu-card h3 {
    font-family: 'Sora', 'Inter', sans-serif;
    letter-spacing: -0.02em;
}
.fi-header-subheading { color: var(--tiu-body); }

/* Logo */
.tiu-brand { display: inline-flex; align-items: center; gap: .6rem; height: 100%; }
.tiu-brand-mark { height: 100%; width: auto; }
.tiu-brand-word { font-family: 'Sora', sans-serif; font-weight: 600; font-size: 1.35rem; letter-spacing: -0.03em; color: var(--tiu-navy); line-height: 1; }
.tiu-brand-word span { color: var(--tiu-blue); }
.fi-sidebar .tiu-brand-word { color: #fff; }
.fi-sidebar .tiu-brand-word span { color: var(--tiu-teal); }

/* Navy sidebar */
.fi-sidebar,
.fi-main-sidebar { background: var(--tiu-navy) !important; }
.fi-sidebar { box-shadow: none; border: 0; }
.fi-sidebar-header,
.fi-sidebar-header-ctn { background: transparent !important; box-shadow: none !important; border: 0 !important; }
.fi-sidebar-nav { padding-top: .5rem; }
.fi-sidebar-group-label { color: rgba(255, 255, 255, .45); }
.fi-sidebar-item-btn { border-radius: 10px; }
.fi-sidebar-item-btn:hover,
.fi-sidebar-item-btn:focus-visible { background: rgba(255, 255, 255, .06) !important; }
.fi-sidebar .fi-sidebar-item-label { color: #B4C2D3; font-weight: 600; }
.fi-sidebar .fi-sidebar-item-icon { color: #8EA0B5; }
.fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: rgba(255, 255, 255, .1) !important; }
.fi-sidebar-item.fi-active .fi-sidebar-item-label { color: #fff; }
.fi-sidebar-item.fi-active .fi-sidebar-item-icon { color: var(--tiu-teal); }
.fi-sidebar-close-collapse-sidebar-btn,
.fi-sidebar-open-collapse-sidebar-btn,
.fi-sidebar .fi-icon-btn { color: #B4C2D3; }

/* Orange "New post" in the sidebar: the publish moment */
.tiu-new-post {
    display: block; margin: 0 0 1rem; padding: .7rem 1rem; border-radius: 10px;
    background: var(--tiu-orange); color: #fff; font-weight: 600; font-size: .875rem; text-align: center;
    box-shadow: 0 6px 16px rgba(255, 138, 61, .3); transition: transform .15s, box-shadow .15s;
}
.tiu-new-post:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(255, 138, 61, .35); }

/* Top bar */
.fi-topbar { background: #fff; box-shadow: none; border-bottom: 1px solid var(--tiu-border); }

/* Cards */
.fi-section:not(.fi-section-not-contained),
.fi-ta-ctn,
.fi-wi-stats-overview-stat {
    border-radius: 16px;
    box-shadow: var(--tiu-shadow);
    --tw-ring-color: var(--tiu-border);
}
.fi-wi-stats-overview-stat-label { color: var(--tiu-body); font-weight: 500; }
.fi-wi-stats-overview-stat-value { color: var(--tiu-heading); }
.fi-btn { border-radius: 10px; }
.fi-input-wrp { border-radius: 10px; }

/* Sign-in page */
.fi-simple-layout {
    background:
        radial-gradient(circle at 85% 10%, rgba(25, 194, 201, .25), transparent 40%),
        radial-gradient(circle at 10% 90%, rgba(47, 128, 237, .3), transparent 45%),
        var(--tiu-navy);
}
.fi-simple-main { border-radius: 20px; box-shadow: 0 24px 48px -8px rgba(0, 0, 0, .35); }

/* Up next widget */
.tiu-upnext { display: flex; flex-direction: column; gap: 1rem; }
.tiu-card { background: #fff; border: 1px solid var(--tiu-border); border-radius: 16px; padding: 1.5rem; box-shadow: var(--tiu-shadow); display: flex; flex-direction: column; gap: .75rem; }
.tiu-card-head { display: flex; justify-content: space-between; align-items: center; }
.tiu-card-head h3 { font-size: 1.15rem; font-weight: 600; color: var(--tiu-heading); }
.tiu-card-head a, .tiu-empty a { color: var(--tiu-blue); font-weight: 600; font-size: .875rem; }
.tiu-empty { color: var(--tiu-body); font-size: .9rem; padding: .5rem 0; }
.tiu-post { display: flex; align-items: center; gap: .9rem; padding: .7rem .9rem .7rem .7rem; border: 1px solid var(--tiu-border); border-radius: 14px; transition: border-color .15s, box-shadow .15s; }
.tiu-post:hover { border-color: #C9D7EA; box-shadow: var(--tiu-shadow); }
.tiu-thumb { width: 48px; height: 48px; flex: none; border-radius: 10px; object-fit: cover; }
.tiu-thumb-0 { background: linear-gradient(135deg, #FFB27A, #FF8A3D); }
.tiu-thumb-1 { background: linear-gradient(135deg, #7DB5FF, #2F80ED); }
.tiu-thumb-2 { background: linear-gradient(135deg, #7FE3E7, #19C2C9); }
.tiu-thumb-3 { background: linear-gradient(135deg, #B7A6FF, #7A63F2); }
.tiu-post-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .25rem; }
.tiu-post-body strong { font-size: .875rem; color: var(--tiu-heading); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tiu-post-meta { display: flex; align-items: center; gap: .6rem; font-size: .75rem; color: var(--tiu-body); font-weight: 500; }
.tiu-dots { display: inline-flex; }
.tiu-dot { width: 12px; height: 12px; border-radius: 50%; box-shadow: 0 0 0 2px #fff; margin-right: -3px; }
.tiu-dot-facebook { background: #1877F2; }
.tiu-dot-instagram { background: #E1306C; }
.tiu-dot-tiktok { background: #111; }
.tiu-dot-youtube { background: #FF0000; }

/* Status pills */
.tiu-pill { display: inline-flex; align-items: center; gap: .35rem; flex: none; padding: .2rem .6rem; border-radius: 999px; font-size: .72rem; font-weight: 600; }
.tiu-pill::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.tiu-pill-scheduled { background: #E6F0FD; color: #2F80ED; }
.tiu-pill-publishing { background: #FFF1E7; color: #E8701F; }
.tiu-pill-published { background: #E3F6EE; color: #1FAE7A; }
.tiu-pill-draft { background: #EEF1F4; color: #5B6B7A; }
.tiu-pill-partial, .tiu-pill-failed { background: #FDEBEC; color: #E5484D; }

/* Failed-post alert */
.tiu-alert { display: flex; gap: .9rem; align-items: flex-start; padding: 1rem 1.1rem; border-radius: 16px; background: #FFF6EF; border: 1px solid #FFD3B5; }
.tiu-alert-icon { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border-radius: 10px; background: var(--tiu-orange); color: #fff; font-weight: 700; }
.tiu-alert strong { display: block; font-size: .9rem; color: var(--tiu-heading); }
.tiu-alert small { color: var(--tiu-body); font-size: .8rem; }
.fi-wi-stats-overview-stat-description { overflow-wrap: anywhere; }

/* Filament lightens filled buttons whose colour fails its contrast check; keep the brand's solid fills. */
.fi-btn.fi-color-primary[class*="fi-bg-color-"],
.fi-btn.fi-color-info[class*="fi-bg-color-"] { background: var(--tiu-blue); color: #fff; }
.fi-btn.fi-color-primary[class*="fi-bg-color-"]:hover,
.fi-btn.fi-color-info[class*="fi-bg-color-"]:hover { background: #2370D6; }
.fi-btn.fi-color-warning[class*="fi-bg-color-"] { background: var(--tiu-orange); color: #fff; }
.fi-btn.fi-color-warning[class*="fi-bg-color-"]:hover { background: #F57A2A; }
.fi-btn.fi-color[class*="fi-bg-color-"] .fi-icon { color: inherit; }

/* Month calendar (Calendar page and each platform's page) */
.sched-bar { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.sched-title { font-family: 'Sora', sans-serif; font-size: 1.25rem; font-weight: 600; letter-spacing: -.02em; margin-left: .5rem; color: var(--tiu-heading); }
.sched-meta { margin-left: auto; display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; font-size: .8rem; color: var(--tiu-body); }
.sched-legend { display: inline-flex; gap: .8rem; }
.sched-legend span { display: inline-flex; align-items: center; gap: .35rem; }
.sched-legend .tiu-dot { width: 9px; height: 9px; box-shadow: none; margin: 0; }
.sched-cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; background: #fff; border: 1px solid var(--tiu-border); border-radius: 16px; padding: 1rem; box-shadow: var(--tiu-shadow); margin-top: 1rem; }
.sched-dow { padding: .25rem .4rem; font-size: .75rem; font-weight: 500; color: var(--tiu-body); }
.sched-day { min-height: 7rem; padding: .4rem; background: var(--tiu-off-white); border-radius: 8px; display: flex; flex-direction: column; gap: .25rem; min-width: 0; }
.sched-day.is-out { background: transparent; opacity: .45; }
.sched-day.is-today { box-shadow: inset 0 0 0 1.5px var(--tiu-blue); }
.sched-day.is-today .sched-num > span { background: var(--tiu-blue); color: #fff; border-radius: 999px; min-width: 1.4rem; text-align: center; }
.sched-num { display: flex; justify-content: space-between; font-size: .78rem; font-weight: 600; color: var(--tiu-heading); }
.sched-add { opacity: 0; padding: 0 .4rem; border-radius: 6px; color: var(--tiu-blue); }
.sched-add:hover { background: var(--tiu-tint); }
.sched-day:hover .sched-add, .sched-add:focus-visible { opacity: 1; }
.sched-post { display: block; font-size: .72rem; line-height: 1.3; padding: .3rem .45rem; border-radius: 6px; overflow: hidden; }
.sched-post:hover { filter: brightness(.96); }
.sched-row { display: flex; align-items: center; justify-content: space-between; gap: .3rem; }
.sched-row .tiu-dot { width: 8px; height: 8px; box-shadow: 0 0 0 1.5px #fff; margin-right: -2px; }
.sched-cap { display: block; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sched-draft { background: #EEF1F4; color: #5B6B7A; } .sched-scheduled { background: #E6F0FD; color: #1F5FBF; } .sched-publishing { background: #FFF1E7; color: #C25A12; }
.sched-published { background: #E3F6EE; color: #16825B; } .sched-partial, .sched-failed { background: #FDEBEC; color: #C8343A; }
@media (max-width: 640px) { .sched-cal { gap: 3px; padding: .5rem; } .sched-day { min-height: 4.5rem; } .sched-cap, .sched-dow { font-size: .65rem; } .sched-legend { display: none; } }

/* Platform pages */
.tiu-platform-icon { flex: none; border-radius: 6px; }
.fi-sidebar-item-icon.tiu-platform-icon, .fi-sidebar .tiu-platform-icon { width: 1.25rem; height: 1.25rem; }
.tiu-platform { display: flex; flex-direction: column; gap: 1rem; }
.tiu-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.tiu-stat { background: #fff; border: 1px solid var(--tiu-border); border-radius: 16px; padding: 1rem 1.25rem; box-shadow: var(--tiu-shadow); display: flex; flex-direction: column; }
.tiu-stat span { font-size: .8rem; font-weight: 500; color: var(--tiu-body); }
.tiu-stat strong { font-family: 'Sora', sans-serif; font-size: 1.75rem; font-weight: 600; letter-spacing: -.02em; color: var(--tiu-heading); line-height: 1.3; }
.tiu-stat small { font-size: .75rem; color: #8A99A8; }
.tiu-platform-cols { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; align-items: start; }
.tiu-rules h3 { display: flex; align-items: center; gap: .5rem; }
.tiu-rules p { font-size: .875rem; color: var(--tiu-body); line-height: 1.55; }
@media (max-width: 900px) { .tiu-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tiu-platform-cols { grid-template-columns: 1fr; } }

/* Post form and list: platform choices with their badges */
.tiu-platform-option { display: inline-flex; align-items: center; gap: .45rem; font-weight: 600; }
.tiu-platform-row { display: inline-flex; gap: .3rem; }
.sched-lib { color: var(--tiu-blue); font-weight: 600; }
/* Choice buttons (e.g. Save to library / Schedule): only the chosen one is filled */
.fi-fo-toggle-buttons-btn-ctn .fi-btn[aria-pressed="false"],
.fi-fo-toggle-buttons-btn-ctn .fi-btn[aria-pressed="false"]:hover { background: #fff !important; color: var(--tiu-body) !important; box-shadow: inset 0 0 0 1px var(--tiu-border); }
.fi-fo-toggle-buttons-btn-ctn .fi-btn[aria-pressed="false"]:hover { background: var(--tiu-off-white) !important; }

/* Dashboard: posting timer not running */
.tiu-alert-timer { cursor: default; }
.tiu-cron { display: block; margin: .6rem 0 .5rem; padding: .55rem .7rem; background: #fff; border: 1px solid #F3D3BC; border-radius: 8px; font-size: .78rem; word-break: break-all; color: var(--tiu-heading); }
.tiu-copy { font-size: .8rem; font-weight: 600; padding: .35rem .8rem; border-radius: 8px; border: 1px solid #F3D3BC; background: #fff; color: #8A4513; cursor: pointer; }

/* Tables: keep the row buttons (Edit / Results / Retry, ⋮) on one line and pinned to the right edge, so they
   stay visible even when a narrow window makes the table scroll sideways. */
.fi-ta-actions { flex-wrap: nowrap; }
.fi-ta-row > td:last-child:has(.fi-ta-actions),
.fi-ta-table thead tr > th.fi-ta-actions-header-cell {
    position: sticky; right: 0; z-index: 1; background: #fff; white-space: nowrap;
    box-shadow: -10px 0 12px -10px rgba(16, 36, 62, .18);
}
.fi-ta-row:hover > td:last-child:has(.fi-ta-actions) { background: var(--tiu-off-white); }