/* ===== Sticky Poster admin — additions to the design theme (admin.css) =====
   Statuses the design doesn't have (approval workflow), and small pieces used by the MVC pages. */

/* Status badges: the design has active / draft / expired */
.badge-pending   { background: #fff4d6; color: #8a5b00; border: 1px solid #f3d27a; }
.badge-rejected  { background: var(--red-tint); color: var(--red-dark); border: 1px solid #f5b5b7; }
.badge-scheduled { background: #e8f1fb; color: #1d4f8a; border: 1px solid #b9d3f0; }

/* Sidebar count bubble (approval requests) */
.side-link .count { margin-left: auto; background: var(--red); color: #fff; border-radius: 99px; font-size: .7rem; font-weight: 700; padding: .05rem .5rem; }
.side-link.active .count { background: #fff; color: var(--ink); }

/* Logo thumbnail next to a poster thumbnail in tables */
.thumb-logo { width: 42px; height: 42px; border-radius: 8px; border: 1px solid var(--line); background: #fff; object-fit: contain; padding: 3px; flex: 0 0 42px; }

/* Status filter tabs above the posters table */
.status-tabs { display: flex; flex-wrap: wrap; gap: .4rem; }
.status-tabs a { border: 1px solid var(--line); background: #fff; color: var(--grey); border-radius: 99px; padding: .35rem .85rem; font-size: .84rem; font-weight: 500; }
.status-tabs a:hover { border-color: var(--ink); color: var(--ink); }
.status-tabs a.active { background: var(--ink); border-color: var(--ink); color: #fff; }
.status-tabs a .n { font-weight: 700; margin-left: .25rem; }

/* Approval request cards on the dashboard */
.req-card { display: flex; gap: .85rem; padding: .85rem 1.1rem; border-bottom: 1px solid var(--line); align-items: center; }
.req-card:last-child { border-bottom: 0; }
.req-card .thumb { width: 48px; height: 64px; flex: 0 0 48px; }

/* Field validation messages from the server */
.field-validation-error { color: var(--red-dark); font-size: .78rem; display: block; margin-top: .25rem; }
.validation-summary-errors ul { margin: 0; padding-left: 1.1rem; }
.input-validation-error { border-color: var(--red) !important; }

/* Locked (verified) Company ID */
.form-control[readonly].locked { background: var(--sand); }

/* Existing images shown above an upload zone */
.current-img { display: flex; align-items: center; gap: .75rem; margin-bottom: .6rem; }
.current-img img { max-height: 90px; max-width: 120px; border-radius: 8px; border: 1px solid var(--line); background: #fff; object-fit: contain; }

/* Page views: 30-day bar chart and number tiles */
.views-chart { display: flex; align-items: flex-end; gap: 3px; height: 140px; padding-top: .5rem; }
.views-chart .bar-col { flex: 1; height: 100%; display: flex; align-items: flex-end; }
.views-chart .bar { width: 100%; border-radius: 3px 3px 0 0; min-height: 2px; transition: opacity .15s; }
.views-chart .bar-col:hover .bar { opacity: .7; }
.view-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: .75rem; }
.view-tile { background: var(--sand); border-radius: 10px; padding: .75rem .9rem; }
.view-tile .num { font-family: var(--head); font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.view-tile .lbl { font-size: .78rem; color: var(--grey); }

/* Live preview card on the poster form: logo variant */
.poster-art.has-logo { background: #fff !important; }
.poster-art.has-logo img { object-fit: contain; padding: 18%; }
.poster-foot .b-logo { width: 24px; height: 24px; border-radius: 4px; border: 1px solid var(--line); background: #fff; object-fit: contain; }