/* =============================================
   OMMMS MASTER STYLESHEET v2.0
   Organized by component with color variables
============================================= */

/* ==================== */
/*  ROOT COLOR SYSTEM   */
/* ==================== */
:root {
    /* CORE BRAND COLORS */
    --clr-brand-red:     #981e21;  /* Primary brand red */
    --clr-brand-gold:    #fff1a6;  /* Accent gold text */
    --clr-brand-yellow:  #fffadc;  /* Pale yellow backgrounds */

    /* FORM COLORS */
    --clr-form-bg:       var(--clr-brand-yellow);
    --clr-form-focus:    #f0ffe0;  /* Pale green focus state */
    --clr-form-border:   #d1d1d1;  /* Neutral borders */
    --clr-form-disabled: #f5f5f5;  /* Light gray disabled */
    
    /* TEXT COLORS */
    --clr-text-dark:     #333333;
    --clr-text-muted:    #999999;
    --clr-text-silver:   #c0c0c0;
}

/* ==================== */
/*  BASE FORM ELEMENTS  */
/* ==================== */
input[type="text"],
input[type="number"],
input[type="date"],
input[type="time"],
textarea,
select,
.form-control,
.form-select {
    background:    var(--clr-form-bg)    !important;
    border:        1px solid var(--clr-form-border) !important;
    color:         var(--clr-text-dark)  !important;
    padding:       0.5rem 0.75rem       !important;
    transition:    background 0.3s ease  !important;
}

/* Focus states - no border color change */
input[type="text"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus,
.form-control:focus,
.form-select:focus {
    background:    var(--clr-form-focus) !important;
    border-color:  var(--clr-form-border) !important; /* No color change */
    box-shadow:    none                 !important;
    outline:       none                 !important;
}

/* Disabled states */
input:disabled,
textarea:disabled,
select:disabled,
.form-control:disabled {
    background:    var(--clr-form-disabled) !important;
    color:         var(--clr-text-muted)   !important;
    cursor:        not-allowed            !important;
}

/* ==================== */
/*  TEXTAREA SPECIFICS  */
/* ==================== */
textarea.form-control {
    min-height:    8rem                  !important;
    line-height:   1.5                   !important;
}

/* ==================== */
/*  SELECT DROPDOWNS    */
/* ==================== */
.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='%23981e21' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e") !important;
    background-position: right 0.75rem center !important;
}

/* ==================== */
/*  CHECKBOXES/RADIOS   */
/* ==================== */
.form-check-input {
    border:        1px solid var(--clr-brand-red) !important;
    width:        1.2em                         !important;
    height:       1.2em                         !important;
    margin-top:   0.1em                         !important;
}

.form-check-input:checked {
    background:   var(--clr-brand-red)          !important;
    border-color: var(--clr-brand-red)          !important;
}

/* ==================== */
/*  FILE UPLOAD INPUTS  */
/* ==================== */
input[type="file"] {
    padding:      0.5rem 0.75rem !important;
}

input[type="file"]::file-selector-button {
    background:   var(--clr-brand-red)          !important;
    color:        var(--clr-brand-gold)         !important;
    border:       none                         !important;
    padding:      0.375rem 0.75rem             !important;
    margin-right: 0.75rem                      !important;
    border-radius: 0.25rem                     !important;
    transition:   background 0.2s ease         !important;
}

/* ==================== */
/*  ACCORDION STYLES    */
/* ==================== */
.accordion-button {
    color:        var(--clr-text-silver)       !important;
    background:   rgba(192, 192, 192, 0.35)   !important;
    padding:      0.75rem 1.25rem             !important;
    transition:   all 0.3s ease               !important;
}

.accordion-button:not(.collapsed) {
    color:        var(--clr-brand-gold)        !important;
    background:   var(--clr-brand-red)         !important;
}

.accordion-button:hover {
    color:        #a3a3a3                      !important;
    background:   rgba(192, 192, 192, 0.5)    !important;
}

/* ==================== */
/*  MODAL STYLES        */
/* ==================== */
.modal-content {
    border:       4px solid var(--clr-brand-red) !important;
    box-shadow:   0 0 20px rgba(0,0,0,0.3)     !important;
}

.modal-backdrop {
    background:   linear-gradient(
                    rgba(152, 30, 33, 0.2),
                    rgba(0, 0, 0, 0.7)
                 ) !important;
    backdrop-filter: blur(2px)                 !important;
    opacity:      .5                           !important;
}

/* ==================== */
/*  BUTTON STYLES       */
/* ==================== */
.btn-primary {
    background:   var(--clr-brand-red)         !important;
    color:        var(--clr-brand-gold)        !important;
    border:       none                        !important;
    padding:      0.5rem 1.25rem              !important;
    transition:   all 0.2s ease               !important;
}

.btn-primary:hover {
    background:   #7a181a                     !important;
    transform:    translateY(-1px)            !important;
}


/* COMPLETE CHEVRON REMOVAL SOLUTION */
select.form-select,
#isACCESS, #isACTIVITY, #isCATEGORY, #isFLOW, 
#isPACE, #isPHASE, #isSTYLE, #isTYPE {
    /* 1. Remove the SVG background image */
    background-image: none !important;
    
    /* 2. Remove browser default styling */
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    
    /* 3. Remove IE/Edge dropdown arrow */
    &::-ms-expand {
        display: none !important;
    }
    
    /* 4. Ensure proper padding without arrow space */
    padding-right: 0.75rem !important;
    
    /* 5. Prevent any image repetition */
    background-repeat: no-repeat !important;
    background-size: 0 !important;
}

/* Disabled state overrides */
select.form-select:disabled,
#isACCESS:disabled, #isACTIVITY:disabled, #isCATEGORY:disabled, #isFLOW:disabled,
#isPACE:disabled, #isPHASE:disabled, #isSTYLE:disabled, #isTYPE:disabled {
    background-image: none !important;
}