/* ---------- Content Plan (AI Studio > Plan > Content Plan tab) ---------- */

.cp-quota{font-size:11.5px; font-weight:600; color:var(--purple-600); background:var(--purple-50); padding:7px 13px; border-radius:20px; display:flex; align-items:center; gap:6px; white-space:nowrap; margin-top:2px;}
.cp-quota svg{width:12px;height:12px;}

/* wizard modal — uses the app's .modal-setup (zero-padding shell) so
   wizard-steps/wizard-body's own padding (from base.css) applies cleanly. */
.cp-wizard-modal .modal-actions{justify-content:space-between; padding:16px 22px 22px; border-top:1px solid var(--border); margin-top:4px;}

/* active plan status strip */
.cp-active-strip{display:flex; align-items:center; justify-content:space-between; gap:14px; padding:0 0 18px; margin-bottom:18px; border-bottom:1px solid var(--border); flex-wrap:wrap; background:none; border-radius:0; box-shadow:none;}
.cp-active-strip .left{display:flex; align-items:center; gap:12px;}
.cp-active-strip .dot{width:36px;height:36px;border-radius:10px; background:var(--purple-50); color:var(--purple-600); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cp-active-strip .dot svg{width:16px;height:16px;}
.cp-active-strip b{font-size:13.5px; font-weight:600;}
.cp-progress-track{width:110px; height:5px; background:var(--ink-100); border-radius:6px; overflow:hidden; margin-top:7px;}
.cp-progress-fill{height:100%; background:var(--purple-600); border-radius:6px; transition:width .3s ease;}

/* duration step */
.cp-dur-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:10px;}
.cp-dur-card { border:1px solid var(--border); padding:16px 12px; text-align:center; cursor:pointer; transition:border-color .12s ease, background .12s ease; }
.cp-dur-card:hover{border-color:var(--ink-300);}
.cp-dur-card.active{border-color:var(--purple-600); background:var(--purple-50);}
.cp-dur-card b{font-size:15px; display:block; font-weight:700;}
.cp-dur-card span{font-size:11px; color:var(--ink-500); display:block; margin-top:4px; line-height:1.4;}

/* platforms step */
.cp-platform-row{display:flex; flex-direction:column; gap:8px;}
.cp-platform-item{display:flex; align-items:center; gap:12px; border:1px solid var(--border); border-radius:14px; padding:13px 14px; cursor:pointer; transition:border-color .12s ease, background .12s ease;}
.cp-platform-item.checked{border-color:var(--purple-500); background:var(--purple-50);}
.cp-platform-item .pf-ic{width:36px;height:36px;border-radius:10px; background:var(--ink-100); color:var(--ink-700); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cp-platform-item .pf-ic svg{width:17px;height:17px;}
.cp-platform-item .pf-info{flex:1;}
.cp-platform-item .pf-info b{font-size:13.3px; display:flex; align-items:center; gap:7px;}
.cp-platform-item .pf-info span{font-size:11.7px; color:var(--ink-500);}
.cp-badge-rec{font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; background:var(--purple-100); color:var(--purple-600); padding:2px 7px; border-radius:20px;}
.cp-checkbox{width:20px;height:20px;border-radius:6px; border:1.5px solid var(--ink-300); display:flex; align-items:center; justify-content:center; flex-shrink:0; transition:all .12s ease;}
.cp-platform-item.checked .cp-checkbox{background:var(--purple-600); border-color:var(--purple-600); color:#fff;}
.cp-checkbox svg{width:12px;height:12px;}

/* sources step */
.cp-source-row{display:flex; align-items:flex-start; gap:11px; padding:11px 0; border-bottom:1px solid var(--border);}
.cp-source-row:last-child{border-bottom:none;}
.cp-source-row .src-ic{width:30px;height:30px;border-radius:9px; display:flex; align-items:center; justify-content:center; flex-shrink:0; margin-top:1px;}
.cp-source-row .src-ic.ok{background:var(--green-50); color:var(--green-600);}
.cp-source-row .src-ic.warn{background:var(--amber-50); color:var(--amber-600);}
.cp-source-row .src-ic svg{width:15px;height:15px;}
.cp-source-row b{font-size:13px; display:block;}
.cp-source-row .src-sub{font-size:12px; color:var(--ink-500); margin-top:2px; line-height:1.45;}
.cp-source-row a{color:var(--purple-600); font-weight:600; font-size:12px;}

/* generate step */
.cp-quota-warn{display:flex; align-items:center; gap:10px; background:var(--amber-50); border:1px solid var(--amber-600); border-radius:12px; padding:12px 14px; font-size:12.5px; color:var(--amber-600); margin-bottom:14px;}
.cp-quota-warn svg{width:16px;height:16px; color:var(--amber-600); flex-shrink:0;}
.cp-summary-box{background:var(--ink-100); border-radius:14px; padding:14px 16px; font-size:12.6px; color:var(--ink-700); line-height:1.7;}
.cp-summary-box b{color:var(--ink-900);}

/* generating state */
.cp-gen-wrap{display:flex; flex-direction:column; align-items:center; padding:34px 10px 10px; text-align:center;}
.cp-gen-spinner{width:52px;height:52px; border-radius:50%; border:3px solid var(--purple-100); border-top-color:var(--purple-600); animation:cpspin .8s linear infinite; margin-bottom:20px;}
@keyframes cpspin{to{transform:rotate(360deg);}}
.cp-gen-stage{font-size:13.5px; font-weight:700; margin-bottom:6px;}
.cp-gen-sub{font-size:12px; color:var(--ink-500); margin-bottom:22px;}
.cp-gen-steps{display:flex; flex-direction:column; gap:9px; width:100%; max-width:300px; text-align:left;}
.cp-gen-step{display:flex; align-items:center; gap:10px; font-size:12.3px; color:var(--ink-300);}
.cp-gen-step .chk{width:18px;height:18px;border-radius:50%; background:var(--ink-100); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.cp-gen-step .chk svg{width:10px;height:10px; color:#fff;}
.cp-gen-step.done{color:var(--ink-900);}
.cp-gen-step.done .chk{background:var(--green-600);}
.cp-gen-step.current{color:var(--purple-600); font-weight:600;}
.cp-gen-step.current .chk{background:var(--purple-600);}

/* bulk bar */
.cp-bulk-bar{position:sticky; top:0; z-index:20; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 16px; margin-bottom:18px; flex-wrap:wrap; background:var(--ink-100); border:none; box-shadow:none; border-radius:var(--radius-md);}
.cp-bulk-left{display:flex; align-items:center; gap:12px; flex-wrap:wrap;}
.cp-bulk-count{font-size:12.5px; font-weight:700; color:var(--ink-700);}
.cp-bulk-track{width:110px; height:5px; background:var(--ink-300); border-radius:6px; overflow:hidden;}
.cp-bulk-fill{height:100%; background:var(--green-600); border-radius:6px; transition:width .3s ease;}
.cp-bulk-right{display:flex; gap:8px; flex-wrap:wrap;}

/* week grouping + day cards */
.cp-week-label{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-300); margin:24px 0 12px;}
.cp-week-label:first-child{margin-top:0;}
.cp-day-grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px,1fr)); gap:14px;}
.cp-day-card { border:1px solid transparent; background:var(--card-bg); box-shadow:var(--shadow-sm); padding:12px; cursor:pointer; transition:box-shadow .15s ease, border-color .15s ease; position:relative; }
.cp-day-card:hover{box-shadow:var(--shadow-md);}
.cp-day-card:hover .cp-day-actions{opacity:1;}
.cp-day-card.selected{border-color:var(--purple-500); box-shadow:0 0 0 3px var(--purple-100);}
.cp-day-card.skipped{opacity:.4;}
.cp-day-top{display:flex; align-items:center; justify-content:space-between; margin-bottom:9px;}
.cp-day-date{font-size:12px; font-weight:700; color:var(--ink-700);}
.cp-day-sel{width:18px;height:18px;border-radius:6px;border:1.5px solid var(--ink-300); display:none; align-items:center; justify-content:center; background:var(--card-bg); flex-shrink:0;}
.cp-day-sel svg{width:11px;height:11px;color:#fff;}
.select-mode .cp-day-sel{display:flex;}
.cp-day-card.selected .cp-day-sel{background:var(--purple-600); border-color:var(--purple-600);}
.cp-day-thumb{width:100%; height:100px; border-radius:10px; background:var(--ink-100); display:flex; align-items:center; justify-content:center; color:var(--ink-300); margin-bottom:10px; overflow:hidden; position:relative;}
.cp-day-thumb svg{width:18px;height:18px; opacity:.6;}
.cp-day-thumb img{width:100%;height:100%;object-fit:cover;}
.cp-type-chip{position:absolute; top:8px; left:8px; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; padding:3px 8px; border-radius:20px; background:rgba(24,24,27,.6); color:#fff; backdrop-filter:blur(2px);}
.cp-day-platforms{position:absolute; top:8px; right:8px; display:flex; gap:4px;}
.cp-day-platforms .pf{width:19px;height:19px;border-radius:6px; background:rgba(255,255,255,.95); color:var(--ink-700); display:flex; align-items:center; justify-content:center;}
.cp-day-platforms .pf svg{width:10px;height:10px;}
.cp-day-caption{font-size:12px; color:var(--ink-500); line-height:1.5; margin-bottom:11px; min-height:34px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.cp-day-foot{display:flex; align-items:center; justify-content:space-between; gap:6px;}
.cp-status-chip{font-size:9.5px; font-weight:700; padding:3px 9px; border-radius:20px; letter-spacing:.02em;}
.cp-status-chip.draft{background:var(--ink-100); color:var(--ink-500);}
.cp-status-chip.edited{background:var(--blue-50); color:var(--blue-600);}
.cp-status-chip.approved{background:var(--green-50); color:var(--green-600);}
.cp-status-chip.conflict{background:var(--red-50); color:var(--red-600);}
.cp-day-actions{display:flex; gap:2px; opacity:0; transition:opacity .15s ease;}
.cp-day-actions button{width:23px;height:23px;border-radius:7px; border:none; background:transparent; color:var(--ink-500); display:flex; align-items:center; justify-content:center; cursor:pointer;}
.cp-day-actions button:hover{background:var(--ink-100); color:var(--ink-900);}
.cp-day-actions button svg{width:12px;height:12px;}
.cp-day-actions button:disabled{opacity:.35; cursor:not-allowed;}
.select-mode .cp-day-actions{display:none;}

/* edit drawer */
.cp-drawer-overlay{position:fixed; inset:0; background:rgba(24,24,27,.4); z-index:210; opacity:0; pointer-events:none; transition:opacity .2s ease;}
.cp-drawer-overlay.show{opacity:1; pointer-events:auto;}
.cp-drawer{position:fixed; top:0; right:0; height:100vh; width:420px; max-width:92vw; background:var(--card-bg); box-shadow:var(--shadow-lg); transform:translateX(100%); transition:transform .28s cubic-bezier(.34,1.06,.64,1); z-index:211; display:flex; flex-direction:column;}
.cp-drawer-overlay.show .cp-drawer{transform:translateX(0);}
.cp-drawer-head{display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--border); flex-shrink:0;}
.cp-drawer-head b{font-size:15px;}
.cp-drawer-head .sub{font-size:11.5px; color:var(--ink-500); margin-top:2px; font-weight:400;}
.cp-drawer-body{padding:22px; overflow-y:auto; flex:1;}
.cp-drawer-foot{padding:16px 22px 20px; border-top:1px solid var(--border); display:flex; gap:10px; flex-shrink:0;}
.cp-field{margin-bottom:20px;}
.cp-input, .cp-textarea, .cp-select{width:100%; border:1px solid var(--border); border-radius:11px; padding:10px 12px; font-size:13px; font-family:inherit; color:var(--ink-900); background:var(--page-bg); transition:border-color .15s ease;}
.cp-textarea{min-height:90px; resize:vertical; line-height:1.55;}
.cp-input:focus, .cp-textarea:focus, .cp-select:focus{outline:none; border-color:var(--purple-500);}
.cp-hashtags{display:flex; flex-wrap:wrap; gap:6px; margin-top:8px;}
.cp-hashtag-chip{background:var(--purple-50); color:var(--purple-600); font-size:11.5px; font-weight:600; padding:4px 9px 4px 10px; border-radius:14px; display:flex; align-items:center; gap:5px;}
.cp-hashtag-chip button{background:none; border:none; color:var(--purple-600); cursor:pointer; padding:0; display:flex;}
.cp-hashtag-chip button svg{width:10px;height:10px;}
.cp-img-preview{width:100%; height:150px; border-radius:12px; background:var(--ink-100); display:flex; align-items:center; justify-content:center; color:var(--ink-300); overflow:hidden; margin-bottom:10px;}
.cp-img-preview img{width:100%;height:100%;object-fit:cover;}
.cp-upload-btn{display:flex; align-items:center; justify-content:center; gap:7px; border:1.5px dashed var(--border); border-radius:12px; padding:12px; font-size:12.5px; font-weight:600; color:var(--ink-500); cursor:pointer;}
.cp-upload-btn:hover{border-color:var(--purple-500); color:var(--purple-600);}
.cp-platform-mini-row{display:flex; gap:8px;}
.cp-platform-mini{flex:1; display:flex; align-items:center; justify-content:center; gap:6px; padding:9px; border-radius:11px; border:1.5px solid var(--border); font-size:12px; font-weight:600; color:var(--ink-500); cursor:pointer;}
.cp-platform-mini.checked{border-color:var(--purple-500); background:var(--purple-50); color:var(--purple-600);}
.cp-platform-mini svg{width:14px;height:14px;}
.cp-regen-limit{font-size:11px; color:var(--ink-500); margin-top:6px;}

@media (max-width:640px){
  .cp-dur-grid{grid-template-columns:1fr;}
  .cp-day-grid{grid-template-columns:1fr;}
  .cp-drawer{width:100%; max-width:100%;}
}

/* .btn-ghost (Content Plan toolbar / caption editor): low-emphasis outlined button.
   Uses the same size tokens as .btn-primary / .btn-secondary so it lines up with them. */
.btn-ghost{display:inline-flex; align-items:center; justify-content:center; gap:6px; box-sizing:border-box; padding:var(--btn-pad-md); border-radius:var(--btn-r-md); font-size:var(--btn-fs-md); font-weight:var(--btn-fw); background:transparent; color:var(--ink-700); border:1px solid var(--border); cursor:pointer; transition:var(--btn-transition);}
.btn-ghost:hover{background:var(--ink-100);}
.btn-ghost:disabled{opacity:.5; cursor:not-allowed; pointer-events:none;}
.btn-ghost svg{width:15px; height:15px;}