/* SmartStudio — ortak tasarım sistemi (infinityelearning / yeniisgmevzuati dili) Tüm portal sayfaları bunu 'de link'ler → tek kaynaktan tutarlılık. */ :root { --brand-red: #c41e3a; --brand-dark: #1a1a1a; --brand-light: #fff5f6; --brand-accent: #e8364f; --ss-radius: 0.75rem; /* kart standart köşe */ --ss-radius-sm: 0.5rem; /* buton/rozet */ --ss-border: rgba(0,0,0,.07); --ss-shadow: 0 1px 3px rgba(16,24,40,.06); --ss-shadow-lift: 0 12px 30px -10px rgba(16,24,40,.18); } /* ── Global polish (tüm sayfalarda anında; per-page düzenleme gerekmez) ── */ html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } * { -webkit-tap-highlight-color: transparent; } :focus-visible { outline: 2px solid var(--brand-red); outline-offset: 2px; border-radius: 4px; } ::selection { background: rgba(196,30,58,.16); color: var(--brand-dark); } a, button { transition: color .15s ease, background-color .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease; } /* İnce, markalı kaydırma çubuğu */ * { scrollbar-width: thin; scrollbar-color: #cbd0d8 transparent; } ::-webkit-scrollbar { width: 9px; height: 9px; } ::-webkit-scrollbar-thumb { background: #cbd0d8; border-radius: 99px; border: 2px solid transparent; background-clip: content-box; } ::-webkit-scrollbar-thumb:hover { background: #aab2bd; background-clip: content-box; } /* Görsel/medya taşma güvenliği */ img, video, svg { max-width: 100%; } /* ── Modül kartı (mevcut) ── */ .card-module { background: #fff; border: 1px solid var(--ss-border); border-radius: 1rem; padding: 1.25rem; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; cursor: pointer; } .card-module:hover { transform: translateY(-2px); box-shadow: 0 10px 30px -12px rgba(196,30,58,.35); border-color: rgba(196,30,58,.4); } .card-module.locked { opacity: .55; cursor: not-allowed; } .card-module.locked:hover { transform: none; box-shadow: none; border-color: var(--ss-border); } /* ── Standart bileşen sınıfları (opt-in; yeni/uyarlanan ekranlarda kullan) ── */ .ss-card { background: #fff; border: 1px solid var(--ss-border); border-radius: var(--ss-radius); box-shadow: var(--ss-shadow); } .ss-card-hover { transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; } .ss-card-hover:hover { transform: translateY(-2px); box-shadow: var(--ss-shadow-lift); border-color: rgba(196,30,58,.35); } .ss-btn { display: inline-flex; align-items: center; gap: .4rem; font: 600 .85rem/1 Inter, system-ui, sans-serif; padding: .55rem .9rem; border-radius: var(--ss-radius-sm); border: 1px solid var(--ss-border); background: #fff; color: var(--brand-dark); cursor: pointer; white-space: nowrap; } .ss-btn:hover:not(:disabled) { background: #f3f4f6; } .ss-btn:disabled { opacity: .5; cursor: not-allowed; } .ss-btn-primary { background: var(--brand-red); border-color: var(--brand-red); color: #fff; } .ss-btn-primary:hover:not(:disabled) { background: var(--brand-accent); border-color: var(--brand-accent); } .ss-btn-danger { background: #fff; border-color: rgba(220,38,38,.35); color: #dc2626; } .ss-btn-danger:hover:not(:disabled) { background: #fef2f2; } .ss-btn-sm { padding: .35rem .6rem; font-size: .78rem; } .ss-badge { display: inline-flex; align-items: center; font: 600 .68rem/1.2 Inter, system-ui, sans-serif; padding: .2rem .55rem; border-radius: 99px; } .ss-badge-amber { background: rgba(245,158,11,.14); color: #b45309; } .ss-badge-gray { background: rgba(100,116,139,.14); color: #475569; } .ss-badge-blue { background: rgba(59,130,246,.14); color: #1d4ed8; } .ss-badge-green { background: rgba(22,163,74,.14); color: #047857; } .ss-badge-red { background: rgba(220,38,38,.12); color: #dc2626; } .ss-input { width: 100%; background: #fff; border: 1px solid var(--ss-border); border-radius: var(--ss-radius-sm); padding: .55rem .75rem; font: 400 .9rem Inter, system-ui, sans-serif; color: var(--brand-dark); } .ss-input:focus { outline: none; border-color: var(--brand-red); box-shadow: 0 0 0 3px rgba(196,30,58,.12); } .ss-stat { background: #fff; border: 1px solid var(--ss-border); border-radius: var(--ss-radius); box-shadow: var(--ss-shadow); padding: .9rem 1rem; } .ss-stat-label { font-size: .74rem; color: #6b7280; margin-bottom: .3rem; } .ss-stat-value { font-weight: 800; font-size: 1.5rem; color: var(--brand-dark); line-height: 1.1; } .ss-page-title { font-weight: 800; font-size: 1.4rem; color: var(--brand-dark); letter-spacing: -.01em; } .ss-section-title { font-size: .82rem; font-weight: 700; color: #6b7280; text-transform: uppercase; letter-spacing: .05em; } .ss-muted { color: #6b7280; }