/* Amana service widget: municipal turquoise and alternating gray rows. Scoped to #amana-widget. */
#amana-widget {
    --amana-green: #35ab8d;
    --amana-green-dark: #248e78;
    --amana-link: #29ad91;
    --amana-text: #3b3b3b;
    --amana-muted: #747474;
    --amana-line: #e3e3e3;
    --amana-stripe: #f0f0f0;
    font-family: inherit;
    direction: rtl;
    color: var(--amana-text);
    max-width: 1200px;
    margin: 30px auto 45px;
    line-height: 1.6
}

    #amana-widget * {
        box-sizing: border-box
    }

    #amana-widget h2 {
        font-size: clamp(23px,2.4vw,32px);
        margin: 0 0 7px;
        color: #282828;
        font-weight: 700
    }

    #amana-widget .amana-note {
        color: var(--amana-muted);
        margin: 0 0 22px
    }

    #amana-widget .amana-filters {
        background: #f5f5f5;
        border: 1px solid #e7e7e7;
        border-radius: 2px;
        padding: 22px;
        box-shadow: 0 2px 7px rgba(0,0,0,.07)
    }

    #amana-widget .amana-fields {
        display: grid;
        grid-template-columns: 2fr 1fr 1fr;
        gap: 16px
    }

    #amana-widget label {
        font-size: 14px;
        font-weight: 700;
        display: flex;
        flex-direction: column;
        gap: 7px;
        color: #404040
    }

    #amana-widget input, #amana-widget select {
        width: 100%;
        min-height: 43px;
        background: #fff;
        border: 1px solid #d8d8d8;
        border-radius: 2px;
        padding: 8px 12px;
        color: #444;
        font: inherit;
        font-weight: 400
    }

        #amana-widget input:focus-visible, #amana-widget select:focus-visible, #amana-widget button:focus-visible {
            outline: 3px solid var(--amana-green-dark);
            outline-offset: 2px
        }

    #amana-widget .amana-actions {
        display: flex;
        justify-content: flex-start;
        margin-top: 14px
    }

    #amana-widget button {
        cursor: pointer;
        font: inherit
    }

    #amana-widget #amana-clear {
        background: #fff;
        border: 1px solid var(--amana-green);
        border-radius: 2px;
        color: var(--amana-green-dark);
        padding: 8px 18px;
        font-weight: 700
    }

        #amana-widget #amana-clear:hover {
            background: #e9f8f3
        }

    #amana-widget .amana-toolbar {
        display: flex;
        align-items: center;
        gap: 12px;
        margin: 18px 0
    }

        #amana-widget .amana-toolbar p {
            font-weight: 700;
            margin: 0;
            color: var(--amana-green-dark)
        }

    #amana-widget .amana-table-scroll {
        overflow-x: auto;
        border: 1px solid #e5e5e5;
        border-radius: 0
    }

    #amana-widget .amana-table {
        width: 100%;
        border-collapse: collapse;
        text-align: right;
        min-width: 650px
    }

    #amana-widget th {
        background: var(--amana-green);
        color: #fff;
        padding: 11px 14px;
        font-weight: 700
    }

    #amana-widget td {
        padding: 10px 14px;
        border-bottom: 1px solid #ececec;
        vertical-align: top;
        color: #666
    }

    #amana-widget tbody tr:nth-child(even) {
        background: var(--amana-stripe)
    }

    #amana-widget tbody tr:hover {
        background: #e5f5ef
    }

    #amana-widget td:first-child {
        font-weight: 700;
        color: var(--amana-link)
    }

    #amana-widget .amana-detail {
        background: transparent;
        border: 1px solid var(--amana-green);
        color: var(--amana-green-dark);
        border-radius: 2px;
        padding: 4px 12px;
        white-space: nowrap;
        font-weight: 700
    }

        #amana-widget .amana-detail:hover {
            background: var(--amana-green);
            color: white
        }

    #amana-widget .amana-pagination {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px;
        margin-top: 18px;
        flex-wrap: wrap;
        color: #666
    }

    #amana-widget #amana-pages {
        display: flex;
        flex-wrap: wrap;
        gap: 5px
    }

        #amana-widget #amana-pages button {
            min-width: 36px;
            min-height: 36px;
            border: 1px solid #d9d9d9;
            border-radius: 2px;
            background: #fff;
            color: var(--amana-green-dark)
        }

            #amana-widget #amana-pages button[aria-current=page] {
                background: var(--amana-green);
                border-color: var(--amana-green);
                color: white
            }

            #amana-widget #amana-pages button:disabled {
                cursor: default;
                opacity: .45
            }

    #amana-widget .amana-extra {
        padding: 10px 14px;
        background: #eaf7f2;
        color: #555
    }

    #amana-widget .amana-empty {
        text-align: center;
        padding: 30px;
        color: var(--amana-muted)
    }

@media(max-width:700px) {
    #amana-widget {
        margin: 22px 10px
    }

        #amana-widget .amana-fields {
            grid-template-columns: 1fr
        }

        #amana-widget .amana-pagination {
            flex-direction: column;
            align-items: flex-start
        }
}

/* Comfortable pagination spacing, including Previous / Next. */
#amana-widget #amana-pages button {
    padding: 8px 12px;
    min-width: 40px;
    white-space: nowrap;
    line-height: 1.4
}

    #amana-widget #amana-pages button:first-child, #amana-widget #amana-pages button:last-child {
        padding-inline: 16px;
        min-width: 64px
    }