/** * Clientarea — müşteri paneli (mat yüzey, sınır çizgileri, cam/morphism yok) * Birincil renkler: içi :root (header-meta) + üye paneli header-meta */ :root { --ca-bg: #f1f5f9; --ca-surface: #ffffff; --ca-sidebar: #0f172a; --ca-sidebar-muted: #94a3b8; --ca-sidebar-hover: #1e293b; --ca-border: #e2e8f0; --ca-text: #0f172a; --ca-muted: #64748b; --ca-accent: var(--ca-primary, #1d4ed8); --ca-accent-hover: var(--ca-primary-hover, #1e40af); --ca-danger: #b91c1c; --ca-success: #15803d; } /* Tema seçenekleri (header-meta) */ .ca-site { min-height: 100vh; display: flex; flex-direction: column; background: var(--ca-bg); color: var(--ca-text); } .ca-site-main { flex: 1; } /* Genel site üst şerit (giriş / kayıt sayfaları) */ .ca-public-header { background: var(--ca-surface); border-bottom: 1px solid var(--ca-border); } .ca-public-header__inner { max-width: 1200px; margin: 0 auto; padding: 0.75rem 1rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1rem; } .ca-public-header__start { display: flex; align-items: center; gap: 0.5rem; min-width: 0; } .ca-public-logo img { max-height: 40px; width: auto; } .ca-primary-nav { flex: 1 1 auto; display: flex; justify-content: center; min-width: 0; } .ca-public-header__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; } /* Botble ana menü (main-menu) */ .ca-menu-root { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 0.15rem; } .ca-menu-root .ca-menu-item { position: relative; margin: 0; } .ca-menu-root .ca-menu-link { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.45rem 0.65rem; border-radius: 4px; color: var(--ca-text); text-decoration: none; font-weight: 500; font-size: 0.9375rem; white-space: nowrap; } .ca-menu-root .ca-menu-item.active > .ca-menu-link, .ca-menu-root .ca-menu-link:hover { color: var(--ca-primary); background: color-mix(in srgb, var(--ca-primary, #1d4ed8) 14%, transparent); } .ca-menu-root .ca-menu-chevron { display: inline-flex; opacity: 0.7; } .ca-menu--sub { display: none; position: absolute; left: 0; top: 100%; z-index: 20; min-width: 220px; margin: 0; padding: 0.35rem 0; list-style: none; background: var(--ca-surface); border: 1px solid var(--ca-border); border-radius: 4px; } .ca-menu-item--has-children:hover > .ca-menu--sub { display: block; } .ca-menu--sub .ca-menu-link { display: flex; width: 100%; border-radius: 0; padding: 0.45rem 0.85rem; font-weight: 400; } .ca-menu--sub .ca-menu--sub { left: 100%; top: 0; } .ca-menu--mobile { flex-direction: column; align-items: stretch; } .ca-menu--mobile .ca-menu-item--has-children .ca-menu--sub { position: static; display: block; border: none; padding-left: 1rem; background: transparent; } /* Mobil çekmece (genel site) */ .ca-public-nav-overlay { position: fixed; inset: 0; background: rgba(15, 23, 42, 0.4); z-index: 1030; opacity: 0; visibility: hidden; transition: opacity 0.2s ease, visibility 0.2s; } .ca-public-nav-overlay.is-visible { opacity: 1; visibility: visible; } .ca-public-nav-drawer { position: fixed; top: 0; left: 0; bottom: 0; width: min(320px, 92vw); z-index: 1040; background: var(--ca-surface); border-right: 1px solid var(--ca-border); transform: translateX(-100%); transition: transform 0.2s ease; display: flex; flex-direction: column; overflow: hidden; } .ca-public-nav-drawer.is-open { transform: translateX(0); } .ca-public-nav-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 0.85rem 1rem; border-bottom: 1px solid var(--ca-border); } .ca-public-nav-drawer__body { padding: 1rem; overflow-y: auto; flex: 1; } /* Hero & içerik bölümleri */ .ca-hero { background: linear-gradient( 180deg, color-mix(in srgb, var(--ca-primary, #1d4ed8) 7%, var(--ca-bg)) 0%, var(--ca-bg) 100% ); border-bottom: 1px solid var(--ca-border); } .ca-hero--member { background: linear-gradient( 180deg, color-mix(in srgb, var(--ca-primary, #1d4ed8) 6%, var(--ca-bg)) 0%, var(--ca-bg) 55% ); } .ca-hero__eyebrow { letter-spacing: 0.06em; color: var(--ca-primary); } .ca-hero__title { color: var(--ca-text); } .py-lg-6 { padding-top: 3.5rem !important; padding-bottom: 3.5rem !important; } @media (max-width: 991.98px) { .py-lg-6 { padding-top: 2.5rem !important; padding-bottom: 2.5rem !important; } } .ca-section--alt { background: #f8fafc; } .ca-section__intro { max-width: 42rem; } .ca-feature__icon { font-size: 1.75rem; color: var(--ca-primary); line-height: 1; } .ca-public-header .ca-public-header__actions a:not(.btn) { color: inherit; } .ca-breadcrumb { background: var(--ca-bg); border-color: var(--ca-border) !important; } .ca-public-footer { background: var(--ca-surface); border-top: 1px solid var(--ca-border); padding: 1rem; text-align: center; font-size: 0.875rem; color: var(--ca-muted); } .ca-panel-card { border: 1px solid var(--ca-border); border-radius: 6px; background: var(--ca-surface); } .ca-auth-page { width: 100%; min-height: 65vh; padding: 2rem 1rem 4rem; } .ca-auth-shell { width: 100%; max-width: 36rem; margin-left: auto; margin-right: auto; } .ca-auth-form-inner { width: 100%; } .ca-auth-shell .auth-card { width: 100%; background: var(--ca-surface); border: 1px solid var(--ca-border) !important; border-radius: 8px; box-shadow: none !important; } .ca-auth-shell .card-header.bg-body-tertiary, .ca-auth-shell .card.bg-body-tertiary { background: var(--ca-surface) !important; } @media (min-width: 576px) { .ca-auth-page { padding-left: 1.25rem; padding-right: 1.25rem; } } /* ——— Üye paneli (dashboard) ——— */ .ca-app { min-height: 100vh; background: var(--ca-bg); color: var(--ca-text); --ca-primary: var(--primary-color, #1d4ed8); --ca-primary-hover: var(--link-hover-color, #1e40af); } .ca-layout { display: flex; min-height: 100vh; } /* Mobil üst */ .ca-mobile-brand { flex: 1; text-align: center; } .ca-mobile-brand img { max-height: 36px; width: auto; } .ca-mobile-top { display: none; align-items: center; justify-content: space-between; padding: 0.65rem 1rem; background: var(--ca-surface); border-bottom: 1px solid var(--ca-border); position: sticky; top: 0; z-index: 40; } .ca-mobile-top .ca-icon-btn { background: transparent; border: 1px solid var(--ca-border); border-radius: 4px; padding: 0.35rem 0.5rem; cursor: pointer; line-height: 1; } .ca-mobile-drawer { display: none; position: fixed; inset: 0 auto 0 0; width: min(280px, 88vw); background: var(--ca-sidebar); color: #e2e8f0; z-index: 50; transform: translateX(-100%); transition: transform 0.2s ease; overflow-y: auto; } .ca-mobile-drawer.is-open { transform: translateX(0); } .ca-mobile-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.12); } .ca-site-overlay { display: none; position: fixed; inset: 0; background: rgba(15, 23, 42, 0.45); z-index: 45; } .ca-site-overlay.is-visible { display: block; } /* Kenar çubuğu */ .ca-sidebar { width: 260px; flex-shrink: 0; background: var(--ca-sidebar); color: #e2e8f0; display: flex; flex-direction: column; border-right: 1px solid rgba(255, 255, 255, 0.08); } .ca-sidebar__brand { padding: 1.25rem 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .ca-sidebar__brand a { color: #f8fafc; text-decoration: none; font-weight: 600; font-size: 1rem; display: inline-flex; align-items: center; gap: 0.5rem; } .ca-sidebar__user { padding: 1rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); display: flex; gap: 0.75rem; align-items: flex-start; } .ca-sidebar__user .avatar { width: 44px; height: 44px; border-radius: 4px; object-fit: cover; border: 1px solid rgba(255, 255, 255, 0.15); } .ca-sidebar__user-meta small { color: var(--ca-sidebar-muted); } .ca-sidebar__nav { flex: 1; padding: 0.75rem 0; overflow-y: auto; } .ca-sidebar__nav ul, .ca-nav-list { list-style: none; margin: 0; padding: 0; } .ca-sidebar__nav a, .ca-nav-list a { display: flex; align-items: center; gap: 0.5rem; padding: 0.55rem 1rem; color: #cbd5e1; text-decoration: none; font-size: 0.9375rem; border-left: 3px solid transparent; } .ca-sidebar__nav a:hover, .ca-nav-list a:hover { background: var(--ca-sidebar-hover); color: #f8fafc; } .ca-sidebar__nav a.active, .ca-nav-list a.active { background: var(--ca-sidebar-hover); color: #f8fafc; border-left-color: var(--ca-accent); } .ca-sidebar__footer { padding: 1rem; border-top: 1px solid rgba(255, 255, 255, 0.1); font-size: 0.75rem; color: var(--ca-sidebar-muted); } .ca-sidebar__footer a { color: #cbd5e1; } /* İçerik */ .ca-content-wrap { flex: 1; min-width: 0; display: flex; flex-direction: column; } .ca-toolbar { background: var(--ca-surface); border-bottom: 1px solid var(--ca-border); padding: 1rem 1.25rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; } .ca-toolbar h1, .ca-toolbar .ca-toolbar-title { font-size: 1.25rem; font-weight: 600; margin: 0; } .ca-toolbar-actions { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; } .ca-toolbar-actions a { color: var(--ca-muted); text-decoration: none; font-size: 0.875rem; display: inline-flex; align-items: center; gap: 0.35rem; } .ca-toolbar-actions a:hover { color: var(--ca-accent); } .ca-content { padding: 1.25rem; flex: 1; } /* Eklenti kartları — gölge yerine çerçeve */ .ca-content .card { box-shadow: none !important; border: 1px solid var(--ca-border); border-radius: 6px; } .ca-content .card-header.bg-white { background: var(--ca-surface) !important; border-bottom-color: var(--ca-border) !important; } .ca-content .table thead.table-light th { background: #f8fafc !important; border-color: var(--ca-border); } @media (max-width: 991.98px) { .ca-mobile-top { display: flex; } .ca-sidebar { display: none; } .ca-mobile-drawer { display: block; } } @media (min-width: 992px) { .ca-site-overlay { display: none !important; } }