/* dashboard */
.alert-stay {display:flex;border-radius:0.5rem;border-width:1px;padding-right:1rem;padding-left:1rem;padding-top:0.75rem;padding-bottom:0.75rem;font-size:0.875rem;line-height:1.25rem;margin-bottom:12px}
.page-header-row{align-items:center;justify-content:space-between;margin-bottom:16px}
.alert-warn{background:#fffbeb;border:0.5px solid #fcd34d;border-radius:1rem;padding:10px 12px;display:flex;gap:8px;align-items:flex-start;margin-bottom:12px}
.alert-warn-icon{color:#d97706;font-size:13px;margin-top:1px}
.alert-warn-text{font-size:12px;color:#92400e}
.alert-info2{background:#eff6ff;border:0.5px solid #bfdbfe;border-radius:1rem;padding:9px 11px;display:flex;gap:7px;align-items:flex-start;margin-bottom:10px;font-size:11px;color:#1e40af;line-height:1.5}
.alert-info-text{font-size:12px;color:#1e40af;line-height:1.5}

.post-row{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid black}
.post-row:last-child{border-bottom:none}
.post-thumb{width:36px;height:36px;border-radius:6px;background:rgb(var(--color-background-default));flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:18px}
.post-meta{flex:1;min-width:0}



/* START: Post List Template */

.product-cell{display:flex;align-items:center;gap:8px}
.product-img{width:32px;height:32px;border-radius:4px;background:rgb(var(--color-background-default));flex-shrink:0;display:flex;align-items:center;)}

.page-container-2 {margin-left: auto;margin-right: auto;width: 100%;max-width: 72rem;padding-left: 1.5rem;padding-right: 1.5rem;padding-top: 1rem;padding-bottom: 1rem;}
.filter-row{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.filter-chip{padding:4px 10px;border-radius:20px;font-size:11px;font-weight:500;cursor:pointer;border:0.5px solid rgb(var(--color-divider));background:rgb(var(--color-background-default));color:rgb(var(--color-text-primary));transition:all .15s}
.filter-chip:hover{border-color:rgb(var(--color-primary-dark));color:rgb(var(--color-text-primary))}
.filter-chip.active{background:#22c55e;border-color:#16a34a;color:#fff}

.tbl{width:100%;border-collapse:collapse;font-size:12px}
.tbl th{text-align:left;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:rgb(var(--color-text-secondary));padding:6px 10px;border-bottom:0.5px solid rgb(var(--color-divider));white-space:nowrap}
.tbl td{padding:8px 10px;border-bottom:0.5px solid rgb(var(--color-divider));color:rgb(var(--color-text-primary));vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:rgb(var(--color-background-default))}
/* END: Post List Template */

/* START: Post Detail Template */
.detail-preview{background:rgb(var(--color-primary-dark));border-radius:1rem;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:28px;margin-bottom:10px}

.meta-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:0.5px solid rgb(var(--color-divider));font-size:12px}
.meta-row:last-child{border-bottom:none}
.meta-label{color:rgb(var(--color-text-secondary))}
.meta-val{color:rgb(var(--color-text-primary));font-weight:500;text-align:right}

.timeline-marker-pending{background-color: #f7f7f7;}
/* END: Post Detail Template */

/* START: Schedule List Detail Template */
.sched-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sched-card{background:rgb(var(--color-background-paper));border:0.5px solid rgb(var(--color-divider));border-radius:1rem;padding:14px}
.sched-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px}
.sched-name{font-size:23px;font-weight:500;color:rgb(var(--color-text-primary))}
.sched-meta-row{display:flex;gap:8px;margin-bottom:8px;flex-wrap:wrap}
.sched-stat{font-size:13px;color:rgb(var(--color-text-secondary))}
.sched-stat span{color:rgb(var(--color-text-primary));font-weight:500}
/* END: Schedule List Detail Template */

/* START: Product List Template */
.product-name{font-size:11px;color:rgb(var(--color-text-primary));white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:145px}
/* END: Product List Template */

/* START: Product Detail Template */
.mr{display:flex;justify-content:space-between;padding:6px 0;border-bottom:0.5px solid rgb(var(--color-divider));font-size:11px}
.mr:last-child{border-bottom:none}
.ml{color:rgb(var(--color-text-secondary))}.mv{color:rgb(var(--color-text-primary));font-weight:500;text-align:right}

.pr{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:0.5px solid rgb(var(--color-divider))}
.pr:last-child{border-bottom:none}
.pt{width:30px;height:30px;border-radius:6px;background:rgb(var(--color-primary-dark));flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:14px}
.pm{flex:1;min-width:0}
.p-title{font-size:11px;font-weight:500;color:rgb(var(--color-text-primary));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.p-sub{font-size:10px;color:rgb(var(--color-text-secondary))}
/* END: Product Detail Template */

/* START: Template List Template */
.tmpl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.tmpl-card{border:0.5px solid rgb(var(--color-divider));border-radius:1rem;overflow:hidden;cursor:pointer}
.tmpl-card:hover{border-color:#22c55e}
.tmpl-prev{background:rgb(var(--color-background-default));aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:28px;position:relative}
.tmpl-foot{padding:7px 9px;background:rgb(var(--color-background-paper))}
.tmpl-name{font-size:10px;font-weight:500;color:rgb(var(--color-text-primary));margin-bottom:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tmpl-meta{font-size:9px;color:rgb(var(--color-text-secondary))}
.bimg{background:#fce7f3;color:#9d174d}
.bvid{background:#ede9fe;color:#5b21b6}
/* END: Template List Template */

.dp{background:rgb(var(--color-background-default));border-radius:1rem;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:8px}

/* START: Library List Template */
.lib-item{border-radius:1rem;overflow:hidden;background:rgb(var(--color-background-paper));aspect-ratio:1;position:relative;cursor:pointer}
.lib-inner{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:28px}
.lib-lock{position:absolute;inset:0;background:rgba(0,0,0,.6);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:9px;color:rgba(255,255,255,.85);font-weight:600}
.lib-dl{position:absolute;bottom:5px;right:5px;background:rgba(0,0,0,.7);color:#fff;border:none;border-radius:4px;padding:2px 6px;font-size:9px;cursor:pointer;opacity:0}
.lib-item:hover .lib-dl{opacity:1}
.lib-cap{font-size:9px;color:var(--color-text-secondary);margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lib-toggle{display:inline-flex;gap:1px;background:rgb(var(--color-background-default));border-radius:1rem;padding:2px;margin-bottom:12px}
.lib-btn{padding:4px 12px;border-radius:5px;font-size:10px;font-weight:500;cursor:pointer;color:rgb(var(--color-text-secondary));border:none;background:transparent}
.lib-btn.on{background:rgb(var(--color-background-default));color:rgb(var(--color-text-primary))}
/* END: Library List Template */

.ccard{border:0.5px solid rgb(var(--color-divider));border-radius:1rem;padding:12px 8px;cursor:pointer;text-align:center}
.ccard:hover{border-color:#22c55e;background:#f0fdf4}

/* START: Socials List Template */
.platform-row{;align-items:center;justify-content:space-between;padding:11px 14px;border:0.5px solid rgb(var(--color-divider));border-radius:0.5rem;margin-bottom:8px}
.platform-row-connected{border-color:#22c55e;background:#f0fdf4}
.platform-info{display:flex;align-items:center;gap:10px}
.platform-dot{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#fff;flex-shrink:0}
.platform-name{font-size:12px;font-weight:500;color:rgb(var(--color-text-primary))}
.platform-handle{font-size:11px;color:rgb(var(--color-text-secondary))}

.danger-zone{border:0.5px solid #fca5a5;border-radius:1rem;padding:18px;text-align:center;margin-top:8px}
.danger-title{font-size:13px;font-weight:600;color:#dc2626;margin-bottom:6px}
.danger-desc{font-size:12px;color:rgb(var(--color-text-secondary));margin-bottom:14px;line-height:1.5}
/* END: Socials List Template */

/* START: Add Socials Template */
.connect-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.connect-platform-card{border:0.5px solid rgb(var(--color-divider));border-radius:0.5rem;padding:14px 10px;cursor:pointer;text-align:center;transition:all .15s}
.connect-platform-card:hover{border-color:#22c55e;background:rgb(var(--color-success-main))}
.connect-dot{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;margin:0 auto 6px}
.connect-platform-name{font-size:11px;font-weight:500;color:rgb(var(--color-text-primary))}

/* A connect request is in flight: freeze the whole grid */
.connect-grid:has(.htmx-request) .connect-platform-card {
  pointer-events: none;
}
/* Dim the cards that were NOT clicked */
.connect-grid:has(.htmx-request) .connect-platform-card:not(:has(.htmx-request)) {
  opacity: .4;
}
/* Keep the clicked card looking active, not hovered */
.connect-grid:has(.htmx-request) .connect-platform-card:has(.htmx-request) {
  border-color: rgb(var(--color-divider));
  background: transparent;
}
/* END: Add Socials Template */

/* START: Analytics Template */
.stat-label{font-size:11px;color:rgb(var(--color-text-secondary));margin-bottom:4px}
.stat-value{font-size:22px;font-weight:500;color:rgb(var(--color-text-primary))}
.stat-sub{font-size:10px;color:rgb(var(--color-text-secondary));margin-top:2px}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}

.stat-card{background:rgb(var(--color-background-paper));border-radius:0.5rem;padding:12px 14px}
.chart-stub{background:rgb(var(--color-divider));border-radius:0.5rem;display:flex;align-items:center;justify-content:center;color:rgb(var(--color-text-secondary));font-size:11px}
.stub-zone{text-align:center;padding:30px 20px;border:1.5px dashed rgb(var(--color-divider));border-radius:1rem;margin-bottom:14px}
.stub-icon{font-size:32px;margin-bottom:8px}
.stub-title{font-size:14px;font-weight:500;color:rgb(var(--color-text-primary));margin-bottom:6px}
.stub-desc{font-size:12px;color:rgb(var(--color-text-secondary));line-height:1.6;max-width:320px;margin:0 auto 14px}
/* END: Analytics Template */

/* START: Settings Template */
.settings-nav{display:flex;gap:1px;background:rgb(var(--color-background-paper));border-radius:1rem;padding:3px;margin-bottom:16px}
.settings-tab{flex:1;padding:5px 10px;border-radius:5px;font-size:11px;font-weight:500;text-align:center;cursor:pointer;color:rgb(var(--color-text-secondary));border:none;background:transparent;transition:.15s}
.settings-tab.active{background:rgb(var(--color-background-default));color:rgb(var(--color-text-primary))}
.settings-pane{display:none}
.settings-pane.active{display:block}

.fi{margin-bottom:12px}
.fi-label{font-size:11px;font-weight:600;color:rgb(var(--color-text-secondary));text-transform:uppercase;letter-spacing:.04em;margin-bottom:5px}
.fi-input{width:100%;padding:7px 10px;border:0.5px solid rgb(var(--color-divider));border-radius:1rem;font-size:12px;background:rgb(var(--color-background-default));color:rgb(var(--color-text-primary));outline:none}
.fi-select{width:100%;padding:7px 10px;border:0.5px solid rgb(var(--color-divider));border-radius:1rem;font-size:12px;background:rgb(var(--color-background-default));color:rgb(var(--color-text-primary))}
.fi-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}

.actions{display:flex;gap:6px;justify-content:flex-end;margin-top:16px;padding-top:14px;border-top:0.5px solid rgb(var(--color-divider))}

/* ── Billing ── */
.plan-hero{background:linear-gradient(135deg,#166534,#15803d);border-radius:1rem;padding:18px 20px;color:#fff;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}
.plan-hero-left .plan-name-label{font-size:10px;opacity:.75;text-transform:uppercase;letter-spacing:.06em;margin-bottom:4px}
.plan-hero-left .plan-name{font-size:18px;font-weight:600}
.plan-hero-right .plan-price{font-size:24px;font-weight:600}
.plan-hero-right .plan-cycle{font-size:10px;opacity:.7}
.usage-row{margin-bottom:10px}
.usage-header{display:flex;justify-content:space-between;font-size:11px;margin-bottom:4px}
.usage-bar{height:6px;background:rgb(var(--color-background-paper));border-radius:3px;overflow:hidden}
.usage-fill{height:100%;border-radius:3px;background:#22c55e}
.usage-fill-warn{background:#f59e0b}

/* ── Notifications ── */
.notif-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:0.5px solid rgb(var(--color-divider))}
.notif-row:last-child{border-bottom:none}
.notif-label{font-size:12px;font-weight:500;color:rgb(var(--color-text-primary))}
.notif-desc{font-size:11px;color:rgb(var(--color-text-secondary));margin-top:1px}
/* END: Settings Template */

/* START: Add Schedule Template */
/*#div_id_is_auto_approved label{*/
/*    background-image: linear-gradient(45deg,#ff7200,#5c00ff);*/
/*      background-clip: text;*/
/*      -webkit-background-clip: text;*/
/*      color: transparent;*/
/*    }*/

#div_id_is_auto_approved label{
    background-image: linear-gradient(to right,#ff7200,#5c00ff);
      background-clip: text;
      -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
      color: transparent;
        background-size: 200% auto;
        animation: shine 10s linear infinite;
    }

@keyframes shine {
    0% {
        background-position: 0% 50%;
    }
    100% {
        background-position: 200% 50%;
    }
}

.break {
  flex-basis: 100%;
  height: 0;
}

.flex-container-vertical {
  display: flex;
  flex-direction: column; /* Stacks items vertically into rows */
  gap: 10px;               /* Optional: Adds space between the rows */
}
/* END: Add Schedule Template */
/* dashboard end */