/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 10 2026 | 01:54:10 */
/* Add your CSS code here.

For example:
.example {
    color: red;
}

For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp

End of comment */ 

.awsm-job-container {
    /* 1. Menghilangkan margin otomatis kiri dan kanan */
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0 !important; /* opsional, sesuaikan jika perlu */
    margin-bottom: 0 !important;

    /* 2. Memaksa lebar container memenuhi layar agar padding bekerja penuh */
    width: 100% !important;
    max-width: 100% !important;

    /* 3. Padding 90px kiri-kanan sesuai keinginanmu */
/*     padding-left: 90px !important; */
/*     padding-right: 90px !important; */
	padding-top: 90px;
    
    /* Memastikan padding tidak membuat halaman jebol/halaman scroll ke samping */
    box-sizing: border-box !important; 
}

/* @media screen and (max-width: 764px) {
    .single-awsm_job_openings .awsm-job-container {
        padding-left: 0 !important;
		padding-right: 0 !important;
    }
} */

.page-header h1.entry-title{
	font-family: Poppins !important;
	color: #33cc99 !important;
	margin-top: 80px;
}

h1.entry-title {
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 90px !important;
}

.elementor-widget-text-editor,
.elementor-widget-text-editor * {
    font-family: 'Poppins', sans-serif !important;
}

.awsm-job-form{
	padding-right: 90px;
	padding-left: 90px !important;
}

/* .awsm-job-specifications-row .awsm-job-specification-wrapper {
	padding: 0 90px !important;
} */

/* margin content */
.page-content .awsm-job-single-wrap.awsm-col-2 {
	margin-bottom: 150px !important;
}

@media screen and (max-width: 764px) {
	.awsm-job-form{
		padding-right: 20px;
		padding-left: 20px !important;
	}
	
	h1.entry-title {
		margin-top: 20px !important;
		padding-left: 20px !important;
}
	.awsm-job-specifications-row .awsm-job-specification-wrapper {
		padding-left: 20px !important;
		padding-right: 20px !important;
}

}

/* 1. Memastikan Font Seluruh Form Menggunakan Poppins */
.awsm-job-form-inner,
.awsm-job-form-inner h2,
.awsm-job-form-inner label,
.awsm-job-form-control,
.awsm-application-submit-btn {
    font-family: 'Poppins', sans-serif !important;
	color: white;
}

/* 2. Styling Card Wrapper / Container Form */
.awsm-job-form-inner {
    background-color: #3a3a3a; /* Warna latar sedikit lebih terang dari background utama */
    padding: 30px;
    border-radius: 12px; /* Membuat sudut card tidak tajam */
    border: 1px solid #555555; /* Border tipis pembatas card */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15); /* Efek bayangan modern */
}

/* 3. Styling Label Input */
.awsm-job-form-group label {
    font-size: 14px;
    font-weight: 500;
    color: #e0e0e0;
    margin-bottom: 8px;
    display: block;
}

/* 4. Styling Kolom Input & Textarea */
.awsm-job-form-control {
    width: 100%;
    padding: 12px 16px;
    background-color: #252525 !important; /* Warna gelap untuk dalam input */
    border: 1px solid #555555 !important; /* Border default */
    border-radius: 8px !important; /* Membuat sudut input membulat (tidak tajam) */
    color: #ffffff !important;
    font-size: 14px;
    transition: all 0.3s ease; /* Transisi halus saat di-hover/klik */
}

/* 5. Efek Hover & Focus pada Kolom Input (Aksen Hijau) */
.awsm-job-form-control:hover,
.awsm-job-form-control:focus {
    border-color: #20c997 !important; /* Ganti kode hex ini dengan hijau aksen tema kamu */
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(32, 201, 151, 0.15) !important; /* Efek glow hijau tipis di luar border */
}

/* 6. Merapikan Posisi Checkbox Privacy Policy */
.awsm-job-inline-group {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 15px;
}
.awsm-job-inline-group input[type="checkbox"] {
    margin-top: 4px;
    accent-color: #20c997; /* Warna checkbox saat dicentang */
}
.awsm-job-inline-group label {
    font-size: 12px;
    font-weight: 400;
    line-height: 1.6;
}

/* 7. Styling Tombol Submit */
.awsm-application-submit-btn {
    background-color: #20c997 !important; /* Warna hijau aksen */
    color: #ffffff !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    padding: 12px 24px !important;
    border: none !important;
    border-radius: 8px !important; /* Sudut tombol membulat */
    cursor: pointer;
    transition: all 0.3s ease;
    margin-top: 15px;
}

/* Efek Hover pada Tombol Submit */
.awsm-application-submit-btn:hover {
    background-color: #1aa179 !important; /* Warna hijau yang lebih gelap saat di-hover */
    transform: translateY(-2px); /* Tombol sedikit terangkat */
}


/* ========================================================
   1. SETTING BACKGROUND HALAMAN
======================================================== */
/* Mengubah background body dan memastikan teks default berwarna terang */
body.single-awsm_job_openings {
    background-color: #000000 !important; /* Sesuaikan warna gelapnya, misal: #121212 atau #1a1a1a */
	color: #FCFBF4BD !important;
	padding-top: 100px !important;
}

/* Memaksa wrapper bawaan tema agar transparan dan tidak menutupi background gelap */
body.single-awsm_job_openings #page,
body.single-awsm_job_openings #content,
body.single-awsm_job_openings .site-content {
    background-color: transparent !important;
}

@media screen and (max-width: 768px){
	body.single-awsm_job_openings {
	padding-top: 150px;
}
}

/* ========================================================
   2. SETTING PADDING CONTAINER (DESKTOP)
======================================================== */
/* Menargetkan pembungkus konten AWSM dan Container Elementor */

/* .single-awsm_job_openings main .e-con,
.single-awsm_job_openings .site-content .e-con,
.single-awsm_job_openings #content .e-con, */
.awsm-job-content{
    padding-left: 90px !important;
    padding-right: 90px !important;
}

/* ========================================================
   3. SETTING PADDING CONTAINER (MOBILE & TABLET)
======================================================== */
@media screen and (max-width: 768px) {
/*     .single-awsm_job_openings .e-con,
	.single-awsm_job_openings .site-content .e-con,
	.single-awsm_job_openings #content .e-con, */
	.awsm-job-content{
        padding-left: 20px !important;
        padding-right: 20px !important;
    }
}


/* ==========================
		CAREER PAGE
=============================*/


/* Load More */
.awsm-load-more.awsm-load-more-btn {
	background-color: #3a3a3a !important;
	color: #fcfbf4 !important;
	border-radius: 20px !important;
	font-family: poppins !important;
	border-color: #3a3a3a !important;
	transition: transform 0.3s ease, box-shadow 0.5s ease, scale 0.3s ease;
}

.awsm-load-more.awsm-load-more-btn:hover{
/* 		border-color: #fcfbf4 !important; */
		transform: translateY(-5px);
		scale: 1.01 !important;
	 	box-shadow: 0 0 15px rgba(51, 204, 153, 0.7), 
              0 0 30px rgba(51, 204, 153, 0.4), 
              0 0 45px rgba(51, 204, 153, 0.2) !important;
}

.awsm-job-listing-item.awsm-grid-item .awsm-job-item{
		transition: transform 0.3s ease, box-shadow 0.5s ease, scale 0.3s ease;
}

.awsm-job-listing-item.awsm-grid-item .awsm-job-item:hover {
		transform: translateY(-5px);
		scale: 1.01 !important;
	 	box-shadow: 0 0 15px rgba(51, 204, 153, 0.7), 
              0 0 30px rgba(51, 204, 153, 0.4), 
              0 0 45px rgba(51, 204, 153, 0.2) !important;
}