/* Version 4.5 mobile Case Search */
.case-search-heading{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:18px;
    margin-bottom:18px;
}
.case-search-heading h1{margin-bottom:8px}
.case-search-heading p{margin:0;color:var(--muted);max-width:760px}
.case-search-heading-actions{display:flex;gap:9px;flex-wrap:wrap}
.case-search-panel{margin-bottom:16px}
.case-search-input-wrap{position:relative}
.case-search-magnifier{position:absolute;left:16px;top:50%;width:17px;height:17px;border:2px solid #526174;border-radius:50%;transform:translateY(-58%);pointer-events:none}
.case-search-magnifier::after{content:'';position:absolute;right:-5px;bottom:-4px;width:7px;height:2px;border-radius:2px;background:#526174;transform:rotate(45deg)}
.case-search-input-wrap input{padding-left:47px}
.case-search-label{display:none}
.case-search-submit{margin-top:10px}
.advanced-filters{margin-top:16px;border:1px solid var(--border);border-radius:12px;background:#fff;overflow:hidden;padding:0}
.advanced-filters summary{padding:16px 18px;color:var(--text);font-size:1.05rem;list-style:none;border-bottom:1px solid transparent}
.advanced-filters summary::-webkit-details-marker{display:none}
.advanced-filters summary::after{content:'+';float:right;color:var(--primary);font-size:1.3rem}
.advanced-filters[open] summary{border-bottom-color:var(--border)}
.advanced-filters[open] summary::after{content:'−'}
.advanced-filters-content{padding:16px 18px 18px}
.filter-field{margin:0}
.filter-check-option{display:flex;align-items:flex-start;gap:10px;margin:0;padding:11px 12px;border:1px solid #dce3eb;border-radius:9px;background:#fbfcfe;font-weight:700;cursor:pointer}
.filter-check-option input{width:20px;height:20px;min-width:20px;margin:1px 0 0;accent-color:var(--primary)}
.filter-check-option span{line-height:1.35}
.case-filter-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.case-results-card{margin-top:0}
.case-empty-state{min-height:270px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.case-empty-icon{position:relative;display:flex;align-items:center;justify-content:center;width:70px;height:70px;margin-bottom:22px;border:5px solid #7b9bb8;border-radius:50%;background:#e9f5ff;color:#6b94b7;font-size:2.5rem;font-weight:800;box-shadow:inset 0 0 0 3px #c8deef}
.case-empty-icon::after{content:'';position:absolute;right:-23px;bottom:-16px;width:35px;height:8px;border-radius:999px;background:#718296;transform:rotate(45deg);transform-origin:left center}

@media(min-width:701px){
    .case-search-main{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
    .case-search-input-wrap{grid-column:1}
    .case-search-submit{grid-column:2;margin-top:0}
}

@media(max-width:700px){
    .case-search-heading{display:block;margin:32px 0 18px}
    .case-search-heading h1{font-size:2rem;margin-bottom:12px}
    .case-search-heading p{font-size:1rem;line-height:1.55;color:#283546}
    .case-search-heading-actions{display:none}

    .case-view-tabs{gap:8px;margin:0 0 16px;padding:0;overflow:visible}
    .case-view-tabs a{flex:1 1 auto;text-align:center;padding:11px 12px;border-radius:999px;box-shadow:0 4px 12px rgba(15,23,42,.06)}

    .case-search-panel{margin-bottom:16px}
    .case-filter-form{gap:0}
    .case-search-main{display:block}
    .case-search-label{display:none}
    .case-search-input-wrap input{height:54px;padding-left:47px!important;border-radius:9px;font-size:16px!important}
    .case-search-submit{width:100%;height:52px;margin-top:10px;border-radius:8px;background:linear-gradient(180deg,#2178f3 0%,#1265e5 100%);box-shadow:0 8px 18px rgba(18,101,229,.2)}

    .advanced-filters{margin-top:18px;border-radius:12px;box-shadow:0 4px 14px rgba(15,23,42,.05)}
    .advanced-filters summary{padding:17px 14px;font-size:1.15rem}
    .advanced-filters-content{padding:18px 12px 14px}

    .filter-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px 10px!important;margin-top:0!important}
    .filter-status,.filter-case-type,.filter-priority{grid-column:1/-1}
    .filter-officer{grid-column:1}
    .filter-results{grid-column:2}
    .filter-date-from{grid-column:1}
    .filter-date-to{grid-column:2}
    .filter-field label{margin-bottom:7px;font-size:.95rem}
    .filter-field select,.filter-field input{height:49px;padding:10px 12px!important;border-radius:9px;font-size:16px!important}

    .filter-checks{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important;margin:18px 0 0!important}
    .filter-check-option{display:grid!important;grid-template-columns:22px minmax(0,1fr)!important;gap:9px!important;align-items:start!important;min-height:62px;padding:12px!important;background:#fff!important}
    .filter-check-option:first-child{grid-column:1/-1}
    .filter-check-option input{width:21px!important;height:21px!important;margin:0!important}
    .filter-check-option span{font-size:.94rem;font-weight:700}

    .case-filter-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
    .case-filter-actions button,.case-filter-actions .button{width:100%;min-height:50px;margin:0}

    .case-results-card{padding:14px!important;border-radius:12px}
    .case-results-heading h2{font-size:1.7rem}
    .case-results-heading p{margin:4px 0 0}
    .case-empty-state{min-height:360px;padding:32px 12px!important}
    .case-empty-state h3{font-size:1.15rem;margin:0 0 8px}

    .case-summary-card{padding:16px!important;border-radius:14px!important;box-shadow:0 5px 15px rgba(15,23,42,.05)}
    .case-summary-card h3{font-size:1.22rem!important}
    .case-summary-number{font-size:.9rem!important}
    .case-summary-state{display:grid!important;grid-template-columns:auto auto minmax(0,1fr)!important;align-items:center!important;gap:8px!important;width:100%}
    .case-summary-state .small{justify-self:end}
}

@media(max-width:390px){
    .case-view-tabs{display:grid;grid-template-columns:1fr}
    .filter-grid{grid-template-columns:1fr!important}
    .filter-status,.filter-case-type,.filter-priority,.filter-officer,.filter-results,.filter-date-from,.filter-date-to{grid-column:1!important}
    .filter-checks{grid-template-columns:1fr!important}
    .filter-check-option:first-child{grid-column:1}
    .case-filter-actions{grid-template-columns:1fr}
}


/* Version 4.6 - reliable iPhone date controls */
.case-date-control{
    position:relative;
    display:block;
    width:100%;
    height:49px;
    min-height:49px;
    border:1px solid #b8c0ca;
    border-radius:9px;
    background:#fff;
    overflow:hidden;
}

.case-date-input{
    position:relative;
    z-index:2;
    display:block;
    width:100%!important;
    height:47px!important;
    min-height:47px!important;
    max-height:47px!important;
    margin:0!important;
    padding:10px 44px 10px 12px!important;
    border:0!important;
    border-radius:8px!important;
    background:transparent!important;
    color:var(--text)!important;
    font-size:16px!important;
    line-height:27px!important;
    box-shadow:none!important;
    -webkit-appearance:none!important;
    appearance:none!important;
}

.case-date-input:focus{
    outline:none!important;
}

.case-date-control:focus-within{
    border-color:var(--primary);
    box-shadow:0 0 0 3px rgba(11,77,122,.16);
}

.case-date-placeholder{
    position:absolute;
    z-index:1;
    left:12px;
    top:50%;
    transform:translateY(-50%);
    color:#667085;
    font-size:16px;
    line-height:1;
    pointer-events:none;
}

.case-date-control.has-value .case-date-placeholder,
.case-date-control:focus-within .case-date-placeholder{
    opacity:0;
}

.case-date-icon{
    position:absolute;
    z-index:3;
    right:13px;
    top:50%;
    width:18px;
    height:17px;
    transform:translateY(-50%);
    border:2px solid #344054;
    border-radius:3px;
    pointer-events:none;
}

.case-date-icon::before{
    content:'';
    position:absolute;
    left:-2px;
    right:-2px;
    top:3px;
    border-top:2px solid #344054;
}

.case-date-icon::after{
    content:'';
    position:absolute;
    left:3px;
    top:-5px;
    width:8px;
    height:5px;
    border-left:2px solid #344054;
    border-right:2px solid #344054;
}

/* Hide Safari/Chrome's native calendar indicator; the input remains clickable. */
.case-date-input::-webkit-calendar-picker-indicator{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    opacity:0;
    cursor:pointer;
}

.case-date-input::-webkit-date-and-time-value{
    min-height:27px;
    text-align:left;
}

@media(max-width:700px){
    .filter-date-from,
    .filter-date-to{
        min-width:0!important;
    }

    .case-date-control{
        width:100%!important;
        height:50px!important;
        min-height:50px!important;
    }

    .case-date-input{
        height:48px!important;
        min-height:48px!important;
        max-height:48px!important;
    }
}

@media(max-width:430px){
    .filter-date-from,
    .filter-date-to{
        grid-column:1 / -1!important;
    }
}


/* Version 4.9 - desktop date input correction
   The custom mm/dd/yyyy overlay is only needed for mobile Safari.
   Desktop browsers already render their own date hint, so showing both
   creates duplicated text. */
@media (min-width: 701px){
    .case-date-placeholder{
        display:none !important;
    }

    .case-date-control.has-value .case-date-placeholder,
    .case-date-control:focus-within .case-date-placeholder{
        display:none !important;
    }
}


/* DAV Communication Portal v6.0.3 — Officer attention filter */
.case-attention-filter-banner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin:0 0 16px;
    padding:14px 16px;
    border:1px solid #a9cce3;
    border-left:5px solid #0b5790;
    border-radius:12px;
    background:#eef7fd;
    color:#27465d;
}

.case-attention-filter-banner strong,
.case-attention-filter-banner span{
    display:block;
}

.case-attention-filter-banner strong{
    margin-bottom:3px;
    color:#123d5b;
}

.case-attention-filter-banner span{
    font-size:.9rem;
    line-height:1.4;
}

.case-attention-filter-banner .button{
    flex:0 0 auto;
    margin:0;
    white-space:nowrap;
}

@media(max-width:700px){
    .case-attention-filter-banner{
        display:block;
    }

    .case-attention-filter-banner .button{
        width:100%;
        margin-top:12px;
    }
}