/* Inostra Destekler — the app's /destekler design tokens (slate palette,
   rounded cards, dark CTA) scoped under .ino-* so the WordPress theme's
   header/menu/footer stay untouched. Font inherits from the site theme. */

.ino-wrap { max-width: 56rem; margin: 0 auto; padding: 3rem 1rem; color: #334155; line-height: 1.6; box-sizing: border-box; }
.ino-wrap--detail { max-width: 42rem; }
.ino-wrap *, .ino-wrap *::before, .ino-wrap *::after { box-sizing: border-box; }

/* The theme's global heading rules (.elementor-kit h1/h2 — huge, bold, black)
   outrank a single class; pin our typography with stronger selectors. */
.ino-wrap h1.ino-h1 { margin: 0 0 .25rem !important; font-size: 1.5rem !important; line-height: 1.25 !important; font-weight: 600 !important; letter-spacing: -.01em; color: #0f172a !important; }
.ino-wrap h1.ino-h1--detail { font-size: 1.25rem !important; }
.ino-lead { margin: 0 0 2rem; max-width: 42rem; font-size: .875rem; line-height: 1.7; color: #64748b; }
.ino-lead a, .ino-back { color: #475569; text-decoration: underline; text-underline-offset: 2px; }
.ino-back { display: inline-block; margin-bottom: .5rem; font-size: .875rem; color: #64748b; text-decoration: none; }
.ino-back:hover { text-decoration: underline; }

.ino-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .75rem; }
.ino-list li { margin: 0; padding: 0; }
.ino-card { display: block; padding: 1.25rem; border: 1px solid #e2e8f0; border-radius: .75rem; background: #fff; color: inherit; text-decoration: none; transition: border-color .15s, background-color .15s; }
.ino-card:hover { border-color: #cbd5e1; background: #f8fafc; }
.ino-card__head, .ino-detail__head { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
.ino-wrap h2.ino-card__title { margin: 0 !important; font-size: .95rem !important; line-height: 1.5 !important; font-weight: 600 !important; color: #0f172a !important; }
.ino-card__summary { margin: .25rem 0 0; font-size: .875rem; color: #64748b; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ino-card__meta, .ino-detail__meta { margin: .5rem 0 0; font-size: .75rem; color: #94a3b8; }
.ino-detail__head { margin: .5rem 0 .5rem; }
.ino-detail__meta { margin: 0 0 1.5rem; }
.ino-dot { margin: 0 .35rem; }

.ino-badge { flex-shrink: 0; display: inline-block; padding: .25rem .5rem; border-radius: 9999px; font-size: .75rem; font-weight: 500; line-height: 1.2; white-space: nowrap; }
.ino-badge--red { background: #fef2f2; color: #b91c1c; }

.ino-panel { margin: 0 0 1.5rem; padding: 1.25rem; border: 1px solid #e2e8f0; border-radius: .75rem; background: #fff; }
.ino-wrap h2.ino-panel__title { margin: 0 0 .5rem !important; font-size: .875rem !important; line-height: 1.4 !important; font-weight: 600 !important; color: #0f172a !important; }
.ino-panel__text { margin: 0; font-size: .875rem; line-height: 1.7; color: #334155; }
.ino-prose { font-size: .875rem; line-height: 1.7; color: #334155; }
.ino-wrap .ino-prose p, .ino-wrap .ino-panel__text, .ino-wrap .ino-card__summary, .ino-wrap .ino-lead { font-size: .875rem !important; line-height: 1.7 !important; }
.ino-prose p { margin: 0 0 .9rem; }
.ino-prose p:last-child { margin-bottom: 0; }
.ino-prose h2, .ino-prose h3, .ino-prose h4 { margin: 1.25rem 0 .5rem; font-size: 1rem; color: #0f172a; }
.ino-prose ul, .ino-prose ol { margin: 0 0 .9rem 1.25rem; padding: 0; }
.ino-prose a { color: #0f172a; text-decoration: underline; text-underline-offset: 2px; }
.ino-prose img { max-width: 100%; height: auto; }

.ino-cta { padding: 1.5rem; border: 1px solid #0f172a; border-radius: .75rem; background: #0f172a; text-align: center; }
.ino-wrap h2.ino-cta__title { margin: 0 !important; font-size: 1rem !important; line-height: 1.4 !important; font-weight: 600 !important; color: #fff !important; }
.ino-cta__text { margin: .25rem auto 1rem; max-width: 28rem; font-size: .875rem; color: #cbd5e1; }
.ino-cta__btn { display: inline-block; padding: .625rem 1.25rem; border-radius: 9999px; background: #fff; color: #0f172a !important; font-size: .875rem; font-weight: 600; text-decoration: none !important; transition: background-color .15s; }
.ino-cta__btn:hover { background: #e2e8f0; }

.ino-note { margin: 1.5rem 0 0; font-size: .75rem; color: #94a3b8; text-align: center; }
.ino-empty { font-size: .875rem; color: #94a3b8; }

/* WP's paginate_links() puts the `page-numbers` class on the <ul> AND on
   each link — so the box styling must target `li > .page-numbers` only, or
   the list itself turns into an inline-block box and the numbers stack. */
.ino-pagination { margin-top: 2rem; }
.ino-wrap .ino-pagination ul.page-numbers { display: flex !important; flex-wrap: wrap; justify-content: center; align-items: center; gap: .375rem; list-style: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important; }
.ino-wrap .ino-pagination ul.page-numbers > li { display: block !important; float: none !important; width: auto !important; margin: 0 !important; padding: 0 !important; }
.ino-wrap .ino-pagination li > .page-numbers { display: inline-block !important; min-width: 2.25rem; padding: .375rem .625rem !important; border: 1px solid #e2e8f0 !important; border-radius: .5rem; background: #fff; color: #475569 !important; font-size: .875rem !important; line-height: 1.4 !important; text-align: center; text-decoration: none !important; }
.ino-wrap .ino-pagination li > a.page-numbers:hover { background: #f8fafc; border-color: #cbd5e1 !important; }
.ino-wrap .ino-pagination li > .page-numbers.current { background: #0f172a; border-color: #0f172a !important; color: #fff !important; }
.ino-wrap .ino-pagination li > .page-numbers.dots { border-color: transparent !important; background: none; }

@media (max-width: 640px) {
	.ino-wrap { padding: 2rem 1rem; }
	.ino-card__head, .ino-detail__head { flex-direction: column; }
}
