/* Base */
.ttt * { box-sizing: border-box; }
.ttt{ --bg:#0b1220; --card:#0f172a; --text:#e5e7eb; --muted:#94a3b8; --line:#1f2b4a; --accent:#3b82f6; --accent-contrast:#fff; --shadow:0 10px 30px rgba(0,0,0,.45); --hover-ring:0 0 0 3px rgba(59,130,246,.14); --radius: 6px; }
.ttt-wrap{display:flex;justify-content:center}
.ttt-card{ width:min(980px,100%); margin:16px auto; background:var(--card);
  border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; }

/* Universal Button Style */
.ttt-btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:0 16px;border:1px solid var(--line);
  border-radius:var(--radius);cursor:pointer;
  background:var(--bg);color:var(--text);
  transition:border-color .15s, box-shadow .15s, filter .15s, transform .02s, width .15s ease;
  text-decoration:none; font-weight:600; line-height:1; height:46px;
  vertical-align:middle; white-space:nowrap;
}
.ttt-btn svg.icon{display:block;flex:0 0 auto}
.ttt-btn:hover{border-color:var(--accent); box-shadow:var(--hover-ring); filter:brightness(0.98)}
.ttt-btn:active{transform:translateY(1px)}
.ttt-btn--primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast)}
.ttt-btn.is-disabled{
  opacity:.55; cursor:not-allowed; filter:grayscale(0.2) brightness(0.85);
  border-color:var(--line) !important; box-shadow:none !important;
}
.ttt-btn .ttt-label{ display:inline-block; pointer-events:none; }

/* Tabs header */
.ttt-tabs{ display:flex;justify-content:space-between;align-items:center;gap:12px;
  padding:16px;border-bottom:1px solid var(--line); flex-wrap:wrap; }
.ttt-tabs-left{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ttt-tabs-right{display:flex;align-items:center;gap:12px}
@media (max-width:640px){ .ttt-tabs-left{flex:1} .ttt-tabs-right{width:100%;justify-content:flex-start} }

/* Tab buttons (restored design) */
.ttt-tab{
  appearance:none; border:1px solid var(--line); background:var(--bg);
  color:var(--text); height:46px; padding:0 14px; border-radius:var(--radius);
  font-weight:700; letter-spacing:.1px; cursor:pointer; display:inline-flex; align-items:center; gap:6px;
  transition:border-color .15s, box-shadow .15s, background-color .15s, color .15s, transform .02s;
}
.ttt-tab:hover{ border-color:var(--accent); box-shadow:var(--hover-ring); }
.ttt-tab[aria-selected="true"]{ background:var(--accent); color:var(--accent-contrast); border-color:var(--accent); }
.ttt-tab.is-disabled{ opacity:.55; cursor:not-allowed; }
.ttt-tab svg.icon{ display:inline-block }

/* ==== Compact quota (no reset date) ==== */
.ttt-quota-compact{
  display:inline-flex; align-items:center; gap:8px;
  font-size:12px; color:var(--muted); line-height:1;
  padding:6px 8px; border:1px solid var(--line);
  border-radius:999px; background:rgba(15,23,42,.6);
  white-space:nowrap;
}
.ttt-qpill{
  background:rgba(59,130,246,.14);
  color:#bfdbfe;
  border:1px solid rgba(59,130,246,.35);
  padding:4px 8px;
  border-radius:999px;
  font-weight:700;
  letter-spacing:.2px;
}
.ttt-qremain strong{ color:#e5e7eb; font-weight:800; }
.ttt-qsep{ opacity:.6; }
.ttt-qsilent{ display:none !important; }
@media (max-width:480px){
  .ttt-quota-compact{ font-size:11px; padding:6px 8px; gap:6px; }
  .ttt-qpill{ padding:3px 7px; }
}

/* Inputs & result */
.ttt-pane{padding:16px}
.ttt-row{display:flex;gap:10px;flex-wrap:wrap}
.ttt-input{flex:1;min-width:260px}

.ttt-field{width:100%;padding:14px;border:1px solid var(--line)!important;border-radius:var(--radius)!important;
  background:var(--bg)!important;color:var(--text)!important;outline:none;transition:border-color .15s, box-shadow .15s; caret-color:var(--text);}
.ttt-field:hover{ border-color:var(--accent); box-shadow:var(--hover-ring) }
.ttt-field:focus{ box-shadow:var(--ring); border-color:#93c5fd; background:var(--bg); color:var(--text) }
.ttt-field[readonly]{ background:var(--bg) }
.ttt-field--error{ border-color:#ef4444 !important; box-shadow:0 0 0 3px rgba(239,68,68,.20) !important; }
textarea#ttt-bulk-urls { min-height: 160px; margin-bottom: 12px; }
	
.ttt-result{display:none;margin-top:8px;}
.ttt-toolbar{display:flex;justify-content:space-between;align-items:center;margin:12px 0;gap:10px;flex-wrap:wrap}
.ttt-subactions{display:flex;align-items:center;gap:10px}
.ttt-counter{color:var(--muted);font-size:12px}
.ttt-textarea--single{min-height:420px;line-height:1.55;white-space:pre-wrap;resize:vertical;border-radius:var(--radius)}
.ttt-textwrap-single{ position:relative; }

/* Loading sheen */
@keyframes ttt-sheen{ 0%{background-position:-200% 0} 100%{background-position:200% 0} }
.ttt-loading{
  background:linear-gradient(90deg, rgba(255,255,255,0.03) 25%, rgba(255,255,255,0.08) 50%, rgba(255,255,255,0.03) 75%);
  background-size:200% 100%;
  animation: ttt-sheen 1.2s linear infinite;
  opacity:.85;
}

/* Overlays (ONLY over text areas) */
.ttt-overlay{
  position:absolute; inset:0; display:none; align-items:center; justify-content:center;
  background:rgba(15,23,42,.55); backdrop-filter:saturate(120%) blur(2px);
  border-radius:var(--radius); z-index:4;
}
.ttt-overlay .ttt-spinner{display:inline-block !important; width:22px;height:22px;border-radius:50%;border:3px solid rgba(148,163,184,.4);border-top-color:#60a5fa;animation:ttt-spin 1s linear infinite}

/* Status */
.ttt-status{display:flex;align-items:center;gap:10px;color:var(--muted);font-size:13px;min-height:26px;padding:8px 0; position:relative;}
.ttt-spinner{width:16px;height:16px;border-radius:50%;border:2px solid rgba(148,163,184,.4);border-top-color:#60a5fa;animation:ttt-spin 1s linear infinite;display:none}
@keyframes ttt-spin{to{transform:rotate(360deg)}}
.ttt-progress{height:3px;background:linear-gradient(90deg,#60a5fa,#2563eb,#22d3ee);background-size:200% 100%;animation:ttt-stripe 2s linear infinite;display:none;border-radius:999px}
@keyframes ttt-stripe{0%{background-position:0% 0}100%{background-position:200% 0}}

/* Alerts */
.ttt-alert{display:none;padding:12px 14px;border-radius:var(--radius);margin-bottom:12px}
.ttt-alert--ok{background:rgba(16,185,129,.12);border:1px solid rgba(16,185,129,.35);color:#065f46}
.ttt-alert--err{background:rgba(239,68,68,.12);border:1px solid rgba(239,68,68,.35);color:#7f1d1d}
.ttt-alert .ttt-close{float:right;cursor:pointer;opacity:.7}

/* Video info (single) */
.ttt-vinfo{display:none;border:1px solid var(--line);border-radius:var(--radius);padding:12px;background:var(--card);box-shadow:var(--shadow);margin-top:8px}
.ttt-vrow{display:flex;gap:12px;align-items:flex-start}
.ttt-thumb{width:120px;height:160px;border-radius:var(--radius);object-fit:cover;border:1px solid var(--line)}
.ttt-vmeta{flex:1}
.ttt-vtitle{margin:0 0 6px 0;color:var(--text); text-align:left;}
.ttt-vsub{color:var(--muted);font-size:12px;margin-bottom:6px; text-align:left;}
.ttt-vstats{display:flex;gap:12px;color:var(--muted);font-size:12px;flex-wrap:wrap}

/* Paywall + BLUR */
.ttt-paywall{ display:none; position:absolute; inset:0; z-index:5; align-items:center; justify-content:center; pointer-events:auto; }
.ttt-paywall-inner{ max-width:560px; width:calc(100% - 24px); text-align:center;
  background:rgba(15,23,42,.92); border:1px solid var(--line); border-radius:var(--radius); padding:18px; box-shadow:var(--shadow); }
.ttt-paywall-title{ color:#e5e7eb; font-size:16px; margin-bottom:10px; }
.ttt-paywall-note{ color:#94a3b8; font-size:13px; margin-top:10px; }
.ttt-textwrap-single.is-blurred > .ttt-field{ filter: blur(3px); }

/* ===== Bulk ===== */
.ttt-bulk-list{display:flex;flex-direction:column;gap:8px;margin-top:12px}
.ttt-bulk-row{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:start;
  border:1px solid var(--line);border-radius:var(--radius);padding:10px;background:var(--card);
}
.ttt-bulk-url{grid-column:1;color:var(--text);word-break:break-all;text-align:left;}
.ttt-bulk-status{grid-column:2;font-size:12px;color:var(--muted);text-align:right;white-space:nowrap;align-self:start;padding-top:2px;}
.ttt-bulk-actions{grid-column:1/-1;display:flex;gap:8px;justify-self:start;align-items:center;position:relative;flex-wrap:wrap;margin-top:2px;margin-bottom:2px}
.ttt-bulk-actions[hidden]{display:none!important}

.ttt-bulk-vinfo{grid-column:1/-1; display:none; border:1px solid var(--line);border-radius:var(--radius);padding:8px;margin-top:6px}
.ttt-bulk-vrow{display:flex;gap:10px;align-items:flex-start}
.ttt-bulk-thumb{width:96px;height:128px;border-radius:var(--radius);object-fit:cover;border:1px solid var(--line)}
.ttt-bulk-vmeta{flex:1}
.ttt-bulk-vtitle{margin:0 0 4px 0;color:var(--text);font-size:14px;line-height:1.3; text-align:left; }
.ttt-bulk-vsub{color:var(--muted);font-size:12px;margin-bottom:4px; text-align:left; }
.ttt-bulk-vstats{display:flex;gap:10px;color:var(--muted);font-size:12px;flex-wrap:wrap}

.ttt-bulk-error{color:#b91c1c;font-size:12px}
.ttt-bulk-text{grid-column:1/-1; display:none;margin-top:8px; position:relative;}
.ttt-textarea--bulk{width:100%;min-height:160px;line-height:1.55;white-space:pre-wrap;resize:vertical;border-radius:var(--radius)}

/* ===== History ===== */
#ttt-history-card { padding: 0px }
#ttt-history-card h3 {color: #e5e7eb; margin-bottom:10px; text-align: left;}
.ttt-hsub { margin: 0 0 20px; color: #94a3b8; font-size: 14px; text-align: left; }
.ttt-history { display: grid; gap: 6px; }
.ttt-hrow {
  display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px;
  padding: 8px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg);
}
.ttt-hline {
  min-width: 0; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px;
}
.ttt-hlink {
  color: #e5e7eb; text-decoration: none; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;
  font-size: 13px; line-height: 1.2; text-align: left;
}
.ttt-hlink:hover { text-decoration: underline; }
.ttt-hwhen { color: #94a3b8; font-size: 11px; white-space: nowrap; }
.ttt-hactions { display: inline-flex; gap: 4px; }
.ttt-hactions .ttt-btn { padding: 6px; height: 28px; min-width: 28px; border-radius: 8px; line-height: 0; }
.ttt-hactions .ttt-btn .ttt-label {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.ttt-ic { width: 16px; height: 16px; display: inline-block; vertical-align: middle; }
.ttt-htext { grid-column: 1 / -1; margin-top: 6px; }
.ttt-htextarea { height: 110px; font-size: 13px; }
#ttt-alert-history { margin-bottom: 6px; padding: 6px 8px; font-size: 12px }

/* General transcript upgrade */
.ttt-source-tabs{display:flex;gap:8px;align-items:center;margin-bottom:12px;flex-wrap:wrap}
.ttt-source-tabs label{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:8px 12px;background:var(--bg);color:var(--text);font-size:13px;cursor:pointer}
.ttt-source-tabs input{accent-color:var(--accent)}
.ttt-platform-badge{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;padding:2px 7px;margin-right:6px;font-size:11px;color:var(--muted);vertical-align:middle;background:var(--bg)}
.ttt-segments{margin-top:12px;border:1px solid var(--line);border-radius:var(--radius);background:var(--card);overflow:hidden}
.ttt-segment{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:10px 12px;border-bottom:1px solid var(--line)}
.ttt-segment:last-child{border-bottom:0}
.ttt-segment-time{color:var(--muted);font-size:12px;font-weight:700;line-height:1.5}
.ttt-segment-text{color:var(--text);font-size:14px;line-height:1.55;text-align:left}
@media (max-width:520px){.ttt-segment{grid-template-columns:1fr;gap:4px}.ttt-subactions{flex-wrap:wrap}.ttt-source-tabs label{flex:1;justify-content:center}}

/* UX refinement: URL / Upload / Bulk as primary modes */
.ttt-tabs-left{gap:10px;flex-wrap:wrap}
.ttt-tab#ttt-tab-upload[aria-selected="true"]{background:var(--accent);color:var(--accent-contrast);border-color:var(--accent)}
.ttt-upload-panel{display:flex;flex-direction:column;gap:12px;width:100%}
.ttt-file-input{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;padding:0!important;margin:-1px!important}
.ttt-upload-box{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:150px;padding:24px;border:1.5px dashed var(--line);border-radius:var(--radius);background:rgba(15,23,42,.55);color:var(--text);cursor:pointer;text-align:center;transition:border-color .15s, box-shadow .15s, background-color .15s, opacity .15s}
.ttt-upload-box:hover{border-color:var(--accent);box-shadow:var(--hover-ring);background:rgba(59,130,246,.08)}
.ttt-upload-box.is-disabled{opacity:.55;cursor:not-allowed;pointer-events:none}
.ttt-upload-icon{width:42px;height:42px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:rgba(59,130,246,.15);border:1px solid rgba(59,130,246,.35);color:#bfdbfe;font-size:24px;font-weight:800;line-height:1}
.ttt-upload-title{font-weight:800;font-size:16px;color:var(--text);max-width:100%;word-break:break-word}
.ttt-upload-sub{font-size:12px;color:var(--muted)}
.ttt-upload-progress-wrap{height:8px;border-radius:999px;overflow:hidden;background:rgba(148,163,184,.18);border:1px solid var(--line)}
.ttt-upload-progress-bar{height:100%;border-radius:999px;background:linear-gradient(90deg,#60a5fa,#2563eb);transition:width .18s ease}
.ttt-download-wrap{position:relative;display:inline-flex}
.ttt-caret{font-size:12px;opacity:.8;margin-left:4px}
.ttt-download-dropdown{position:absolute;top:calc(100% + 6px);right:0;min-width:130px;background:var(--card);border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow);padding:6px;z-index:20}
.ttt-download-dropdown button{display:block;width:100%;border:0;background:transparent;color:var(--text);padding:9px 10px;border-radius:8px;text-align:left;cursor:pointer;font-weight:700}
.ttt-download-dropdown button:hover{background:rgba(59,130,246,.12)}
.ttt-textwrap-single{display:none!important}
.ttt-result .ttt-segments{margin-top:0}
.ttt-subactions{position:relative;flex-wrap:wrap}

/* v3.3.2 UX fixes */
.ttt-url-modes{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:0 0 14px 0}
.ttt-mode-tab{appearance:none;border:1px solid var(--line);background:var(--bg);color:var(--text);height:38px;padding:0 13px;border-radius:var(--radius);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:6px;transition:border-color .15s,box-shadow .15s,background-color .15s,color .15s}
.ttt-mode-tab:hover{border-color:var(--accent);box-shadow:var(--hover-ring)}
.ttt-mode-tab[aria-selected="true"]{background:rgba(59,130,246,.16);border-color:rgba(59,130,246,.55);color:#bfdbfe}
.ttt-mode-tab.is-disabled{opacity:.55;cursor:not-allowed;box-shadow:none!important}
.ttt-upload-action-row{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ttt-upload-action-row .ttt-btn{min-width:132px;justify-content:center}
.ttt-upload-progress-wrap,.ttt-upload-progress-bar{display:none!important}
@media (max-width:520px){.ttt-upload-action-row .ttt-btn{width:100%}.ttt-url-modes .ttt-mode-tab{flex:1;justify-content:center}}


.ttt-upload-box.is-dragover{border-color:#2563eb;background:rgba(37,99,235,.10)}
.ttt-upload-queue{display:flex;flex-direction:column;gap:8px;margin-top:12px;width:100%}
.ttt-upload-qrow{
  display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;
  border:1px solid var(--line);border-radius:var(--radius);padding:10px;background:var(--card);
}
@media (max-width:720px){.ttt-upload-qrow{grid-template-columns:1fr;gap:6px}}
.ttt-upload-qname{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left}
.ttt-upload-qstatus{color:var(--muted);font-size:12px;text-align:right}
@media (max-width:720px){.ttt-upload-qstatus{text-align:left}}
.ttt-upload-qtop,.ttt-upload-qbar{display:none!important}

/* v3.3.24: bulk file rows reuse the same UI pattern as bulk URL rows */
.ttt-upload-qrow .ttt-bulk-row .ttt-upload-qstatus{text-align:right;}

/* v3.3.26: bulk transcripts match single result UI and include downloads */
.ttt-bulk-segments{margin-top:0}
.ttt-bulk-download-wrap{position:relative}
.ttt-bulk-download-dropdown{right:0;left:auto}
.ttt-bulk-text .ttt-segments{margin-top:0}
@media (max-width:720px){.ttt-bulk-download-dropdown{left:0;right:auto}}

.ttt-hide-timestamps .ttt-segment-time{display:none!important}
.ttt-toggle-timestamps,.ttt-bulk-toggle-timestamps{white-space:nowrap}

/* v3.3.29: keep pending bulk actions hidden and use switch-style timestamp control */
[hidden]{display:none!important}
.ttt-timestamp-toggle{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:700;line-height:1;cursor:pointer;user-select:none;white-space:nowrap}
.ttt-timestamp-toggle input{position:absolute;opacity:0;pointer-events:none}
.ttt-timestamp-toggle .ttt-switch{width:34px;height:18px;border-radius:999px;background:rgba(148,163,184,.24);border:1px solid var(--line);position:relative;transition:background-color .15s,border-color .15s}
.ttt-timestamp-toggle .ttt-switch:before{content:'';position:absolute;width:12px;height:12px;left:2px;top:2px;border-radius:999px;background:var(--muted);transition:transform .15s,background-color .15s}
.ttt-timestamp-toggle input:checked + .ttt-switch{background:rgba(59,130,246,.25);border-color:rgba(59,130,246,.55)}
.ttt-timestamp-toggle input:checked + .ttt-switch:before{transform:translateX(16px);background:#bfdbfe}
.ttt-timestamp-toggle:has(input:disabled){opacity:.55;cursor:not-allowed}
.ttt-hide-timestamps .ttt-segment{grid-template-columns:1fr}
.ttt-hide-timestamps .ttt-segment-text{grid-column:1/-1}

/* v3.3.32: keep per-item status at the right of the URL/file row */
.ttt-bulk-row .ttt-bulk-status{grid-column:2;text-align:right;justify-self:end}
.ttt-bulk-row .ttt-bulk-actions{grid-column:1/-1;justify-self:start}
@media (max-width:720px){
  .ttt-bulk-row{grid-template-columns:1fr}
  .ttt-bulk-row .ttt-bulk-url,
  .ttt-bulk-row .ttt-bulk-status,
  .ttt-bulk-row .ttt-bulk-actions{grid-column:1}
  .ttt-bulk-row .ttt-bulk-status{text-align:left;justify-self:start;white-space:normal}
}