/* === Typography overrides – Filament admin === */

/* Dark mode – nagłówki w prose */
.dark .prose :where(h1, h2, h3, h4, h5, h6) {
    color: rgb(248 250 252) !important; /* slate-50 */
}

/* (opcjonalnie) delikatne rozróżnienie poziomów */
.dark .prose h2 {
    margin-top: 2rem;
}

.dark .prose h3 {
    color: rgb(226 232 240); /* slate-200 */
}
/* =========================
   1) LINKI – RichEditor + Podgląd (Entry)
   ========================= */

/* Rich editor (Trix) */
.fi-fo-rich-editor-editor a,
.fi-fo-rich-editor-editor a:visited {
    color: inherit; /* niech nie robi "niebieskiego defaultu" */
    text-decoration-line: underline;
    text-decoration-thickness: 3px;
    text-underline-offset: 3px;
    border-radius: 6px;
    padding: 0 .12em;
    transition: background-color .15s ease, color .15s ease;
}

/* Podgląd (Infolist / Entry) */
.fi-in-text a,
.fi-in-text a:visited,
.prose a,
.prose a:visited {
    color: inherit;
    text-decoration-line: underline;
    text-decoration-thickness: 3px;
    text-underline-offset: 3px;
    border-radius: 6px;
    padding: 0 .12em;
    transition: background-color .15s ease, color .15s ease;
}

/* LIGHT */
html:not(.dark) .fi-fo-rich-editor-editor a,
html:not(.dark) .fi-in-text a,
html:not(.dark) .prose a {
    background: rgba(234, 179, 8, .18);              /* żółty highlight */
    text-decoration-color: rgba(161, 98, 7, .95);    /* ciepłe podkreślenie */
}

html:not(.dark) .fi-fo-rich-editor-editor a:hover,
html:not(.dark) .fi-in-text a:hover,
html:not(.dark) .prose a:hover {
    background: rgba(234, 179, 8, .28);
}

/* DARK */
html.dark .fi-fo-rich-editor-editor a,
html.dark .fi-in-text a,
html.dark .prose a {
    background: rgba(250, 204, 21, .14);
    text-decoration-color: rgba(250, 204, 21, .95); /* mocne żółte podkreślenie */
}

html.dark .fi-fo-rich-editor-editor a:hover,
html.dark .fi-in-text a:hover,
html.dark .prose a:hover {
    background: rgba(250, 204, 21, .22);
}

/* =========================
   2) “Wymagane linki” – kafelki i buttony w light mode
   (bo masz inline style pod dark)
   ========================= */

/* To łapie Twoje przyciski po data-action (niezależnie od inline) */
button[data-action="insert-required-link"],
button[data-action="remove-required-link"] {
    border-radius: 10px !important;
    padding: 6px 12px !important;
    font-weight: 800 !important;
    font-size: 12px !important;
}

/* Podgląd (anchor w kafelku) */
a[data-action="preview-required-link"],
a.required-link-preview,
a[target="_blank"] {
    border-radius: 10px;
}

/* LIGHT – nadpisz “białe na białym” */
html:not(.dark) [data-required-links],
html:not(.dark) .required-links,
html:not(.dark) .required-links * {
    color: #111827; /* slate-900 */
}

/* LIGHT – jeśli kafelki mają inline border/background, dociśnij czytelność */
html:not(.dark) [data-required-links] .required-link-card,
html:not(.dark) .required-links .required-link-card {
    background: #ffffff !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
    box-shadow: 0 10px 30px rgba(0,0,0,.06);
}

/* LIGHT – buttony */
html:not(.dark) button[data-action="insert-required-link"] {
    background: #1d4ed8 !important; /* blue-700 */
    color: #ffffff !important;
}

html:not(.dark) button[data-action="remove-required-link"] {
    background: rgba(17, 24, 39, .06) !important;
    border: 1px solid rgba(17, 24, 39, .16) !important;
    color: #111827 !important;
}

html:not(.dark) a[data-action="preview-required-link"],
html:not(.dark) .required-link-preview {
    background: rgba(17, 24, 39, .04) !important;
    border: 1px solid rgba(17, 24, 39, .14) !important;
    color: #111827 !important;
    text-decoration: none !important;
}

/* DARK – jak było, tylko stabilniej */
html.dark [data-required-links] .required-link-card,
html.dark .required-links .required-link-card {
    background: rgba(255,255,255,.04) !important;
    border: 1px solid rgba(255,255,255,.10) !important;
}

html.dark button[data-action="insert-required-link"] {
    background: #2563eb !important;
    color: #fff !important;
}

html.dark button[data-action="remove-required-link"] {
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: rgba(255,255,255,.92) !important;
}

html.dark a[data-action="preview-required-link"],
html.dark .required-link-preview {
    background: rgba(255,255,255,.06) !important;
    border: 1px solid rgba(255,255,255,.12) !important;
    color: rgba(255,255,255,.90) !important;
    text-decoration: none !important;
}
/* =========================
   WYMAGANE LINKI – WHITE MODE
   ========================= */

html:not(.dark) .required-link-card {
    background: #ffffff;
    border-color: #e5e7eb; /* gray-200 */
}

html:not(.dark) .required-link-card div[style*="font-weight:600"] {
    color: #111827 !important; /* gray-900 */
}

html:not(.dark) .required-link-card div[style*="font-size:12px"] {
    color: #6b7280 !important; /* gray-500 */
}