/* =========================================================
css file to maintain same looks between form comboboxes and regular input fields
   ========================================================= */

select,
.form-select,
select.form-control,
select.input,
select.project-input,
select.customer-input {
    height: 42px;
    min-height: 42px;
    line-height: 42px;

    width: 100%;
    padding: 0 12px;

    font-size: 14px;
    font-family: inherit;
    color: #111827;

    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 8px;

    box-sizing: border-box;
    outline: none;

    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;

    background-image:
        linear-gradient(45deg, transparent 50%, #6b7280 50%),
        linear-gradient(135deg, #6b7280 50%, transparent 50%);
    background-position:
        calc(100% - 18px) 18px,
        calc(100% - 13px) 18px;
    background-size:
        5px 5px,
        5px 5px;
    background-repeat: no-repeat;

    padding-right: 36px;
}

select:focus,
.form-select:focus,
select.form-control:focus,
select.input:focus,
select.project-input:focus,
select.customer-input:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 3px rgba(147, 197, 253, 0.35);
}

select:disabled,
.form-select:disabled,
select.form-control:disabled {
    background-color: #f3f4f6;
    color: #9ca3af;
    cursor: not-allowed;
}

/* Voor Safari/iOS: voorkomt rare native styling */
select::-ms-expand {
    display: none;
}
/* Invoice line choices are blue immediately, including Safari's unfocused state. */
#invoice-create-modal .invoice-create-line{appearance:none!important;-webkit-appearance:none!important;display:inline-block;width:16px;height:16px;flex:0 0 16px;border:1px solid #d1d5db!important;border-radius:4px;background:#fff!important;color:#2563eb;cursor:pointer}
#invoice-create-modal .invoice-create-line:checked{border-color:#2563eb!important;background-color:#2563eb!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='white' stroke-width='2' d='m3 8 3 3 7-7'/%3E%3C/svg%3E")!important;background-size:16px 16px!important;background-position:center!important;background-repeat:no-repeat!important}
#invoice-create-modal .invoice-create-line:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
#invoice-create-modal .invoice-create-line:disabled{opacity:.65;cursor:default}
#invoice-create-modal select{padding-right:34px!important;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;min-width:0}
#invoice-create-modal .invoice-selection-period{max-width:200px;height:34px;padding-left:10px;font-size:12px}
