/* Custom Theme: Dominant White + Itenas Orange Accents */
:root {
  --primary-orange: #f26522;
  --primary-orange-hover: #d9531e;
  --primary-orange-light: #fff7ed;
  --primary-orange-border: #ffedd5;
  --text-dark: #0f172a;
  --text-muted: #64748b;
  --bg-white: #ffffff;
  --bg-light: #f8fafc;
}

body {
  background-color: var(--bg-white) !important;
  color: #334155;
}

main.main {
  background-color: var(--bg-white) !important;
}

/* Links & Typography */
a {
  color: var(--primary-orange);
  transition: all 0.2s ease;
}
a:hover {
  color: var(--primary-orange-hover);
}

.text-small-primary {
  color: var(--primary-orange) !important;
}
.text-small-primary--disk::before {
  background-color: var(--primary-orange) !important;
}

/* Buttons */
.btn-default, 
.btn-find, 
button.btn-find, 
.box-button-shadow .btn-default {
  background-color: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(242, 101, 34, 0.25) !important;
}

.btn-default:hover, 
.btn-find:hover, 
button.btn-find:hover, 
.box-button-shadow .btn-default:hover {
  background-color: var(--primary-orange-hover) !important;
  border-color: var(--primary-orange-hover) !important;
  box-shadow: 0 6px 20px rgba(242, 101, 34, 0.35) !important;
}

.btn-border {
  border: 1.5px solid var(--primary-orange) !important;
  color: var(--primary-orange) !important;
  background-color: transparent !important;
}
.btn-border:hover, .btn-brand-hover:hover {
  background-color: var(--primary-orange) !important;
  color: #ffffff !important;
  border-color: var(--primary-orange) !important;
}

.btn-grey-small.disc-btn {
  background-color: var(--primary-orange-light) !important;
  color: var(--primary-orange) !important;
  border: 1px solid var(--primary-orange-border) !important;
  font-weight: 600;
}

.btn-urgent {
  background-color: #ef4444 !important;
  color: #ffffff !important;
}

/* Header & Navbar */
.header {
  background-color: #ffffff !important;
  border-bottom: 1px solid #f1f5f9;
}
.main-menu nav ul li a:hover, 
.main-menu nav ul li.active > a {
  color: var(--primary-orange) !important;
}

/* Hero & Banner Section */
.banner-hero.hero-1 {
  background: linear-gradient(180deg, #ffffff 0%, #fff7ed 100%) !important;
  border-bottom: 1px solid #fed7aa;
}

.banner-hero::before {
  background: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%) !important;
  border: 1px solid #fed7aa !important;
}

/* Banner hero image arch shape is now natively Itenas Orange */

.form-find {
  background: #ffffff !important;
  box-shadow: 0 12px 35px rgba(0, 0, 0, 0.07) !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 16px !important;
  padding: 10px !important;
}

.form-find form {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.form-find .form-input,
.form-find .select2 {
  margin-right: 0 !important;
  height: 52px !important;
  border-radius: 10px !important;
}

.form-find .select2 {
  display: flex !important;
  align-items: center !important;
}

.form-find .btn-find {
  min-width: 170px !important;
  height: 52px !important;
  padding: 0 28px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  border-radius: 10px !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
  color: #ffffff !important;
  box-shadow: 0 4px 14px rgba(242, 101, 34, 0.3) !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.form-find .btn-find:hover {
  background-color: #ea580c !important;
  border-color: #ea580c !important;
  box-shadow: 0 6px 20px rgba(242, 101, 34, 0.45) !important;
  transform: translateY(-2px) !important;
}

.form-find .form-input:focus {
  border-color: var(--primary-orange) !important;
}

.list-tags-banner a {
  color: var(--primary-orange);
  font-weight: 500;
}

/* Cards & Sections */
.section-box {
  background-color: var(--bg-white);
}

.bg-patern {
  background-color: #fff7ed !important;
  border-top: 1px solid #fed7aa;
  border-bottom: 1px solid #fed7aa;
}

.card-grid, .card-grid-2, .card-grid-3 {
  background-color: #ffffff !important;
  border: 1px solid #f1f5f9 !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
  border-radius: 16px !important;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.card-grid:hover, .card-grid-2:hover, .card-grid-3:hover {
  border-color: #fed7aa !important;
  box-shadow: 0 12px 28px rgba(242, 101, 34, 0.12) !important;
  transform: translateY(-4px);
}

.card-grid .card-heading a:hover,
.card-grid-2 h5 a:hover,
.card-grid-3 h5 a:hover {
  color: var(--primary-orange) !important;
}

.card-text-price {
  color: var(--primary-orange) !important;
  font-weight: 700;
}

/* Tabs */
.nav-right button.active, .nav-right button:hover {
  color: var(--primary-orange) !important;
  border-bottom-color: var(--primary-orange) !important;
}
.nav-tabs .nav-link.active {
  color: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
}

/* Swiper navigation */
.box-swiper {
  position: relative !important;
}
.box-swiper .swiper-button-next, 
.box-swiper .swiper-button-prev,
.swiper-button-next, 
.swiper-button-prev {
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease-in-out !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  margin-top: 0 !important;
}
.box-swiper .swiper-button-next:after,
.swiper-button-next:after {
  content: "\f10f" !important;
  font-family: "uicons-regular-rounded" !important;
  font-size: 15px !important;
  color: #475569 !important;
  font-weight: bold !important;
}
.box-swiper .swiper-button-prev:after,
.swiper-button-prev:after {
  content: "\f10e" !important;
  font-family: "uicons-regular-rounded" !important;
  font-size: 15px !important;
  color: #475569 !important;
  font-weight: bold !important;
}
.box-swiper .swiper-button-next:hover, 
.box-swiper .swiper-button-prev:hover,
.swiper-button-next:hover, 
.swiper-button-prev:hover {
  background: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
  box-shadow: 0 6px 16px rgba(242, 101, 34, 0.3) !important;
  transform: scale(1.08) !important;
}
.box-swiper .swiper-button-next:hover:after, 
.box-swiper .swiper-button-prev:hover:after,
.swiper-button-next:hover:after, 
.swiper-button-prev:hover:after {
  color: #ffffff !important;
}
.swiper-pagination-bullet-active {
  background: var(--primary-orange) !important;
}

/* Partner Logos */
.list-partners li {
  background: #ffffff !important;
  border: 1px solid #f1f5f9 !important;
  border-radius: 12px;
  padding: 15px;
  transition: all 0.2s ease;
}
.list-partners li:hover {
  border-color: #fed7aa !important;
  box-shadow: 0 6px 20px rgba(242, 101, 34, 0.08) !important;
}

/* Newsletter Box */
.box-newsletter {
  background: linear-gradient(135deg, #f26522 0%, #ea580c 100%) !important;
  border-radius: 20px !important;
  color: #ffffff !important;
}
.box-newsletter .text-md-newsletter,
.box-newsletter .text-lg-newsletter {
  color: #ffffff !important;
}
.box-newsletter .btn-default {
  background-color: #0f172a !important;
  border-color: #0f172a !important;
  color: #ffffff !important;
}
.box-newsletter .btn-default:hover {
  background-color: #1e293b !important;
  border-color: #1e293b !important;
}

.footer a:hover {
  color: var(--primary-orange) !important;
}
/* Form Checks & Radios - Orange Accent */
.form-check-input {
  cursor: pointer !important;
}
.form-check-input:checked {
  background-color: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
}
.form-check-input:focus {
  border-color: var(--primary-orange) !important;
  box-shadow: 0 0 0 0.25rem rgba(242, 101, 34, 0.2) !important;
}
.form-check-label {
  cursor: pointer !important;
}

/* Select Inputs in Filter Sections */
.job-fillter select.form-select,
.sidebar-filters select.form-select {
  border-radius: 10px !important;
  border: 1px solid #cbd5e1 !important;
  padding: 8px 36px 8px 14px !important;
  font-size: 14px !important;
  color: var(--text-dark) !important;
  background-color: #ffffff !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  min-height: 45px !important;
}
.job-fillter select.form-select:focus,
.sidebar-filters select.form-select:focus {
  border-color: var(--primary-orange) !important;
  box-shadow: 0 0 0 0.25rem rgba(242, 101, 34, 0.15) !important;
}

/* Custom Filter Dropdown Double-Arrow Fix */
.custom-filter-dropdown .dropdown-toggle::after {
  display: none !important;
}

/* Box View Type Toggle Styling */
.box-view-type a.view-type {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  border: 1px solid #cbd5e1 !important;
  background-color: #ffffff !important;
  color: #64748b !important;
  font-size: 16px !important;
  transition: all 0.2s ease !important;
  margin-left: 4px !important;
  text-decoration: none !important;
}
.box-view-type a.view-type:hover {
  border-color: var(--primary-orange) !important;
  color: var(--primary-orange) !important;
  background-color: #fff7ed !important;
}
.box-view-type a.view-type.active {
  border-color: var(--primary-orange) !important;
  background-color: var(--primary-orange) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(242, 101, 34, 0.3) !important;
}
.box-view-type a.view-type i {
  font-size: 16px !important;
  line-height: 1 !important;
}

/* Job Tags in Filter Box */
.box-filters .list-tags-job {
  margin-top: 10px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
}
.box-filters .list-tags-job a.job-tag {
  padding: 6px 32px 6px 14px !important;
  border-radius: 8px !important;
  background-color: #fff7ed !important;
  color: var(--primary-orange) !important;
  border: 1px solid #ffedd5 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  transition: all 0.2s ease !important;
}
.box-filters .list-tags-job a.job-tag:hover {
  background-color: #ffedd5 !important;
  color: var(--primary-orange-hover) !important;
}
.box-filters .list-tags-job a.job-tag .remove-tags-job {
  right: 10px !important;
}

/* Custom Purple-to-Orange Overrides */
header .main-menu li ul li a::after,
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li ul li a::before {
  background-color: var(--primary-orange) !important;
}

.text-brand,
.btn-link:hover,
.breadcrumbs li a:hover,
.header .main-menu li a:hover,
.card-grid a:hover,
.card-grid-2 a:hover,
.card-grid-2 .card-block-info .card-profile strong:hover,
.card-grid-3 h5 a:hover,
.list-recent-jobs .card-job .card-job-top--info-heading:hover a,
.list-recent-jobs .card-job .card-job-top--info .card-job-top--company,
.card-job-bottom a.color-muted:hover,
.card-grid-4 .btn-readmore,
.card-none-bd .card-info-bottom h3,
.card-grid-news .card-info-bottom h3,
.card-grid-news .card-info-bottom ul li,
.employers-list .card-employers .employers-name h5:hover a,
.nav-style-homepage-3 li button.active,
.nav-style-homepage-3 li button:hover,
.header .text-link-bd-btom,
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-menu-wrap nav .mobile-menu li:hover > a,
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a:hover,
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info a i,
.mobile-header-wrapper-style .mobile-header-wrapper-inner .mobile-header-content-area .mobile-header-info-wrap .single-mobile-header-info .lang-curr-dropdown ul li a:hover,
.mobile-account ul li:hover a,
.footer .menu-footer li a:hover,
.footer .footer-bottom strong,
.accordion-flush .accordion-button:not(.collapsed),
.card-blog-1 h3.post-title a:hover,
.box-head-single .avatar-sidebar .sidebar-website-text,
.sidebar-shadow .sidebar-heading .avatar-sidebar .sidebar-info .sidebar-website-text,
.ul-lists li a:hover,
.job-meta .company,
.text-brand-10 {
  color: var(--primary-orange) !important;
}

.dropdown .dropdown-menu.show .dropdown-item.active,
.dropdown .dropdown-menu.show .dropdown-item:active,
.btn.btn-default,
.btn-border:hover,
.btn-brand-hover:hover,
.noUi-connect,
#scrollUp,
.block-progress-status .item-progress .info-progress .progress .progress-bar,
.widget-categories li:hover span.count {
  background-color: var(--primary-orange) !important;
}

.btn.btn-default:hover,
.contact-from-area .contact-form-style button:hover,
.card-grid-4 .btn-readmore:hover {
  background-color: var(--primary-orange-hover) !important;
}

.box-button-shadow::before {
  background: var(--primary-orange) !important;
}

.paginations .pager li a.pager-number.active::before,
.paginations .pager li a.pager-number:hover::before {
  background: var(--primary-orange) !important;
}

.cb-container input:checked ~ .checkmark {
  border-color: var(--primary-orange) !important;
}

.cb-container .checkmark:after {
  background-color: var(--primary-orange) !important;
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--primary-orange) !important;
}

.slider:before {
  background-color: var(--primary-orange) !important;
}

.header .text-link-bd-btom::before {
  background: var(--primary-orange) !important;
}

/* Fix Bootstrap Checkboxes & Radios Stretched Oval Bug */
.form-check {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding-left: 0 !important;
  margin-bottom: 8px !important;
}

.form-check-input {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  min-height: 18px !important;
  max-width: 18px !important;
  max-height: 18px !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  flex-shrink: 0 !important;
  position: static !important;
  opacity: 1 !important;
  visibility: visible !important;
  border: 1px solid #cbd5e1 !important;
  border-radius: 50% !important;
  background-color: #ffffff !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.form-check-input[type="checkbox"] {
  border-radius: 4px !important;
}

.form-check-input:checked {
  background-color: var(--primary-orange) !important;
  border-color: var(--primary-orange) !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3ccircle cx='10' cy='10' r='6' fill='%23fff'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 100% !important;
}

.form-check-label {
  font-size: 14px !important;
  color: var(--text-dark) !important;
  cursor: pointer !important;
  user-select: none !important;
  margin-bottom: 0 !important;
  line-height: 1 !important;
}

/* Footer Uniform Color and Background override */
footer.footer {
  background-color: #ffffff !important;
  position: relative;
  z-index: 10;
}

/* Typography Formatting Reset for Rich Text Content */
.content-single, .rich-text-content {
  line-height: 1.8;
  color: #334155;
}
.content-single em, .content-single i, .rich-text-content em, .rich-text-content i {
  font-style: italic !important;
}
.content-single strong, .content-single b, .rich-text-content strong, .rich-text-content b {
  font-weight: 700 !important;
  color: #0f172a;
}
.content-single u, .rich-text-content u {
  text-decoration: underline !important;
}
.content-single s, .content-single strike, .rich-text-content s, .rich-text-content strike {
  text-decoration: line-through !important;
}
.content-single ul, .rich-text-content ul {
  list-style-type: disc !important;
  padding-left: 24px !important;
  margin-bottom: 16px !important;
}
.content-single ol, .rich-text-content ol {
  list-style-type: decimal !important;
  padding-left: 24px !important;
  margin-bottom: 16px !important;
}
.content-single li, .rich-text-content li {
  display: list-item !important;
  margin-bottom: 6px !important;
}
.content-single p, .rich-text-content p {
  margin-bottom: 14px;
}

/* Fix User Dropdown Position & Z-Index */
#frontUserDropdown {
  position: relative !important;
  z-index: 1050 !important;
}

#frontUserDropdown .dropdown-menu {
  z-index: 99999 !important;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1) !important;
  border-radius: 12px !important;
  padding: 8px 0 !important;
  min-width: 180px !important;
}

#frontUserDropdown .dropdown-item {
  padding: 8px 16px !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

#frontUserDropdown .dropdown-item:hover {
  background-color: #fff7ed !important;
  color: var(--primary-orange) !important;
}

/* Custom Hamburger Icon */
.burger-icon > span::before,
.burger-icon > span::after {
  background-color: #0f172a !important;
  border-radius: 2px !important;
  height: 2.5px !important;
  transition: all 0.25s ease !important;
}

.burger-icon:hover > span::before,
.burger-icon:hover > span::after {
  background-color: var(--primary-orange) !important;
}

/* Fix Job Fair Company Logo Container - Round Fit Circle without Blue Border */
.card-grid-2 .card-block-info .card-grid-2-img-medium .card-grid-2-img-small,
.card-grid-2 .card-block-info .card-2-img-text .card-grid-2-img-small,
.card-grid-2-img-small {
  background-color: transparent !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.card-grid-2-img-small img {
  border-radius: 50% !important;
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
}

/* Landing Page Hero Carousel Styles */
.hero-slideshow-container {
  width: 100%;
  height: auto;
  background-color: #0f172a;
}
.carousel-control-prev, .carousel-control-next {
  width: 5%;
}
.carousel-indicators [data-bs-target] {
  background-color: #ffffff;
  border-radius: 50%;
  width: 10px;
  height: 10px;
}
.carousel-item {
  position: relative;
  display: none;
  float: left;
  width: 100%;
  margin-right: -100%;
  backface-visibility: hidden;
  transition: transform 0.6s ease-in-out !important;
}
.carousel-item.active,
.carousel-item-next,
.carousel-item-prev {
  display: block;
}
.carousel-item-next:not(.carousel-item-start),
.active.carousel-item-end {
  transform: translateX(100%);
}
.carousel-item-prev:not(.carousel-item-end),
.active.carousel-item-start {
  transform: translateX(-100%);
}
.carousel-item-next.carousel-item-start,
.carousel-item-prev.carousel-item-end {
  transform: translateX(0);
}

/* Responsive Flex Order Utilities */
.order-1 { order: 1 !important; }
.order-2 { order: 2 !important; }
.order-3 { order: 3 !important; }
.order-first { order: -1 !important; }
.order-last { order: 6 !important; }

@media (min-width: 992px) {
  .order-lg-1 { order: 1 !important; }
  .order-lg-2 { order: 2 !important; }
  .order-lg-3 { order: 3 !important; }
  .order-lg-first { order: -1 !important; }
  .order-lg-last { order: 6 !important; }
}

/* Frontpages Berita & Iklan Sidebar Responsive */
@media (max-width: 991.98px) {
  .front-sidebar-col {
    padding-left: 12px !important;
    padding-right: 12px !important;
    margin-bottom: 25px !important;
  }
  .front-sidebar-col .sidebar-shadow {
    padding: 20px 18px !important;
    margin-bottom: 25px !important;
  }
  .front-sidebar-col .widget_search {
    margin-bottom: 25px !important;
  }
}
@media (min-width: 992px) {
  .front-sidebar-col {
    padding-left: 40px !important;
  }
}