.error-input { border: 1px solid #FD5757 !important; background-color: #ffefef; } .modal-dialog { position: fixed; top: 50%; right: 50%; transform: translate(50%, -52%) !important; width: 750px !important; } .modal-content { /*height: 370px;*/ background-color: #FFFFFF !important; padding: 0px !important; } .d-none { display: none } .modal-custom { position: relative; /*display: flex;*/ /*justify-content: center;*/ /*align-items: center;*/ } .modal__dialog { background: white; border-radius: 8px; width: 500px; max-width: 100%; box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3); overflow: hidden; } .modal__header, .modal__footer { padding: 5px 0; } .modal__footer { display: flex; justify-content: center; gap: 0.5rem; } .modal__title { margin: 0; font-size: 1.25rem; font-weight: bold; text-align: center; } .modal__close { background: transparent; border: none; font-size: 1.5rem; cursor: pointer; position: absolute; top: 3px; right: -12px; } .modal__content { padding: 1rem; } .modal__button { padding: 0.5rem 1rem; border: none; background-color: #ddd; cursor: pointer; border-radius: 4px; width: 200px; } .modal__button--success { background-color: #84CC16; color: white; } .modal__button--cancel { background-color: #454D5C; color: white; } /* --------------------------------------------------- Card Action */ .disable { filter: grayscale(100%); pointer-events: none; opacity: 0.6; } .disable-blur { filter: blur(2px) grayscale(100%); pointer-events: none; opacity: 0.6; } .card-action { position: relative; border: 1px solid #E4E4E7; border-radius: 12px; padding: 12px; background-color: #FFFFFF; display: flex; width: 100%; margin: 0 0 18px 0; user-select: none; } .card-action__success { border: 1px solid #55d187; background-color: #e9fdf2; } .card-action__title { font-weight: bold; position: absolute; top: -12px; right: 15px; } .card-action__container { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; } .card-action__container-right { display: flex; align-items: center; gap: 15px; } .card-action__container-left { display: flex; align-items: center; gap: 15px; } .card-action__upload { border: 1px dashed #ccc; background: #ffffff; display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px; border-radius: 10px; position: relative; } .card-action__upload-btn { background-color: #C7FFE9; border: none; padding: 6px 12px; border-radius: 50px; cursor: pointer; font-size: 12px; width: 89px; } .remove-file-btn { background-color: #e74c3c; color: white; } .remove-file-btn:hover { background-color: #c0392b; } .card-action__upload-icon { font-size: 24px; color: #00c07e; } .card-action__date { position: relative; display: flex; flex-direction: column; align-items: flex-start; } .card-action__price { position: relative; display: flex; flex-direction: column; align-items: flex-start; } .card-action__price-rial { position: absolute; top: 8px; left: 7px; font-size: 12px; color: #5e5e5e; } .card-action__label { position: absolute; top: -10px; right: 6px; font-size: 12px; color: #666; } .card-action__input { border: 1px solid #DADADA; border-radius: 9px; padding: 6px 10px; text-align: center; min-width: 90px; width: 180px; direction: ltr; } .card-action__textarea { border: 1px solid #DADADA; border-radius: 9px; padding: 6px 10px; min-width: 90px; width: 380px; height: 80px; resize: none; } .card-action__inspection-type { display: flex; flex-direction: column; gap: 12px; } .card-action__checkbox { font-size: 14px; cursor: pointer; color: #333; display: flex; align-items: center; gap: 10px; } .card-action__checkbox input { margin: 0; } .card-action__status { margin-right: auto; background-color: #EEE; padding: 8px; border-radius: 10px; display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; } .card-action__status-success { background-color: #C6FFB4; } .card-action__status-icon { color: white; font-size: 20px; display: flex; justify-content: center; align-items: center; } .file-info { font-size: 0.9rem; color: #333; } .card-action__date--group { display: flex; gap: 10px; flex-direction: column; } @media(max-width:768px) { .modal-dialog { width: 500px !important; } .modal__content { padding: 0; } .card-action { margin: 0 0 10px 0; } .card-action__status { display: none; } .card-action__container-right .card-action__inspection-type { flex-direction: row; } .card-action__inspection-type { flex-direction: column; } .card-action__container { flex-direction: column; } .card-action__container-left { flex-direction: column; } .card-action__input { width: 270px; } .card-action__upload { flex-direction: row-reverse; width: 100%; justify-content: space-between; } .card-action__date--group { flex-direction: row; } .card-action__date--group .card-action__input { width: 130px; } .card-action__container { gap: 7px; } .card-action__textarea { width: 272px; height: 50px; } } @media (max-width: 576px) { .modal-dialog { width: 350px !important; } }