#Dailyform{position:relative;overflow-y:auto;height:100svh}
.Daily_titlemobile{display:none}
#Daily_title{position:relative;margin-top: 9svh;   height:7vh;left:50%;transform:translateX(-50%);z-index:110;opacity:1}
#DailyTitleHp{display:none;opacity:0}
#DailyTitleDesk{display:none;position:relative;top:10vh;height:10vh;left:50%;transform:translateX(-50%);z-index:110;opacity:1}
#Daily-container{height:auto;margin-top: 16px;margin-bottom: 70px; background-color:#fff;border-radius:15px;box-shadow:0 4px 6px rgba(0,0,0,.1);padding:20px;border:4px solid #026e46;position:relative;width:47dvw;left:50%;transform:translateX(-50%);z-index:110;opacity:1}
#registrationDaily{position:relative;height:auto;padding-left:10svh;padding-right:10svh}
#registrationDaily input,#registrationDaily select{position:relative;background:0 0;width:100%;margin-bottom:15px;padding-top:8px;padding-left: 3px;padding-bottom: 3px; border:none;border-bottom:2px solid #026e46;transition:border-color .3s ease;text-align:left;color:black;font-size: 13px;}
#registrationDaily input[type=radio]{border-bottom:none!important}
#registrationDaily input::placeholder  {opacity:1;text-transform:capitalize;font-size:13px;padding-top: 10px;}
#registrationDaily select  {opacity:1;text-transform:capitalize;font-size: 12.9px;}
#select_retailer select::placeholder{height: 190px;}
#select_retailer_container{height: auto;}
#descForm{color: #727373}
#Dailyform #textMax2MB{position: relative;top:5px; justify-self:left!important;font-size:14px!important;color:#000!important}
#checkboxDaily{font-size:13.2px}
#checkboxDaily input{justify-self:left;width:20px;height:20px;border-radius:50%;border:2px solid #000;appearance:none;outline:0;cursor:pointer;vertical-align:middle}
#checkboxDaily input:checked{background-color:#727373;border-color:#727373}
.center-container{display:flex;align-items:center}
.custom-file-input{position:relative}
.fileinput{position:absolute;opacity:0;z-index:-1;display:none}
.desktop-upload{display:block;cursor:pointer;width:100%}
.image-preview-container{margin-top:20px}
.image-preview{max-width:50%;max-height:100px;position:relative;transform:translateX(-50%);left:50%}
.submit-container{position:relative;top:-10px;text-align:center}
.submit-button{background:0 0;border:none;cursor:pointer}
.submit-image{width:100%}
#Daily_Terms{display:block;position:relative;text-align:center;top:5dvh;height:10vh;left:50%;transform:translateX(-50%);z-index:111;opacity:1;color:#000}
#Daily_Termsmobile{display:none}
#Dailyform #checkboxDaily{font-size:10px!important;color:#000!important}
#Dailyform #checkboxDaily input{justify-self:left!important;width:20px!important;height:20px!important;border-radius:50%!important;border:2px solid #000!important;appearance:none!important;outline:0!important;background-color:#fff!important;cursor:pointer!important;vertical-align:middle!important;color:#000!important}
#Dailyform #checkboxDaily input:checked{background-color:#727373!important;border-color:#727373!important}
.colored{color:black;font-size:13px;}


#Dailyform #checkboxDaily label{font-size:12px!important;color:#000!important;position:relative;top:-5px;left: 3px;}
.radio-container{display:flex;flex-direction:row;gap:90px;left:2vh;position:relative}
.radio-item{display:flex;align-items:center;gap:5px;width:30%}
.radio-item input{width:30px;height:30px;border-radius:50%;border:10px solid #000;appearance:none;outline:1;background-color:#000;cursor:pointer;position:relative;margin-right:10px;vertical-align:middle}
.radio-item input::before{content:'';position:absolute;top:70%;left:90%;border:3px solid #000;transform:translate(-50%,-50%);width:15px;height:15px;border-radius:50%;background-color:transparent;transition:background-color .3s ease}
.radio-item input:checked::before{background-color:#727373}
.radio-item label{font-size:14px;color:#727373;margin-left:5px}
#multiple-item{position:relative;top:.5svh;display:flex;justify-self:left;gap:1px;flex-direction:row}
#multiple-item label{font-size:14px;color:#727373;position:relative;top:-7px ;align-self: center;place-items: center;} 
#multiple-item input{width:20px;height:20px;border-radius:3%;border:2px solid #727373;appearance:none;outline:0;background-color:#fff;cursor:pointer;margin-right:10px;vertical-align:middle}
#multiple-item input:checked{background-color:#727373;border-color:#727373}
#Dailyform label{color:black;font-size:13px}


.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,.6);z-index:9999;display:flex;justify-content:center;align-items:center}
.loader {
    border: 8px solid #f3f3f3;
    border-top: 8px solid #1ec788;
    border-radius: 50%;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    display: flex;
    justify-content: center;
    align-items: center;
}

@keyframes spin {
    0% {
        transform: translate(-50%, -50%) rotate(0);
    }
    100% {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}
#registrationDaily input::placeholder{font-size:12.1px}
#Dailyform input::placeholder{font-size:12.1px}
#upload-imageHp{display:none}
#upload-imageDesk{display:block;width:100%;left:50%;transform:translateX(-50%);object-fit:contain;position:relative}
.submit-imageHp{display:none}
.submit-imageDesk{display:block;object-fit:contain;position:relative;width:100%;left:50%;transform:translateX(-50%)}

#select_retailer {
    width: 100%; /* Full width */
    /* padding: 8px; Add padding for better spacing */
    box-sizing: border-box; /* Include padding and border in the width */
    font-size: 14px; /* Ensure readable font size */
    height: auto; /* Allow height to adjust based on content */
    background-color: #fff; /* Ensure background is visible */
    border: 2px solid #026e46; /* Match other input styles */
    border-radius: 4px; /* Add slight rounding for aesthetics */
    appearance: none; /* Remove default browser styles */
}

#select_retailer option {
    white-space: nowrap; /* Prevent text wrapping */
    overflow: hidden; /* Hide overflowing text */
    text-overflow: ellipsis; /* Add ellipsis for long text */
}

label{cursor:pointer}

#registrationDaily input::placeholder,
#Dailyform input::placeholder {
    font-size: 13.1px;
    color: #727373; /* Updated placeholder color */
    opacity: 1;
    padding-left: 0;
}

#registrationDaily input::-webkit-input-placeholder,
#Dailyform input::-webkit-input-placeholder {
    color: #727373; /* Updated placeholder color for Safari */
    opacity: 1;
}

#registrationDaily input:-moz-placeholder,
#Dailyform input:-moz-placeholder {
    color: #727373; /* Updated placeholder color for Firefox */
    opacity: 1;
}

#registrationDaily input::-moz-placeholder,
#Dailyform input::-moz-placeholder {
    color: #727373; /* Updated placeholder color for Firefox */
    opacity: 1;
}

#registrationDaily input:-ms-input-placeholder,
#Dailyform input:-ms-input-placeholder {
    color: #727373; /* Updated placeholder color for IE */
    opacity: 1;
}

.radio-item input:disabled {
    background-color: #e0e0e0; /* Warna abu-abu untuk menunjukkan disabled */
    cursor: not-allowed;
    border-color: #ccc;
}

.radio-item label:disabled {
    color: #ccc; /* Warna teks untuk menunjukkan disabled */
}

@media print,screen and (max-width:40em){
#Dailyform{height:100svh;overflow-y:scroll;width:100svw}
#Daily_title{margin-top:5vh;height:8vh;font-size:6px;display:none;}
#Daily-container{width:90%;margin-top:3svh;padding:10px;position: relative}
.Daily_titlemobile{display:block;margin-top:12svh;width:77svw;left:50%;transform:translateX(-50%);object-fit:contain;position:relative}
#registrationDaily{padding-left:2%;padding-right:2%}
#registrationDaily input,#registrationDaily select{font-size:13px;padding:3px}
#registrationDaily input::placeholder{font-size:13px!important}
.Daily_titlemobile{display:block}
#DailyTitleDesk{display:none}
.image-preview{max-width:80%;max-height:80px}
.radio-container{flex-direction:row;gap:10px}
.radio-item input{width:20px;height:20px}
.radio-item label{font-size:small;        position: relative;
    top: -3.5px;}
#multiple-item{flex-direction:row;gap:5px}
#multiple-item label{font-size:small}
#Daily_Terms{font-size:14px;top:2dvh}
.submit-container{top:0}
.submit-button{font-size:small}
#checkboxDaily label{font-size:9px!important;color:#727373!important}

#upload-imageDesk{display:none}
#upload-imageHp{display:block;object-fit:contain;position:relative;width:100%;left:50%;transform:translateX(-50%)}
.submit-imageDesk{display:none}
.submit-imageHp{display:block;object-fit:contain;position:relative;width:60svw;left:50%;transform:translateX(-50%)}

}