/* Tęcza Portal – style panelu członka. Korzysta z kolorów motywu, a bez niego ma własne wartości. */

.tecza-panel,
.tecza-box {
	--tz-primary: var(--wp--preset--color--primary, #4338ca);
	--tz-primary-dark: var(--wp--preset--color--primary-dark, #1b1a4b);
	--tz-secondary: var(--wp--preset--color--secondary, #db2777);
	--tz-surface: var(--wp--preset--color--surface, #edeff7);
	--tz-border: var(--wp--preset--color--border, #e1e5ef);
	--tz-muted: var(--wp--preset--color--muted, #566074);
	--tz-text: var(--wp--preset--color--contrast, #0b1220);
	--tz-radius: 12px;
	color: var(--tz-text);
}

.tecza-box {
	background: #fff;
	border: 1px solid var(--tz-border);
	border-radius: var(--tz-radius);
	padding: clamp(1rem, 3vw, 2rem);
}

.tecza-panel > .tecza-box { margin-top: 1rem; }

.tecza-box h2 { margin-top: 0; font-size: 1.6rem; }
.tecza-box h3 { font-size: 1.15rem; margin: 1.5rem 0 .5rem; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important;
}

/* Nagłówek panelu */
.tecza-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1rem; align-items: baseline; }
.tecza-head p { margin: 0; }
.tecza-hello { font-size: 1.25rem; }
.tecza-head__links { font-size: .9rem; color: var(--tz-muted); }

/* Nawigacja */
.tecza-nav ul { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; margin: 1rem 0 0; padding: 0; }
.tecza-nav a {
	display: inline-flex; align-items: center; gap: .4rem;
	padding: .55rem 1rem; border-radius: 999px; border: 1px solid var(--tz-border);
	background: #fff; color: var(--tz-text); text-decoration: none; font-weight: 600; font-size: .95rem;
}
.tecza-nav a:hover { background: var(--tz-surface); }
.tecza-nav a[aria-current="page"] { background: var(--tz-primary); border-color: var(--tz-primary); color: #fff; }
.tecza-badge {
	display: inline-block; min-width: 1.4em; padding: 0 .4em; border-radius: 999px;
	background: var(--tz-secondary); color: #fff; font-size: .75rem; line-height: 1.6; text-align: center;
}

/* Przyciski */
.tecza-btn {
	display: inline-block; padding: .65rem 1.2rem; border-radius: 8px; border: 2px solid var(--tz-primary);
	background: var(--tz-primary); color: #fff !important; font: inherit; font-weight: 600; text-decoration: none; cursor: pointer;
}
.tecza-btn:hover { background: var(--tz-primary-dark); border-color: var(--tz-primary-dark); }
.tecza-btn--ghost { background: transparent; color: var(--tz-primary) !important; }
.tecza-btn--ghost:hover { background: var(--tz-surface); border-color: var(--tz-primary); }
.tecza-btn--sm { padding: .4rem .85rem; font-size: .9rem; }
.tecza-btn:focus-visible, .tecza-link:focus-visible, .tecza-nav a:focus-visible, .tecza-input:focus-visible {
	outline: 3px solid var(--tz-secondary); outline-offset: 2px;
}
.tecza-link { background: none; border: 0; padding: 0; color: var(--tz-muted); text-decoration: underline; cursor: pointer; font: inherit; font-size: .85rem; }

.tecza-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .75rem; }
.tecza-inline { display: inline; margin: 0; }
.tecza-more { display: inline-block; margin-top: .5rem; font-weight: 600; }

/* Karty i siatka */
.tecza-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.tecza-card { background: var(--tz-surface); border-radius: var(--tz-radius); padding: 1.1rem 1.25rem; }
.tecza-card h3 { margin-top: 0; }
.tecza-card--plain { background: #fff; border: 1px solid var(--tz-border); margin-top: 1.5rem; }

/* Listy */
.tecza-list { list-style: none; margin: 1rem 0 0; padding: 0; display: grid; gap: .75rem; }
.tecza-list > li { border: 1px solid var(--tz-border); border-radius: var(--tz-radius); padding: .9rem 1.1rem; }
.tecza-mini { list-style: none; margin: 0 0 .25rem; padding: 0; display: grid; gap: .4rem; }
.tecza-meta { color: var(--tz-muted); font-size: .88rem; }
.tecza-empty { color: var(--tz-muted); }
.tecza-prose > :first-child { margin-top: .5rem; }
.tecza-prose > :last-child { margin-bottom: 0; }

.tecza-task.is-overdue { border-color: var(--tz-secondary); box-shadow: inset 4px 0 0 var(--tz-secondary); }
.tecza-task--zrobione { opacity: .75; }
.tecza-task__head { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.tecza-doc { display: flex; flex-wrap: wrap; gap: .75rem 1rem; justify-content: space-between; align-items: center; }

.tecza-pill {
	display: inline-block; padding: .1rem .65rem; border-radius: 999px; font-size: .78rem; font-weight: 700;
	background: var(--tz-surface); color: var(--tz-text);
}
.tecza-pill--w-trakcie { background: #dbe9f6; color: #174a7a; }
.tecza-pill--zrobione { background: #d8efe0; color: #11522c; }
.tecza-pill--do-zrobienia { background: #fbe9d6; color: #7a3b0c; }
.tecza-pill--members { background: #e8def5; color: #4a2d7a; }

.tecza-details { margin-top: 1.5rem; }
.tecza-details summary { cursor: pointer; font-weight: 600; }

.tecza-msg { padding: .75rem 1rem; border-radius: 8px; background: var(--tz-surface); }
.tecza-msg--ok { background: #d8efe0; color: #11522c; }

/* Tabela */
.tecza-table-wrap { overflow-x: auto; }
.tecza-table { width: 100%; border-collapse: collapse; }
.tecza-table th, .tecza-table td { text-align: left; padding: .6rem .75rem; border-bottom: 1px solid var(--tz-border); }

/* Kalendarz */
.tecza-cal-nav { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: space-between; margin: 1rem 0; }
.tecza-cal-title { font-size: 1.15rem; text-transform: capitalize; }
.tecza-cal-wrap { overflow-x: auto; }
.tecza-cal { width: 100%; min-width: 640px; border-collapse: collapse; table-layout: fixed; }
.tecza-cal th { padding: .4rem; font-size: .85rem; color: var(--tz-muted); text-align: left; }
.tecza-cal td { height: 5.5rem; vertical-align: top; padding: .3rem; border: 1px solid var(--tz-border); font-size: .8rem; }
.tecza-cal td.is-empty { background: var(--tz-surface); opacity: .5; }
.tecza-cal td.is-today { background: #fff8e1; }
.tecza-cal-day { display: block; font-weight: 700; margin-bottom: .2rem; }
.tecza-cal-ev {
	display: block; margin-bottom: .2rem; padding: .1rem .35rem; border-radius: 4px;
	background: var(--tz-primary); color: #fff !important; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.tecza-cal-ev span { opacity: .85; }

.tecza-input {
	width: 100%; padding: .55rem .75rem; border: 1px solid var(--tz-border); border-radius: 8px; font: inherit; background: #fff; color: inherit; box-sizing: border-box;
}

/* Poczta */
.tecza-mail__bar { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; align-items: center; margin-bottom: .5rem; }
.tecza-mail__search { display: flex; gap: .5rem; flex: 1 1 280px; max-width: 520px; }
.tecza-mail__status:empty, .tecza-mail__formstatus:empty { display: none; }
.tecza-mail__status { color: var(--tz-secondary); font-weight: 600; }
.tecza-mail__cols { display: grid; gap: 1rem; grid-template-columns: minmax(240px, 380px) 1fr; align-items: start; }
@media (max-width: 800px) { .tecza-mail__cols { grid-template-columns: 1fr; } }

.tecza-mail__list { list-style: none; margin: 0 0 .75rem; padding: 0; border: 1px solid var(--tz-border); border-radius: var(--tz-radius); overflow: hidden; max-height: 70vh; overflow-y: auto; }
.tecza-mail__list li + li { border-top: 1px solid var(--tz-border); }
.tecza-mail__item {
	display: block; width: 100%; text-align: left; background: #fff; border: 0; padding: .7rem .9rem; font: inherit; color: inherit; cursor: pointer;
}
.tecza-mail__item:hover, .tecza-mail__item[aria-current="true"] { background: var(--tz-surface); }
.tecza-mail__item.is-unread .tecza-mail__subject, .tecza-mail__item.is-unread .tecza-mail__from { font-weight: 800; }
.tecza-mail__from, .tecza-mail__subject, .tecza-mail__snippet { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tecza-mail__snippet, .tecza-mail__date { color: var(--tz-muted); font-size: .82rem; }

.tecza-mail__view { border: 1px solid var(--tz-border); border-radius: var(--tz-radius); padding: 1rem 1.25rem; min-height: 12rem; }
.tecza-mail__view h3 { margin-top: 0; overflow-wrap: anywhere; }
.tecza-mail__body { white-space: pre-wrap; overflow-wrap: anywhere; font-family: inherit; margin: 1rem 0; }

.tecza-mail__dialog { border: 1px solid var(--tz-border); border-radius: var(--tz-radius); padding: 1.25rem; width: min(640px, 92vw); }
.tecza-mail__dialog::backdrop { background: rgba(0, 0, 0, .45); }
.tecza-mail__form label { display: block; margin-bottom: .75rem; font-weight: 600; }
.tecza-mail__form .tecza-input { margin-top: .25rem; font-weight: 400; }
.tecza-mail__formstatus { color: var(--tz-secondary); font-weight: 600; }

/* =====================================================================
   Wersja 1.1 – odświeżony wygląd panelu
   ===================================================================== */
.tecza-panel, .tecza-box { --tz-radius: 16px; --tz-shadow: 0 1px 2px rgba(29, 42, 36, .05), 0 14px 30px -20px rgba(29, 42, 36, .35); }

.tecza-box { box-shadow: var(--tz-shadow); border-color: var(--tz-border); }
.tecza-box h2 { font-family: var(--wp--preset--font-family--serif, Georgia, serif); color: var(--tz-primary-dark); letter-spacing: -.01em; }

.tecza-head { padding-bottom: .75rem; border-bottom: 1px solid var(--tz-border); }
.tecza-hello { font-family: var(--wp--preset--font-family--serif, Georgia, serif); font-size: 1.5rem; color: var(--tz-primary-dark); }

.tecza-nav ul { gap: .4rem; }
.tecza-nav a { transition: background .15s, border-color .15s, color .15s; }
.tecza-nav a[aria-current="page"] { box-shadow: 0 6px 14px -8px var(--tz-primary-dark); }

.tecza-btn { border-radius: 10px; box-shadow: 0 6px 14px -9px var(--tz-primary-dark); transition: background .15s, transform .05s; }
.tecza-btn:active { transform: translateY(1px); }
.tecza-btn--ghost { box-shadow: none; }

/* Kafle na stronie startowej z tęczowymi akcentami */
.tecza-grid .tecza-card { position: relative; overflow: hidden; background: #fff; border: 1px solid var(--tz-border); box-shadow: var(--tz-shadow); padding-top: 1.35rem; }
.tecza-grid .tecza-card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--accent, var(--tz-primary)); }
.tecza-grid .tecza-card:nth-child(6n+1) { --accent: #D64550; }
.tecza-grid .tecza-card:nth-child(6n+2) { --accent: #E8833A; }
.tecza-grid .tecza-card:nth-child(6n+3) { --accent: #E9C13B; }
.tecza-grid .tecza-card:nth-child(6n+4) { --accent: #4F9D69; }
.tecza-grid .tecza-card:nth-child(6n+5) { --accent: #3F7FBF; }
.tecza-grid .tecza-card:nth-child(6n+6) { --accent: #7A5EA8; }

.tecza-list > li { background: #fff; transition: box-shadow .15s; }
.tecza-list > li:hover { box-shadow: var(--tz-shadow); }

.tecza-table th { font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; color: var(--tz-muted); }
.tecza-table tbody tr:hover { background: var(--tz-surface); }

.tecza-input:focus { outline: none; border-color: var(--tz-primary); box-shadow: 0 0 0 4px rgba(31, 92, 69, .16); }

/* v1.3 – link do płatności, formularze publiczne, dane do przelewu */
.tecza-paylink{margin-top:.6rem}
.tecza-copy{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.tecza-copy .tecza-input{flex:1 1 16rem;min-width:0;font-size:.85rem}
.tecza-fieldset{border:1px solid var(--tecza-line,#e3ddd2);border-radius:12px;padding:.8rem 1rem;margin:0 0 1rem}
.tecza-fieldset legend{font-weight:600;padding:0 .4rem}
.tecza-donate h3{margin:1.4rem 0 .4rem;font-size:1.05rem}
.tecza-dl{display:grid;grid-template-columns:minmax(10rem,14rem) 1fr;gap:.45rem 1rem;background:#fff;border:1px solid var(--tecza-line,#e3ddd2);border-radius:12px;padding:1rem 1.2rem;margin:.4rem 0 1.2rem}
.tecza-dl dt{color:#5b5a55;font-size:.9rem}
.tecza-dl dd{margin:0}
@media (max-width:600px){.tecza-dl{grid-template-columns:1fr}.tecza-dl dd{margin-bottom:.5rem}}

/* ==========================================================================
   v2.1 – responsywność: telefon, tablet, komputer
   Zasady: pola mają min. 16 px (iOS nie powiększa strony przy wpisywaniu), elementy dotykowe min. 44 px,
   nawigacja panelu przewija się poziomo zamiast zawijać w kilka rzędów, tabele przewijają się w bok.
   ========================================================================== */
.tecza-panel, .tecza-box, .tecza-form { max-width: 100%; box-sizing: border-box; }
.tecza-input, .tecza-form input, .tecza-form select, .tecza-form textarea { font-size: 1rem; max-width: 100%; box-sizing: border-box; }
.tecza-btn, .tecza-nav a { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box; }
.tecza-table-wrap { -webkit-overflow-scrolling: touch; }
.tecza-table { min-width: 28rem; }
img, video { max-width: 100%; height: auto; }

@media (max-width: 782px) {
	.tecza-nav ul { flex-wrap: nowrap; overflow-x: auto; scroll-snap-type: x proximity; padding-bottom: .4rem; -webkit-overflow-scrolling: touch; }
	.tecza-nav li { flex: 0 0 auto; scroll-snap-align: start; }
	.tecza-nav__group { margin-top: .8rem; }
	.tecza-head { flex-direction: column; align-items: flex-start; gap: .3rem; }
	.tecza-box { padding: 1rem; border-radius: 14px; }
	.tecza-grid { grid-template-columns: 1fr; }
	.tecza-form .tecza-btn, .tecza-box > form .tecza-btn { width: 100%; }
	.tecza-inline { display: block; margin: .3rem 0; }
	.tecza-copy { flex-direction: column; align-items: stretch; }
	.tecza-copy .tecza-btn { width: 100%; }
}

@media (max-width: 480px) {
	.tecza-fieldset { padding: .6rem .7rem; }
	.tecza-table { font-size: .9rem; }
	.tecza-dl { padding: .8rem; }
	h2 { font-size: 1.35rem; }
}

@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }
