.reminders-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 24px; }
.reminders-heading h4 { margin-bottom: 6px; }
.reminder-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; flex: 0 0 44px; padding: 0; }
.reminders-toolbar { border-block: 1px solid #dededb; padding-block: 18px; margin-bottom: 8px; }
.reminders-range { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }
.reminders-range .btn { min-height: 44px; display: inline-flex; align-items: center; border-radius: 6px; font-size: 14px; }
.reminders-totals { display: flex; flex-wrap: wrap; gap: 12px 28px; font-size: 14px; color: #606971; }
.reminders-totals strong { color: #182a40; display: inline-block; margin-inline-start: 8px; font-size: 17px; }
.reminders-state:not(:empty) { padding: 32px 12px; text-align: center; color: #606971; overflow-wrap: anywhere; }
.reminder-entry { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px 14px; border-bottom: 1px solid #dededb; padding: 24px 0; }
.reminder-entry > div { min-width: 0; overflow-wrap: anywhere; display: flex; flex-direction: column; gap: 5px; }
.reminder-label { font-size: 12px; color: #606971; }
.reminder-customer h5 { font-size: 17px; line-height: 1.6; margin: 0; }
.reminder-customer > small { direction: ltr; text-align: start; unicode-bidi: isolate; width: fit-content; color: #606971; }
.reminder-phones { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: 14px; }
.reminder-phone-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; max-width: 100%; color: #236b53; text-decoration: none; border-radius: 4px; }
.reminder-phone-link bdi { min-width: 0; overflow-wrap: anywhere; }
.reminder-phone-link i { flex: 0 0 auto; }
.reminder-phone-link:hover { color: #164934; text-decoration: underline; }
.reminder-phone-link:focus-visible { outline: 2px solid #236b53; outline-offset: 3px; }
.reminder-event strong, .reminder-deadline strong { font-size: 14px; line-height: 1.8; }
.reminder-event > span:not(.reminder-label) { font-size: 13px; }
.reminder-balance strong { font-size: 20px; color: #172c46; line-height: 1.5; }
.reminder-balance small { font-size: 12px; color: #606971; }
.reminder-status { display: inline-flex; width: fit-content; align-items: center; gap: 6px; font-size: 13px; }
.reminder-status::before { content: ''; width: 6px; height: 6px; flex-shrink: 0; border-radius: 50%; background: currentColor; }
.reminder-status.is-upcoming { color: #28725d; }
.reminder-status.is-today { color: #8a6016; }
.reminder-status.is-overdue { color: #a63038; }
.reminder-entry .reminder-actions { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.reminder-actions .btn { min-height: 44px; white-space: normal; font-size: 14px; border-radius: 6px; }
.reminder-copy { display: flex; align-items: center; justify-content: center; gap: 8px; }
.reminder-copy:only-child { grid-column: 1 / -1; }
.reminder-preview { grid-column: 1 / -1; min-width: 0; }
.reminder-preview summary { cursor: pointer; color: #606971; font-size: 13px; min-height: 32px; }
.reminder-preview p { font-size: 14px; line-height: 1.9; text-align: right; margin: 12px 0 0; border-inline-start: 2px solid #caa657; padding-inline-start: 14px; overflow-wrap: anywhere; }
.reminder-clipboard { border-block-start: 1px solid #dededb; padding-block: 20px; }
.reminder-clipboard textarea { margin-top: 10px; }
.reminders-pagination { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 24px; }
[dir="ltr"] .reminders-pagination i { transform: rotate(180deg); }
.reminder-setting { padding-block: 16px 24px; border-bottom: 1px solid #dededb; }
.reminder-setting form { display: flex; flex-wrap: wrap; align-items: end; gap: 16px; }
.reminder-setting form > div { flex: 1 1 240px; min-width: 0; max-width: 450px; }
.reminder-setting h5 { font-size: 18px; }
#reminder-days, #reminder-visibility-days { width: 110px; }
@media (min-width: 1200px) {
    .reminder-entry { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 145px; gap: 18px; }
    .reminder-entry .reminder-actions { grid-column: auto; display: flex; flex-direction: column; justify-content: center; }
    .reminder-preview { grid-column: 1 / -1; }
    .reminders-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
    .reminders-range { margin-bottom: 0; }
}
@media (max-width: 380px) {
    .reminder-entry { column-gap: 12px; }
    .reminder-entry .reminder-actions { grid-template-columns: minmax(0, 1fr); }
}