/**
 * GTOS Design Grammar — PROGRAM-002 / UX-002
 * Platform geneli tipografi, renk ve bileşen ölçeği (light/dark).
 * unified.css legacy hex/Montserrat katmanını kademeli olarak token'a bağlar.
 * Sidebar layout dokunulmaz (cc-ux-15). Yükleme: gtos-module-premium.css sonrası.
 */

/* —— 1. Uygulama tabanı —— */
#maytras-app {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-md);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

#maytras-app .main-content {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

/* —— 2. Başlık ölçeği (display → section) —— */
#maytras-app .main-content h1,
#maytras-app .gtos-mp__title,
#maytras-app .workspace-title {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-display);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--gtos-leading-tight);
  color: var(--gtos-color-text);
}

#maytras-app .main-content h2,
#maytras-app .module-workspace-title,
#maytras-app .module-title,
#maytras-app .detail-panel h2,
#maytras-app .a01-detail-panel-title {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-workspace-title);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: var(--gtos-leading-tight);
  color: var(--gtos-color-text);
}

#maytras-app .main-content h3,
#maytras-app .module-card .module-info h3,
#maytras-app .detail-panel h3,
#maytras-app .workspace-section-title {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-lg);
  font-weight: 600;
  letter-spacing: -0.01em;
  line-height: var(--gtos-leading-tight);
  color: var(--gtos-color-text);
}

#maytras-app .main-content h4,
#maytras-app .gtos-mp__panel-title,
#maytras-app .panel-section-label {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: var(--gtos-leading-tight);
  color: var(--gtos-color-text-muted);
}

/* —— 3. Gövde metni katmanları —— */
#maytras-app p,
#maytras-app .module-workspace-body,
#maytras-app .module-description,
#maytras-app .detail-panel p,
#maytras-app .gtos-mp__panel-body {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-md);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text);
}

#maytras-app .module-workspace-subtitle,
#maytras-app .workspace-subtitle,
#maytras-app .module-desc,
#maytras-app .gtos-mp__sub,
#maytras-app .module-id,
#maytras-app .module-features li,
#maytras-app label:not(.btn-primary):not(.gtos-cc__btn) {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-freshness,
#maytras-app .caption,
#maytras-app .meta-label,
#maytras-app .hint-text,
#maytras-app small:not(.sidebar-account-dock__hint) {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-micro);
  line-height: var(--gtos-leading-tight);
  color: var(--gtos-color-text-muted);
}

#maytras-app code,
#maytras-app pre,
#maytras-app .mono,
#maytras-app .gtos-mono {
  font-family: var(--gtos-font-mono);
  font-size: 0.92em;
}

/* —— 4. Modül workspace — Montserrat köprüsü —— */
#maytras-app .module-workspace-title,
#maytras-app .module-workspace-subtitle,
#maytras-app .module-workspace-body,
#maytras-app .module-workspace-back,
#maytras-app .module-workspace-agent-chip,
#maytras-app [class*='module-workspace'] {
  font-family: var(--gtos-font-sans);
}

#maytras-app .module-workspace-title {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-workspace-title);
  color: var(--gtos-color-text);
}

#maytras-app .module-workspace-subtitle {
  font-size: var(--gtos-text-sm);
  font-weight: 500;
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-workspace-body {
  font-size: var(--gtos-text-md);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text);
}

#maytras-app .module-workspace-back {
  font-size: var(--gtos-text-sm);
  font-weight: 600;
  color: var(--gtos-color-text-muted);
}

/* —— 5. Modül kartları & grid —— */
#maytras-app .module-card {
  background: var(--gtos-color-surface);
  border-color: var(--gtos-color-border);
  color: var(--gtos-color-text);
}

#maytras-app .module-title {
  font-size: var(--gtos-text-xl);
}

#maytras-app .module-id,
#maytras-app .module-description,
#maytras-app .module-features li {
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-features li {
  font-size: var(--gtos-text-sm);
}

/* —— 6. gtos-mp premium shell hizalama —— */
#maytras-app .gtos-mp {
  font-family: var(--gtos-font-sans);
  color: var(--gtos-color-text);
}

#maytras-app .gtos-mp__title {
  font-family: var(--gtos-font-display);
  font-size: clamp(1.05rem, 0.95rem + 0.4vw, 1.3rem);
  color: var(--gtos-color-text);
}

#maytras-app .gtos-mp__sub {
  font-size: var(--gtos-text-sm);
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-mp__panel-title {
  font-size: var(--gtos-text-micro);
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-mp__panel,
#maytras-app .gtos-mp__brief,
#maytras-app .gtos-mp__rail-block {
  background: var(--gtos-color-surface);
  border-color: var(--gtos-color-border);
  color: var(--gtos-color-text);
}

/* —— 7. Form kontrolleri —— */
#maytras-app input:not([type='checkbox']):not([type='radio']):not([type='range']),
#maytras-app select,
#maytras-app textarea,
#maytras-app .form-control,
#maytras-app .module-agent-insight-select {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  line-height: var(--gtos-leading-tight);
  color: var(--maytras-shell-input-text, var(--gtos-color-text));
  background: var(--maytras-shell-input-bg, var(--gtos-color-surface));
  border-color: var(--maytras-shell-input-border, var(--gtos-color-border));
}

#maytras-app input::placeholder,
#maytras-app textarea::placeholder {
  color: var(--gtos-color-text-muted);
  opacity: 0.85;
}

#maytras-app label,
#maytras-app .detail-panel label,
#maytras-app .form-label {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  font-weight: 600;
  color: var(--gtos-color-text);
}

/* —— 8. Tablolar —— */
#maytras-app table,
#maytras-app .data-table,
#maytras-app .module-workspace-body table {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  color: var(--gtos-color-text);
}

#maytras-app th {
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gtos-color-text-muted);
}

#maytras-app td {
  font-size: var(--gtos-text-sm);
  color: var(--gtos-color-text);
}

#maytras-app tbody tr:hover td {
  color: var(--gtos-color-text);
}

/* —— 9. Butonlar —— */
#maytras-app .btn,
#maytras-app .btn-primary,
#maytras-app .btn-secondary,
#maytras-app .btn-ghost,
#maytras-app .module-agent-insight-btn,
#maytras-app [class*='-btn']:not(.sidebar-module-link):not(.gtos-cc__btn) {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  font-weight: 600;
  line-height: var(--gtos-leading-tight);
}

#maytras-app .btn-primary,
#maytras-app button.btn-primary {
  color: #fff;
  background: var(--gtos-color-primary);
  border-color: color-mix(in srgb, var(--gtos-color-primary) 80%, #000);
}

#maytras-app .btn-primary:hover {
  background: var(--gtos-color-primary-strong);
}

/* —— 10. Detay paneli & overlay —— */
#maytras-app .detail-panel,
#maytras-app #billing-overlay .detail-panel,
#maytras-app .detail-overlay .detail-panel {
  font-family: var(--gtos-font-sans);
  background: var(--gtos-color-surface);
  border-color: var(--gtos-color-border);
  color: var(--gtos-color-text);
}

#maytras-app .detail-panel h2,
#maytras-app .detail-panel h3 {
  color: var(--gtos-color-text);
}

#maytras-app .detail-panel p,
#maytras-app .detail-panel li {
  color: var(--gtos-color-text-muted);
  font-size: var(--gtos-text-sm);
}

/* —— 11. AI agent insight —— */
#maytras-app .module-agent-insight {
  border-color: var(--gtos-color-border);
  background: color-mix(in srgb, var(--gtos-color-surface) 92%, var(--gtos-color-ai-soft));
  color: var(--gtos-color-text);
}

#maytras-app .module-agent-insight-top strong {
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  color: var(--gtos-color-text);
}

#maytras-app .module-agent-insight-top small {
  font-size: var(--gtos-text-2xs);
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-agent-insight-body {
  font-size: var(--gtos-text-sm);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text);
  background: var(--gtos-color-surface);
  border-color: var(--gtos-color-border);
}

#maytras-app .module-agent-insight-body.is-empty {
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-agent-insight-body.is-error {
  color: var(--gtos-color-danger);
}

#maytras-app .module-agent-insight-btn {
  font-size: var(--gtos-text-micro);
  color: var(--gtos-color-primary-strong);
  background: color-mix(in srgb, var(--gtos-color-primary) 10%, var(--gtos-color-surface));
  border-color: color-mix(in srgb, var(--gtos-color-primary) 35%, var(--gtos-color-border));
}

/* —— 12. Semantik renk yardımcıları —— */
#maytras-app .text-success,
#maytras-app .status-success {
  color: var(--gtos-color-success);
}

#maytras-app .text-warning,
#maytras-app .status-warning {
  color: var(--gtos-color-warning);
}

#maytras-app .text-danger,
#maytras-app .status-danger,
#maytras-app .status-error {
  color: var(--gtos-color-danger);
}

#maytras-app .text-info,
#maytras-app .status-info {
  color: var(--gtos-color-info);
}

#maytras-app .text-muted,
#maytras-app .gtos-text-muted {
  color: var(--gtos-color-text-muted);
}

/* —— 13. Legacy hardcoded metin renkleri (sık görülen hex) —— */
#maytras-app .module-workspace-subtitle,
#maytras-app [style*='color: #64748b'],
#maytras-app [style*='color:#64748b'] {
  color: var(--gtos-color-text-muted);
}

#maytras-app .module-workspace-back,
#maytras-app .module-workspace-title {
  color: var(--gtos-color-text);
}

/* —— 14. Metrik / KPI strip —— */
#maytras-app .gtos-metric-card,
#maytras-app .kpi-card,
#maytras-app .metric-card {
  font-family: var(--gtos-font-sans);
  background: var(--gtos-color-surface);
  border-color: var(--gtos-color-border);
  color: var(--gtos-color-text);
}

#maytras-app .gtos-metric-card .metric-label,
#maytras-app .kpi-card .kpi-label {
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-metric-card .metric-value,
#maytras-app .kpi-card .kpi-value {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-xl);
  font-weight: 700;
  color: var(--gtos-color-text);
}

/* —— 15. Toast & banner —— */
#maytras-app .maytras-toast {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  color: var(--gtos-color-text);
  background: var(--gtos-color-surface-elevated);
  border-color: var(--gtos-color-border);
}

/* —— 16. Auth overlay tipografi —— */
#maytras-app #auth-overlay,
#maytras-app #billing-overlay {
  font-family: var(--gtos-font-sans);
  color: var(--gtos-color-text);
}

#maytras-app #auth-overlay h1,
#maytras-app #auth-overlay h2,
#maytras-app #billing-overlay h2 {
  font-family: var(--gtos-font-display);
  color: var(--gtos-color-text);
}

#maytras-app #auth-overlay p,
#maytras-app #billing-overlay p {
  font-size: var(--gtos-text-sm);
  color: var(--gtos-color-text-muted);
}

/* —— 17. Montserrat kalıntıları — workspace & detail —— */
#maytras-app [class*='module-workspace'],
#maytras-app .detail-panel,
#maytras-app .dashboard-overview,
#maytras-app .modules-grid {
  font-family: var(--gtos-font-sans);
}

#maytras-app .module-workspace-title,
#maytras-app .module-workspace-subtitle,
#maytras-app .detail-panel h2,
#maytras-app .detail-panel h3 {
  font-family: var(--gtos-font-display);
}

/* —— 18. North Star hero strip —— */
#maytras-app .gtos-north-star__eyebrow {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.12em;
  color: var(--gtos-color-primary);
}

#maytras-app .gtos-north-star__title {
  font-family: var(--gtos-font-display);
  font-size: clamp(1.15rem, 1rem + 0.5vw, 1.4rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--gtos-color-text);
}

#maytras-app .gtos-north-star__sub {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-north-star__trust li {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-compact);
  font-weight: 600;
  color: var(--gtos-color-text);
}

html[data-theme='dark'] #maytras-app .gtos-north-star__eyebrow {
  color: var(--gtos-color-primary-strong);
}

html[data-theme='dark'] #maytras-app .gtos-north-star__title {
  color: var(--gtos-color-text);
}

html[data-theme='dark'] #maytras-app .gtos-north-star__sub {
  color: var(--gtos-color-text-muted);
}

html[data-theme='dark'] #maytras-app .gtos-north-star__trust li {
  color: var(--gtos-color-text);
}

/* —— 19. Command Center —— */
#maytras-app #gtos-command-center,
#maytras-app .gtos-cc {
  font-family: var(--gtos-font-sans);
  color: var(--gtos-color-text);
}

#maytras-app .gtos-cc__section-title,
#maytras-app .gtos-cc__panel-title {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-lg);
  font-weight: 700;
  color: var(--gtos-color-text);
}

#maytras-app .gtos-cc__eyebrow,
#maytras-app .gtos-cc__label,
#maytras-app .gtos-cc__meta {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-cc__body,
#maytras-app .gtos-cc__desc,
#maytras-app .gtos-cc__list-item {
  font-size: var(--gtos-text-sm);
  line-height: var(--gtos-leading);
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-cc__kpi-value,
#maytras-app .gtos-cc__stat-value {
  font-family: var(--gtos-font-display);
  font-size: var(--gtos-text-xl);
  font-weight: 700;
  color: var(--gtos-color-text);
}

#maytras-app .gtos-cc__btn {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-sm);
  font-weight: 600;
}

/* —— 20. Context bar —— */
#maytras-app .gtos-ctx,
#maytras-app .gtos-context-bar {
  font-family: var(--gtos-font-sans);
}

#maytras-app .gtos-ctx__label {
  font-size: var(--gtos-text-micro);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-ctx__chip span {
  font-size: var(--gtos-text-micro);
  color: var(--gtos-color-text-muted);
}

#maytras-app .gtos-ctx__chip strong {
  font-size: var(--gtos-text-sm);
  font-weight: 600;
  color: var(--gtos-color-text);
}

/* —— 21. Modül mikro etiket normalizasyonu —— */
#maytras-app .module-workspace-body [class*='-label'],
#maytras-app .module-workspace-body [class*='__label'],
#maytras-app .module-workspace-body [class*='-meta'],
#maytras-app .module-workspace-body [class*='__meta'],
#maytras-app .module-workspace-body [class*='-hint'],
#maytras-app .module-workspace-body [class*='__hint'],
#maytras-app .module-workspace-body [class*='-badge'],
#maytras-app .module-workspace-body [class*='__badge'] {
  font-family: var(--gtos-font-sans);
  font-size: var(--gtos-text-micro);
  color: var(--gtos-color-text-muted);
}