@charset "UTF-8";
/* selectize */
.form-select .selectize-control.single .selectize-input{
  padding:1.1rem 1.5rem;
  color:#333;
  background: var(--mantine-color-gray-3) url('../images/svg/btn_open.svg') no-repeat calc(100% - 13px) center / auto;
  box-shadow:none;
  border-radius: 5px;
  border:none;
  border:1px solid var(--mantine-color-gray-4);
}
.form-select .selectize-control.single .selectize-input.input-active{
  background: var(--mantine-color-gray-3) url('../images/svg/btn_close.svg') no-repeat calc(100% - 13px) center / auto;
}
.form-select .selectize-control.single .selectize-input, 
.form-select .selectize-dropdown.single{
  border-color:var(--mantine-color-gray-4);
}
.form-select .selectize-dropdown.single,
.form-select .selectize-dropdown-content{border-radius:0 0 5px 5px;}
.form-select .selectize-input>input[placeholder]{font-size:13px;color:#333;}
.form-select .selectize-input>input[placeholder]::placeholder{font-size:13px;color:#333;}
.form-select .selectize-input .item{
  font-size:1.4rem;
  color:var(--mantine-color-gray-9);
}
.form-select .selectize-control.single .selectize-input:after{display:none;}
.form-select .selectize-dropdown{box-shadow:none;}
.form-select .selectize-dropdown [data-selectable].option.selected{background-color:var(--mantine-color-gray-2);color:var(--mantine-color-gray-9);font-weight:400;}
.form-select .selectize-control.single .selectize-input.input-active, .selectize-input{
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}
.form-select .selectize-dropdown .active:not(.selected){
  background-color:#F1F7FF;
}
.form-select .selectize-dropdown [data-selectable].option{
  padding:1.2rem 1rem;
  font-size:13px;
  color:#333;
}
.form-select .selectize-dropdown [data-selectable].option:hover{
  background-color:var(--mantine-color-gray-1)
}

/* date time picker */
/*
.bootstrap-datetimepicker-widget .glyphicon-chevron-left:before {
  content: '<';
}
.bootstrap-datetimepicker-widget .glyphicon-chevron-right:before {
  content: '>';
}
*/
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-chevron-up,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-chevron-down,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-screenshot,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-time,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-trash,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-remove,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-chevron-up:empty,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-chevron-down:empty,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-screenshot:empty,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-time:empty,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-trash:empty,
.bootstrap-datetimepicker-widget .datepicker table td .glyphicon-remove:empty {
  display: block;
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-up:before {
  content: "▲";
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-down:before {
  content: "▼";
}

.bootstrap-datetimepicker-widget .glyphicon-screenshot:before {
  content: "⌖";
}

.bootstrap-datetimepicker-widget .glyphicon-time:before {
  content: "🕒";
}

.bootstrap-datetimepicker-widget .glyphicon-calendar:before {
  content: "▦";
}

.bootstrap-datetimepicker-widget .glyphicon-trash:before {
  content: "🗑";
}

.bootstrap-datetimepicker-widget .glyphicon-remove:before {
  content: "╳";
}

.bootstrap-datetimepicker-widget.dropdown-menu {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  width: 225px;
  margin: 6px 0;
  padding: 15px;
  border-radius: 4px;
  border: 1px solid #b8c0cb;
  background-color: #fff;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.bootstrap-datetimepicker-widget.dropdown-menu .row{
  flex-flow:column wrap;
}

.bootstrap-datetimepicker-widget.dropdown-menu:before,
.bootstrap-datetimepicker-widget.dropdown-menu:after {
  display: none;
}

.bootstrap-datetimepicker-widget.dropdown-menu td {
  border-top: 1px solid #f3f3f3 !important;
}

.bootstrap-datetimepicker-widget.dropdown-menu.usetwentyfour.bottom::after,
.bootstrap-datetimepicker-widget.dropdown-menu.usetwentyfour.bottom::before {
  display: none;
}

.bootstrap-datetimepicker-widget .datepicker {
  position: relative;
  z-index: 0;
}

.bootstrap-datetimepicker-widget .datepicker table {
  table-layout: fixed;
  padding: 0;
  border-collapse: collapse;
  border-spacing: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.bootstrap-datetimepicker-widget .datepicker table th,
.bootstrap-datetimepicker-widget .datepicker table td {
  padding: 0;
  width: auto;
  height: auto;
}

.bootstrap-datetimepicker-widget .datepicker table th.picker-switch {
  width: auto;
  border-radius: 4px;
  font-size: 13px;
  line-height: 21px;
  font-weight: 400;
  vertical-align: middle;
}

.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.picker-switch:hover {
  border-radius: 4px;
  background-color: #f5f6f8;
}

.bootstrap-datetimepicker-widget .picker-switch a{background:transparent}
.bootstrap-datetimepicker-widget .picker-switch span{
  padding:0;
  margin:0;
  background:transparent
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-left,
.bootstrap-datetimepicker-widget .glyphicon-chevron-right {
  display: block;
  width: 2.4rem;
  height: 2.7rem;
  border-radius: 4px;
  background: no-repeat 50% 50%;
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-right {
  margin-left: auto;
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-left {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24'%3E%3Cg data-name='ic_prev_n' style='opacity:.9'%3E%3Cpath data-name='패스 3499' d='m1832 103 5 5 5-5' transform='rotate(90 968.25 -856.75)' style='fill:none;stroke:%23232931;stroke-width:1.5px'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.bootstrap-datetimepicker-widget .glyphicon-chevron-right {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24'%3E%3Cg data-name='ic_next_n' style='opacity:.9'%3E%3Cpath data-name='패스 3499' d='m1832 103 5 5 5-5' transform='rotate(-90 874.75 974.25)' style='fill:none;stroke:%23232931;stroke-width:1.5px'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.bootstrap-datetimepicker-widget th.prev.disabled .glyphicon-chevron-left {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24'%3E%3Cg data-name='ic_prev_n' style='opacity:.9'%3E%3Cpath data-name='패스 3499' d='m1832 103 5 5 5-5' transform='rotate(90 968.25 -856.75)' style='fill:none;stroke:%23232931;stroke-width:1.5px'/%3E%3C/g%3E%3C/svg%3E%0A");
  opacity: 0.3;
}

.bootstrap-datetimepicker-widget th.next.disabled .glyphicon-chevron-right {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='24'%3E%3Cg data-name='ic_next_n' style='opacity:.9'%3E%3Cpath data-name='패스 3499' d='m1832 103 5 5 5-5' transform='rotate(-90 874.75 974.25)' style='fill:none;stroke:%23232931;stroke-width:1.5px'/%3E%3C/g%3E%3C/svg%3E%0A");
  opacity: 0.3;
}

.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.prev:hover,
.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.next:hover {
  background: none;
}

.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.prev:hover .glyphicon-chevron-left,
.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.next:hover .glyphicon-chevron-right {
  border-radius: 4px;
  background-color: #f5f6f8;
}

.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.prev.disabled:hover .glyphicon-chevron-left,
.bootstrap-datetimepicker-widget .datepicker table thead tr:first-child th.next.disabled:hover .glyphicon-chevron-right {
  background-color: transparent;
}

.bootstrap-datetimepicker-widget .datepicker table thead th.dow,
.bootstrap-datetimepicker-widget .datepicker table tbody td[colspan="7"] {
  padding-top: 12px;
}

.bootstrap-datetimepicker-widget .datepicker table thead th.dow {
  padding-bottom: 10px;
  font-size: 13px;
  line-height: 19px;
  font-weight: 400;
  color: inherit;
}

.bootstrap-datetimepicker-widget .datepicker table td.day {
  width: auto;
  height: auto;
  padding: 5px 0;
  font-size: 12px;
  line-height: 20px;
  color: inherit;
}

.bootstrap-datetimepicker-widget .datepicker table tr:first-child td.day {
  border-top: 1px solid #000;
}

.bootstrap-datetimepicker-widget .datepicker table td.day.weekend:first-child {
  color: #30b59c;
}

.bootstrap-datetimepicker-widget .datepicker table td.day.weekend:last-child {
  color: inherit;
}

.bootstrap-datetimepicker-widget .datepicker table td.day:hover,
.bootstrap-datetimepicker-widget .datepicker table td.hour:hover,
.bootstrap-datetimepicker-widget .datepicker table td.minute:hover,
.bootstrap-datetimepicker-widget .datepicker table td.second:hover {
  background: none;
}

.bootstrap-datetimepicker-widget .datepicker table td.day:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td.hour:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td.minute:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td.second:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td.day.today:before,
.bootstrap-datetimepicker-widget .datepicker table td.active:before {
  content: "";
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  position: absolute;
  margin: -2px 2px 0;
  z-index: -1;
  width: 24px;
  height: 24px;
  border-radius: 4px;
  background: #f5f6f8;
}

.bootstrap-datetimepicker-widget .datepicker table td.active,
.bootstrap-datetimepicker-widget .datepicker table td.active:hover,
.bootstrap-datetimepicker-widget .datepicker table td.active.day.weekend:first-child,
.bootstrap-datetimepicker-widget .datepicker table td.active.day.weekend:first-child:hover,
.bootstrap-datetimepicker-widget .datepicker table td.active.day.weekend:last-child,
.bootstrap-datetimepicker-widget .datepicker table td.active.day.weekend:last-child:hover {
  color: #fff;
  text-shadow: none;
  background: none;
}

.bootstrap-datetimepicker-widget .datepicker table td.active:before,
.bootstrap-datetimepicker-widget .datepicker table td.active:hover:before {
  background-color: #30b59c;
}

.bootstrap-datetimepicker-widget .datepicker table td.old,
.bootstrap-datetimepicker-widget .datepicker table td.new {
  opacity: 0.6;
}

.bootstrap-datetimepicker-widget .datepicker table td.disabled,
.bootstrap-datetimepicker-widget .datepicker table td.disabled:hover {
  opacity: 0.2;
}

.bootstrap-datetimepicker-widget .datepicker table td.disabled:before,
.bootstrap-datetimepicker-widget .datepicker table td.disabled:hover:before {
  display: none;
}

.bootstrap-datetimepicker-widget .datepicker table td.day.today:before {
  border: 1px solid #30b59c;
  bottom: auto;
  right: auto;
  background-color: transparent;
}

.bootstrap-datetimepicker-widget .datepicker table td.day {
  text-align: center;
}

.bootstrap-datetimepicker-widget .datepicker table td.day.today:hover:before {
  background-color: #f5f6f8;
}

.bootstrap-datetimepicker-widget .datepicker table td.day.today.active:before {
  background-color: #30b59c;
}

.bootstrap-datetimepicker-widget .datepicker table tbody td[colspan="7"]:after {
  content: "";
  display: table;
  clear: both;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month,
.bootstrap-datetimepicker-widget .datepicker table td span.year,
.bootstrap-datetimepicker-widget .datepicker table td span.decade {
  display: block;
  float: left;
  width: 25%;
  height: auto;
  margin: 0;
  font-size: 13px;
  line-height: 21px;
  padding: 13px 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month:hover,
.bootstrap-datetimepicker-widget .datepicker table td span.year:hover,
.bootstrap-datetimepicker-widget .datepicker table td span.decade:hover {
  background: none;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.month.active:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year.active:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.active:before {
  content: "";
  display: block;
  position: absolute;
  margin: -9px 5px 0;
  z-index: -1;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  background: #f5f6f8;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month.active,
.bootstrap-datetimepicker-widget .datepicker table td span.year.active,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.active {
  text-shadow: none;
  background: none;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month.active:before,
.bootstrap-datetimepicker-widget .datepicker table td span.month.active:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year.active:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year.active:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.active:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.active:hover:before {
  background-color: #30b59c;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month.disabled,
.bootstrap-datetimepicker-widget .datepicker table td span.month.disabled:hover,
.bootstrap-datetimepicker-widget .datepicker table td span.year.disabled,
.bootstrap-datetimepicker-widget .datepicker table td span.year.disabled:hover,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.disabled,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.disabled:hover {
  opacity: 0.2;
}

.bootstrap-datetimepicker-widget .datepicker table td span.month.disabled:before,
.bootstrap-datetimepicker-widget .datepicker table td span.month.disabled:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year.disabled:before,
.bootstrap-datetimepicker-widget .datepicker table td span.year.disabled:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.disabled:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.disabled:hover:before {
  display: none;
}

.bootstrap-datetimepicker-widget .datepicker-decades .decade {
  font-size: 12px;
  line-height: 16px !important;
  height: 62px;
  padding-left: 10px;
  padding-right: 10px;
}

.bootstrap-datetimepicker-widget .datepicker table td span.decade {
  width: 33.333333%;
}

.bootstrap-datetimepicker-widget .datepicker table td span.decade:hover:before,
.bootstrap-datetimepicker-widget .datepicker table td span.decade.active:before {
  margin: -10px 0 0 -4px;
  width: 52px;
  height: 52px;
}

.bootstrap-datetimepicker-widget .datepicker table td span:empty {
  display: none;
}
.bootstrap-datetimepicker-widget .collapse:not(.show){
  display:block !important;
}
.ui-form-block{
  position:relative;
}
.js-datepicker-range .input-field{
  padding-right:30px;
  font-size:14px;
}
.js-datepicker-range .bootstrap-datetimepicker-widget.dropdown-menu.timepicker-sbs{
  width:auto;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .datepicker{
  max-width:100%;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker{
  max-width:100%;
  padding-top:10px;
}
.js-datepicker-range .bootstrap-datetimepicker-widget.dropdown-menu .timepicker table td{
  line-height:100%;
  border-top:none !important;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td{
  width:auto;
  height:auto;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td a{
  display:flex;
  align-items: center;
  justify-content: center;
  min-width:44px;
  height:25px;
  padding:0;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td button{
  height:35px;
  padding-block:0;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td span{
  width:auto;
  height:auto;
  margin:0;
  line-height:0;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td .timepicker-hour{
  font-size:1em;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker table td .timepicker-minute{
  font-size:1em;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .glyphicon-chevron-up:before, .js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .glyphicon-chevron-down:before{
  font-size:11px;
  line-height:1;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .timepicker-hours table td, .js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .timepicker-minutes table td{
  padding-block:5px;
}
.js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .timepicker-picker table td .timepicker-hour, .js-datepicker-range .bootstrap-datetimepicker-widget .timepicker .timepicker-picker table td .timepicker-minute{
  padding:10px;
}

/* 날짜/시간 선택 스타일 */
.date-time-wrap {
    display: flex;
    gap: 5px;
    align-items: center;
}

.custom-date {
    position: relative;
    width: 140px;
}

.date-input {
    width: 100%;
    height: 4.2rem;
    padding: 0 4rem 0 1rem;
    border: 1px solid var(--mantine-color-gray-3);
    border-radius: 5px;
    font-size: 1.4rem;
    color: #333;
  }
  .date-input[type=date]{
    min-width:auto;
    text-indent:0;
    background:#fff;
    font-size: 1.4rem;
}

.btn-calendar {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    height: 30px;
    padding: 5px;
    border: none;
    background: none;
    cursor: pointer;
}

.btn-calendar img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.custom-time-box {
  position: relative;
  width: 90px;
}
.time-display {
  position:relative;
  width: 100%;
  height: 44px;
  border: 1px solid #E7E7E7;
  border-radius: 6px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: .8em;
  cursor: pointer;
  transition: border 0.2s;
  background-color:#fff;
}
.btn-time{
  position:absolute;
  top:50%;
  right:5px;
  width:30px;
  height:30px;
  padding:5px;
  transform:translateY(-50%);
  z-index:1;
}
.time-value{margin-top:5px;padding-left:15px;}
.time-display:hover, .custom-time-box.active .time-display {
  border-color: #433E35;
}
.time-picker-dropdown {
  display: none;
  position: absolute;
  top: 48px;
  left: 0;
  width: 110px;
  background: #fff;
  border: 1px solid #E7E7E7;
  border-radius: 6px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  z-index: 10;
}
.custom-time-box.active .time-picker-dropdown {
  display: block;
}
.time-picker-content {
  display: flex;
  width: 100%;
}
.time-column {
  flex: 1;
  max-height: 160px;
  overflow-y: auto;
  text-align: center;
}
.time-column div {
  padding: 8px 0;
  cursor: pointer;
  font-size: 15px;
  border-radius: 4px;
  transition: background 0.2s;
}
.time-column div:hover, .time-column div.selected {
  background: #F5F2EE;
  color: #433E35;
}
.time-range{
  display:flex;
  align-items:center;
}
.time-range-separator {
  margin: 0 10px;
  font-size: 18px;
  color: #888;
}

/* 호버/포커스 상태 */
.date-input:hover {
    border-color: #aaa;
}

.date-input:focus {
    border-color: var(--primary_Brown);
    outline: none;
    box-shadow: 0 0 0 2px rgba(96, 88, 76, 0.1);
}

/* 비활성화 상태 */
.date-input:disabled {
    background-color: #f5f5f5;
    border-color: #ddd;
    cursor: not-allowed;
}

/* ag-grid table */
.data-table .ag-input-wrapper:before{
  right:1rem;
}
.data-table .ag-input-wrapper .ag-input-field-input{
  text-indent:1rem;
}
.data-table .ag-cell-wrapper{
  height:100%;
}
.data-table .ag-header-cell-text{
  font-size:1.4rem;
}
.data-table .ag-cell-value{
  font-size:1.4rem;
}
.data-table .ag-header-cell-label{
  justify-content: center;
}
.data-table .ag-paging-panel{
  display:none;
}

/* 커스텀 페이지네이션 스타일 */
.custom-pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 20px;
  background: #f8f9fa;
  border-top: 1px solid #dee2e6;
  margin-top: 10px;
}

.pagination-info {
  display: flex;
  gap: 20px;
  font-size: 14px;
  color: #6c757d;
}

.pagination-info strong {
  color: #495057;
  font-weight: 600;
}

.pagination-controls {
  display: flex;
  align-items: center;
  gap: 8px;
}

.btn-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: #fff;
  color: #495057;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.btn-pagination:hover:not(:disabled) {
  background: #e9ecef;
  border-color: #adb5bd;
}

.btn-pagination:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.btn-pagination.active {
  background: #007bff;
  color: #fff;
  border-color: #007bff;
}

.page-numbers {
  display: flex;
  gap: 4px;
}

.btn-page {
  min-width: 36px;
  height: 36px;
  border: 1px solid #dee2e6;
  background: #fff;
  color: #495057;
  border-radius: 4px;
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 14px;
}

.btn-page:hover {
  background: #e9ecef;
  border-color: #adb5bd;
}

.btn-page.active {
  background: #007bff;
  color: #fff;
  border-color: #007bff;
}

.page-size-selector {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: #6c757d;
}

.page-size-selector select {
  min-width:8rem;
  padding: .5rem 1.2rem;
  height:100%;
  border: 1px solid #dee2e6;
  border-radius: 4px;
  background: var(--mantine-color-gray-0) url('../images/svg/btn_open.svg') no-repeat calc(100% - 1rem) center / auto;
  font-size: 14px;
  appearance: none;
  color: #495057;
}

.page-size-selector select:focus {
  outline: none;
  border-color: #007bff;
  box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
}

/* 반응형 디자인 */
@media (max-width: 768px) {
  .custom-pagination {
    flex-direction: column;
    gap: 15px;
    padding: 15px;
  }
  
  .pagination-info {
    justify-content: center;
  }
  
  .pagination-controls {
    justify-content: center;
  }
  
  .page-size-selector {
    justify-content: center;
  }
}