*
{
    -webkit-tap-highlight-color : transparent;
}

::selection
{
    background : #d4a85a;
    color : #2c5f4a;
}

::-moz-selection
{
    background : #d4a85a;
    color : #2c5f4a;
}

:root
{
    color-scheme : light dark;
}

[hidden]
{
    display : none !important;
}

.narrow
{
    max-width : 640px;
}

.admin-head
{
    display : flex;
    align-items : flex-end;
    justify-content : space-between;
    flex-wrap : wrap;
    gap : 16px;
    margin-bottom : 24px;
}

.admin-head .page-sub
{
    margin-bottom : 0;
}

.alert
{
    display : flex;
    justify-content : space-between;
    align-items : flex-start;
    gap : 12px;
    padding : 12px 16px;
    margin-bottom : 20px;
    border : 1px solid;
    border-radius : 10px;
    font-size : 0.93rem;
}

.alert.success
{
    background : rgba(26, 127, 75, 0.1);
    border-color : var(--success);
    color : var(--success);
}

.alert.error
{
    background : rgba(207, 34, 46, 0.1);
    border-color : var(--danger);
    color : var(--danger);
}

.alert ul
{
    margin-left : 18px;
}

.admin-bar
{
    display : flex;
    align-items : center;
    justify-content : space-between;
    flex-wrap : wrap;
    gap : 12px;
    padding : 16px 20px;
    border-bottom : 1px solid var(--border);
}

.admin-tabs
{
    display : flex;
    flex-wrap : wrap;
    gap : 6px;
}

.admin-tab
{
    padding : 8px 14px;
    border : 1px solid var(--border);
    border-radius : 8px;
    background : var(--surface);
    font-size : 0.9rem;
    transition : background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.admin-tab:hover
{
    background : var(--bg);
}

.admin-tab.active
{
    background : var(--accent);
    border-color : var(--accent);
    color : var(--on-accent);
}

.admin-search,
.field input,
.field select,
.field textarea
{
    width : 100%;
    padding : 10px 12px;
    font : inherit;
    font-size : 1rem;
    color : var(--text);
    background : var(--surface);
    border : 1px solid var(--border);
    border-radius : 8px;
    transition : border-color 0.2s ease, box-shadow 0.2s ease;
}

.admin-search
{
    max-width : 260px;
}

.admin-search:focus,
.field input:focus,
.field select:focus,
.field textarea:focus
{
    outline : none;
    border-color : var(--accent);
    box-shadow : 0 0 0 3px rgba(212, 168, 90, 0.45);
}

.field input[type="checkbox"]
{
    width : auto;
}

.field textarea
{
    min-height : 110px;
    resize : vertical;
}

.field
{
    display : flex;
    flex-direction : column;
    gap : 6px;
    margin-bottom : 16px;
}

.field label
{
    font-size : 0.88rem;
    font-weight : 600;
}

.hint
{
    font-size : 0.8rem;
    font-weight : 400;
    color : var(--muted);
}

.counter
{
    text-align : right;
}

.form-grid
{
    display : grid;
    grid-template-columns : repeat(2, minmax(0, 1fr));
    gap : 0 14px;
}

.admin-list
{
    list-style : none;
}

.admin-row
{
    display : flex;
    align-items : center;
    gap : 16px;
    padding : 14px 20px;
    border-bottom : 1px solid var(--border);
    transition : background 0.2s ease;
}

.admin-row:last-child
{
    border-bottom : 0;
}

.admin-row:hover
{
    background : var(--bg);
}

.admin-row.past .admin-row-info
{
    opacity : 0.7;
}

.admin-row.highlight
{
    animation : row-flash 2.4s ease;
}

@keyframes row-flash
{
    0%
    {
        background : rgba(212, 168, 90, 0.4);
    }

    100%
    {
        background : transparent;
    }
}

.admin-row-info
{
    flex : 1;
    min-width : 0;
}

.admin-row-info h3
{
    font-size : 1rem;
    font-weight : 600;
}

.admin-row-info p
{
    font-size : 0.85rem;
    color : var(--muted);
}

.admin-cat
{
    display : inline-flex;
    align-items : center;
    gap : 6px;
    margin-top : 6px;
    font-size : 0.8rem;
    color : var(--muted);
}

.admin-row-actions
{
    display : flex;
    gap : 6px;
    flex-shrink : 0;
}

.btn.danger
{
    color : var(--danger);
}

.btn.danger:hover
{
    background : rgba(207, 34, 46, 0.1);
}

.btn.danger-solid
{
    background : #cf222e;
    border-color : #cf222e;
    color : #ffffff;
}

.btn.danger-solid:hover
{
    background : #b11d28;
}

.btn[disabled]
{
    opacity : 0.6;
    cursor : default;
}

a.btn
{
    display : inline-block;
    color : var(--text);
    text-decoration : none;
}

.wide-btn
{
    width : 100%;
    padding : 12px 14px;
    font-size : 1rem;
}

.admin-modal
{
    max-width : 580px;
    max-height : calc(100vh - 40px);
    overflow-y : auto;
}

.confirm-modal
{
    max-width : 420px;
}

.delete-top
{
    background : #cf222e;
}

.confirm-text
{
    color : var(--muted);
    margin-bottom : 22px;
}

.modal-actions
{
    margin-top : 8px;
}

.form-card
{
    padding : 24px;
}

.form-actions
{
    display : flex;
    justify-content : flex-end;
    gap : 10px;
    margin-top : 8px;
}

.show-pass
{
    display : flex;
    align-items : center;
    gap : 8px;
    margin-bottom : 16px;
    font-size : 0.9rem;
    color : var(--muted);
    cursor : pointer;
}

.auth-wrap
{
    min-height : 100vh;
    display : flex;
    align-items : center;
    justify-content : center;
    padding : 20px;
}

.auth-card
{
    width : 100%;
    max-width : 420px;
    padding : 32px 28px;
}

.auth-card .logo
{
    display : block;
    margin : 0 auto 24px;
}

.auth-card h1
{
    font-size : 1.4rem;
    letter-spacing : -0.01em;
    margin-bottom : 6px;
}

.auth-card .intro
{
    color : var(--muted);
    margin-bottom : 20px;
}

@media (max-width : 760px)
{
    .admin-row
    {
        flex-wrap : wrap;
        padding : 14px 16px;
    }

    .admin-row-info
    {
        flex-basis : calc(100% - 80px);
    }

    .admin-row-actions
    {
        width : 100%;
    }

    .admin-row-actions .btn
    {
        flex : 1;
    }

    .admin-search
    {
        max-width : none;
    }

    .admin-head .btn
    {
        width : 100%;
    }
}

@media (max-width : 560px)
{
    .form-grid
    {
        grid-template-columns : repeat(2, minmax(0, 1fr));
    }

    .form-grid .date
    {
        grid-column : 1 / -1;
    }

    .form-card
    {
        padding : 18px;
    }
}

.admin-tools
{
    display : flex;
    align-items : center;
    gap : 8px;
}

.inline-form
{
    display : inline-flex;
}

.icon-btn
{
    flex-shrink : 0;
    min-width : 42px;
    display : inline-flex;
    align-items : center;
    justify-content : center;
    width : 42px;
    height : 40px;
    padding : 0;
}

.icon-btn svg
{
    display : block;
}

.section-title
{
    font-size : 1.05rem;
    margin-bottom : 14px;
}

.form-card
{
    margin-bottom : 20px;
}

.form-actions.spread
{
    justify-content : space-between;
    flex-wrap : wrap;
}

.misc-row
{
    display : grid;
    grid-template-columns : auto minmax(0, 1fr) minmax(0, 1.6fr) auto;
    align-items : end;
    gap : 12px;
    margin-bottom : 6px;
}

.misc-row .swatch
{
    margin-bottom : 20px;
}

.misc-row .btn
{
    margin-bottom : 16px;
}

.version-id
{
    font-family : ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size : 0.95rem;
    font-weight : 600;
}

.badge
{
    display : inline-block;
    padding : 2px 8px;
    margin-left : 6px;
    border-radius : 999px;
    background : var(--accent);
    color : var(--on-accent);
    font-size : 0.72rem;
    font-weight : 600;
    letter-spacing : 0.02em;
    vertical-align : middle;
}

.badge.muted
{
    margin-left : 0;
    background : var(--bg);
    border : 1px solid var(--border);
    color : var(--muted);
    white-space : nowrap;
}

.admin-row.current
{
    background : rgba(212, 168, 90, 0.2);
}

.admin-row input.pick
{
    width : 20px;
    height : 20px;
    flex-shrink : 0;
    accent-color : var(--accent);
}

.admin-row label.admin-row-info
{
    cursor : pointer;
}

.note
{
    margin : 14px 4px;
}

.import-actions
{
    margin-top : 20px;
}

@media (max-width : 760px)
{
    .admin-tools
    {
        width : 100%;
    }

    .admin-tools .primary
    {
        flex : 1;
    }

    .admin-head .admin-tools .btn.primary
    {
        width : auto;
    }

    .misc-row
    {
        grid-template-columns : auto minmax(0, 1fr);
    }

    .misc-row .field:nth-of-type(2),
    .misc-row .btn
    {
        grid-column : 1 / -1;
    }

    .misc-row .swatch
    {
        margin-bottom : 40px;
    }
}

.smtp-grid
{
    grid-template-columns : minmax(0, 1fr) 120px;
}

.hint.block
{
    display : block;
    margin-bottom : 14px;
}

.field input[readonly]
{
    background : var(--bg);
    font-family : ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size : 0.85rem;
}

@media (max-width : 560px)
{
    .smtp-grid
    {
        grid-template-columns : minmax(0, 1fr) 100px;
    }
}

.repeat-note
{
    color : var(--accent-text);
    font-weight : 500;
}

.remind-leads
{
    display : grid;
    gap : 2px;
    margin-top : 8px;
}

.auth-link
{
    margin-top : 16px;
    text-align : center;
    font-size : 0.9rem;
}

.auth-link a
{
    color : var(--accent-text);
    text-decoration : underline;
}

@media (prefers-color-scheme : dark)
{
    .auth-link a,
    .repeat-note
    {
        color : #d4a85a;
    }
}

.code-input
{
    letter-spacing : 6px;
    font-size : 1.3rem;
    text-align : center;
}