/*
 * custom-style-theme.css — PrimeFaces Custom Style Dark Orange Theme
 * Fuente: tema orange dark personalizado
 * Reemplaza al tema arya. web.xml: primefaces.THEME=none
 */

:root {
    --surface-a: #293241;
    --surface-b: #3E4754;
    --surface-c: rgba(255, 168, 88, 0.2);
    --surface-d: #545B67;
    --surface-e: #293241;
    --surface-f: #293241;
    --text-color: #EAEBEC;
    --text-color-secondary: #BFC2C6;
    --primary-color: #FFA858;
    --primary-light-color: #FFC591;
    --primary-lighter-color: rgba(255, 197, 145, 0.1);
    --primary-dark-color: #FF810E;
    --primary-darker-color: #F17606;
    --primary-color-text: #3E4754;
    --font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
    --surface-0: #293241;
    --surface-50: #3e4754;
    --surface-100: #545b67;
    --surface-200: #69707a;
    --surface-300: #7f848d;
    --surface-400: #9499a0;
    --surface-500: #a9adb3;
    --surface-600: #bfc2c6;
    --surface-700: #d4d6d9;
    --surface-800: #eaebec;
    --surface-900: #ffffff;
    --gray-50: #eaebec;
    --gray-100: #d4d6d9;
    --gray-200: #d4d6d9;
    --gray-300: #bfc2c6;
    --gray-400: #a9adb3;
    --gray-500: #7f848d;
    --gray-600: #69707a;
    --gray-700: #545b67;
    --gray-800: #3e4754;
    --gray-900: #293241;
    --content-padding: 1rem;
    --inline-spacing: 0.5rem;
    --border-radius: 6px;
    --surface-ground: #3E4754;
    --surface-section: #3E4754;
    --surface-card: #293241;
    --surface-overlay: #293241;
    --surface-border: #383838;
    --surface-hover: rgba(255,255,255,.03);
    --maskbg: rgba(0, 0, 0, 0.4);
    --focus-ring: 0 0 0 1px #FFC591;
    color-scheme: dark
}

* { box-sizing: border-box }

body .ui-widget {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
    font-size: 1rem;
    text-decoration: none
}

body .ui-icon {
    font-size: 1rem;
    display: inline-block;
    vertical-align: baseline;
    margin: 0;
    position: static;
    text-indent: 0;
    overflow: visible;
    background-repeat: no-repeat
}

body .pi { font-size: 1rem }

body .ui-widget-overlay {
    -webkit-animation-name: modal-in;
    animation-name: modal-in;
    animation-duration: .2s;
    animation-timing-function: cubic-bezier(0.05, 0.74, 0.2, 0.99);
    animation-fill-mode: forwards
}

body .ui-helper-reset { line-height: normal }
body .ui-state-disabled { opacity: .4 }
body .ui-state-disabled .ui-state-disabled { opacity: 1 }
body .ui-widget-overlay { background: rgba(0,0,0,.4) }
body .ui-resizable-handle { position: absolute }

body select,
body input:not([role=combobox],[type=file],.ui-widget,.ui-inputfield) {
    color: #eaebec;
    background: #3e4754;
    padding: .5rem .5rem;
    border: 1px solid #545b67;
    outline: 0 none;
    font-size: 1rem;
    border-radius: 6px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}

body select:focus,
body input:not([role=combobox],[type=file],.ui-widget,.ui-inputfield):focus {
    border-color: #ffa858;
    outline: 0 none;
    box-shadow: 0 0 0 1px #ffc591
}

body select:hover,
body input:not([role=combobox],[type=file],.ui-widget,.ui-inputfield):hover {
    border-color: #ffa858
}

/* ===== BUTTON ===== */
body .ui-button {
    background: #ffa858;
    color: #3e4754;
    border: 1px solid #ffa858;
    margin: 0;
    outline: 0 none;
    border-radius: 6px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-button.ui-state-hover { background: #ff810e; border-color: #ff810e; color: #3e4754 }
body .ui-button.ui-state-focus { outline: 0 none; box-shadow: 0 0 0 1px #ffc591 }
body .ui-button.ui-state-active,body .ui-button.ui-state-down { background: #f17606; border-color: #f17606; color: #3e4754 }
body .ui-button.ui-state-disabled { opacity: .4 }

body .ui-button.ui-button-outlined {
    background-color: transparent;
    color: #ffa858;
    border: 1px solid
}
body .ui-button.ui-button-outlined.ui-state-hover { background: rgba(255,168,88,.04); color: #ffa858; border: 1px solid }
body .ui-button.ui-button-outlined.ui-state-active { background: rgba(255,168,88,.16); color: #ffa858; border: 1px solid }

body .ui-button.ui-button-flat {
    background-color: transparent;
    color: #ffa858;
    border-color: transparent
}
body .ui-button.ui-button-flat.ui-state-hover { background: rgba(255,168,88,.04); color: #ffa858; border-color: transparent }
body .ui-button.ui-button-flat.ui-state-active { background: rgba(255,168,88,.16); color: #ffa858; border-color: transparent }

body .ui-button.ui-button-text-only .ui-button-text { padding: .5rem 1rem }
body .ui-button.ui-button-text-icon-left .ui-button-text { padding: .5rem 1rem .5rem 2rem }
body .ui-button.ui-button-text-icon-left .ui-icon { position: absolute; top: 50%; margin-top: -.5rem; left: .5rem }
body .ui-button.ui-button-text-icon-right .ui-button-text { padding: .5rem 2rem .5rem 1rem }
body .ui-button.ui-button-text-icon-right .ui-icon { position: absolute; top: 50%; margin-top: -.5rem; right: .5rem }
body .ui-button.ui-button-icon-only { width: 2.357rem }
body .ui-button.ui-button-icon-only .ui-button-text { padding: .5rem 0 }
body .ui-button.ui-button-icon-only .ui-icon { position: absolute; top: 50%; left: 50%; margin-top: -.5rem; margin-left: -.5rem }
body .ui-button.ui-button-raised { box-shadow: 0px 3px 1px -2px rgba(0,0,0,.2),0px 2px 2px 0px rgba(0,0,0,.14),0px 1px 5px 0px rgba(0,0,0,.12) }
body .ui-button.rounded-button { border-radius: 2rem }
body .ui-button.rounded-button.ui-button-icon-only { border-radius: 50%; height: 2.357rem }

/* Button severity variants */
body .ui-button.ui-button-secondary,body .ui-splitbutton.ui-button-secondary>.ui-button { background: #78909c; color: #fff; border: 1px solid #78909c }
body .ui-button.ui-button-success,body .ui-splitbutton.ui-button-success>.ui-button { background: #c5e1a5; color: #121212; border: 1px solid #c5e1a5 }
body .ui-button.ui-button-warning,body .ui-splitbutton.ui-button-warning>.ui-button { background: #ffe082; color: #121212; border: 1px solid #ffe082 }
body .ui-button.ui-button-help,body .ui-splitbutton.ui-button-help>.ui-button { background: #ce93d8; color: #121212; border: 1px solid #ce93d8 }
body .ui-button.ui-button-info,body .ui-splitbutton.ui-button-info>.ui-button { background: #81d4fa; color: #121212; border: 1px solid #81d4fa }
body .ui-button.ui-button-danger,body .ui-splitbutton.ui-button-danger>.ui-button { background: #f48fb1; color: #121212; border: 1px solid #f48fb1 }

/* Link */
body .ui-commandlink,body .ui-link { color: #ffa858; transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s }
body .ui-commandlink:hover,body .ui-link:hover { color: #ff810e; text-decoration: underline }

/* SelectOneButton / SelectManyButton */
body .ui-selectbooleanbutton,
body .ui-selectonebutton>.ui-button,
body .ui-selectmanybutton>.ui-button {
    background: #293241; color: #eaebec; border: 1px solid #545b67; outline: 0 none;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-selectbooleanbutton.ui-state-hover,
body .ui-selectonebutton>.ui-button.ui-state-hover,
body .ui-selectmanybutton>.ui-button.ui-state-hover { background: rgba(255,168,88,.2); border-color: #545b67; color: #eaebec }
body .ui-selectbooleanbutton.ui-state-active,
body .ui-selectonebutton>.ui-button.ui-state-active,
body .ui-selectmanybutton>.ui-button.ui-state-active { background: #ffa858; border-color: #ffa858; color: #3e4754 }

/* ===== INPUTFIELD ===== */
body .ui-inputfield {
    font-size: 1rem;
    color: #eaebec;
    background: #3e4754;
    padding: .5rem .5rem;
    border: 1px solid #545b67;
    outline: 0 none;
    border-radius: 6px;
    appearance: none;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-inputfield:enabled:hover { border-color: #ffa858 }
body .ui-inputfield:enabled:focus {
    outline: 0 none;
    outline-offset: 0;
    box-shadow: 0 0 0 1px #ffc591;
    border-color: #ffa858
}
body .ui-inputfield.ui-state-error { border-color: #f48fb1 }
body .ui-inputfield.ui-state-disabled { opacity: .4; background: #3e4754; color: #eaebec }
body .ui-inputfield::placeholder { color: #7f848d }

/* Filled mode */
body .ui-input-filled .ui-inputfield,
body.ui-input-filled .ui-inputfield { background: #293241 }
body .ui-input-filled .ui-inputfield:enabled:hover,
body.ui-input-filled .ui-inputfield:enabled:hover { background: #293241 }
body .ui-input-filled .ui-inputfield:enabled:focus,
body.ui-input-filled .ui-inputfield:enabled:focus { background: #293241 }

/* Fluid width */
body .ui-fluid .ui-inputfield { width: 100% }
body .ui-fluid .ui-inputtext { width: 100% }

/* ===== OUTPUTLABEL ===== */
body .ui-outputlabel { color: #eaebec }
body .ui-outputlabel.ui-label-float { color: #bfc2c6; transition: top .2s,color .2s,font-size .2s }
body .ui-outputlabel .ui-outputlabel-rfi { color: #ffa858 }

/* ===== FLOAT LABEL ===== */
body .ui-float-label > label {
    color: #7f848d;
    transition: top .2s,color .2s,font-size .2s
}
body .ui-float-label > input:focus ~ label,
body .ui-float-label > input.ui-state-filled ~ label,
body .ui-float-label > .ui-inputwrapper-focus ~ label,
body .ui-float-label > .ui-inputwrapper-filled ~ label { color: #ffa858 }

/* ===== AUTOCOMPLETE / DROPDOWN icon ===== */
body .ui-input-icon-left .pi,
body .ui-input-icon-right .pi { color: #bfc2c6 }

/* ===== CHECKBOX ===== */
body .ui-chkbox .ui-chkbox-box {
    border: 2px solid #545b67;
    background: #3e4754;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 6px;
    color: #3e4754;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-chkbox .ui-chkbox-box:not(.ui-state-disabled):hover { border-color: #ffa858 }
body .ui-chkbox .ui-chkbox-box.ui-state-focus { outline: 0 none; box-shadow: 0 0 0 1px #ffc591; border-color: #ffa858 }
body .ui-chkbox .ui-chkbox-box.ui-state-active { border-color: #ffa858; background: #ffa858 }
body .ui-chkbox .ui-chkbox-box.ui-state-active .ui-chkbox-icon { color: #3e4754 }
body .ui-chkbox .ui-chkbox-box.ui-state-active:not(.ui-state-disabled):hover { border-color: #ff810e; background: #ff810e }

/* ===== RADIOBUTTON ===== */
body .ui-radiobutton .ui-radiobutton-box {
    border: 2px solid #545b67;
    background: #3e4754;
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    color: #3e4754;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-radiobutton .ui-radiobutton-box:not(.ui-state-disabled):hover { border-color: #ffa858 }
body .ui-radiobutton .ui-radiobutton-box.ui-state-focus { outline: 0 none; box-shadow: 0 0 0 1px #ffc591; border-color: #ffa858 }
body .ui-radiobutton .ui-radiobutton-box.ui-state-active { border-color: #ffa858 }
body .ui-radiobutton .ui-radiobutton-box.ui-state-active .ui-radiobutton-icon { background: #ffa858; width: .75rem; height: .75rem }
body .ui-radiobutton .ui-radiobutton-box.ui-state-active:not(.ui-state-disabled):hover { border-color: #ff810e }
body .ui-radiobutton .ui-radiobutton-box.ui-state-active:not(.ui-state-disabled):hover .ui-radiobutton-icon { background: #ff810e }

/* ===== SELECTONEMENU (DROPDOWN) ===== */
body .ui-selectonemenu {
    background: #3e4754;
    border: 1px solid #545b67;
    border-radius: 6px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-selectonemenu .ui-selectonemenu-label { padding: .5rem .5rem; background: transparent; border: 0 none; color: #eaebec; border-radius: 6px }
body .ui-selectonemenu .ui-selectonemenu-trigger { border: 0 none; background: transparent; border-top-right-radius: 6px; border-bottom-right-radius: 6px; color: #bfc2c6; padding: 0 .5rem }
body .ui-selectonemenu:not(.ui-state-disabled):hover { border-color: #ffa858 }
body .ui-selectonemenu:not(.ui-state-disabled).ui-state-focus { outline: 0 none; box-shadow: 0 0 0 1px #ffc591; border-color: #ffa858 }
body .ui-selectonemenu-panel { background: #293241; border: 1px solid #545b67; border-radius: 6px; box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12) }
body .ui-selectonemenu-panel .ui-selectonemenu-list { padding: .5rem 0 }
body .ui-selectonemenu-panel .ui-selectonemenu-list-item { padding: .5rem 1rem; color: #eaebec; transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s }
body .ui-selectonemenu-panel .ui-selectonemenu-list-item:hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-highlight { background: #ffa858; color: #3e4754 }
body .ui-selectonemenu-panel .ui-selectonemenu-list-item.ui-state-highlight:hover { background: #ff810e; color: #3e4754 }

/* ===== INPUTSWITCH ===== */
body .ui-inputswitch { width: 3rem; height: 1.75rem }
body .ui-inputswitch .ui-inputswitch-slider {
    background: #545b67;
    border-radius: 30px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-inputswitch .ui-inputswitch-slider:before {
    background: #eaebec;
    width: 1.25rem;
    height: 1.25rem;
    left: .25rem;
    margin-top: -0.625rem;
    border-radius: 50%;
    transition-duration: .2s
}
body .ui-inputswitch.ui-inputswitch-checked .ui-inputswitch-slider { background: #ffa858 }
body .ui-inputswitch.ui-inputswitch-checked .ui-inputswitch-slider:before { transform: translateX(1.25rem) }
body .ui-inputswitch:not(.ui-state-disabled):hover .ui-inputswitch-slider { background: #69707a }
body .ui-inputswitch:not(.ui-state-disabled):hover.ui-inputswitch-checked .ui-inputswitch-slider { background: #ff810e }
body .ui-inputswitch.ui-state-focus .ui-inputswitch-slider { outline: 0 none; box-shadow: 0 0 0 1px #ffc591 }

/* ===== SLIDER ===== */
body .ui-slider { background: #545b67; border: 0 none; border-radius: 6px }
body .ui-slider.ui-slider-horizontal { height: .286rem }
body .ui-slider.ui-slider-vertical { width: .286rem }
body .ui-slider .ui-slider-handle {
    height: 1.143rem;
    width: 1.143rem;
    background: #ffa858;
    border: 2px solid #ffa858;
    border-radius: 50%;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-slider .ui-slider-handle:focus { outline: 0 none; box-shadow: 0 0 0 1px #ffc591 }
body .ui-slider .ui-slider-range { background: #ffa858 }

/* ===== RATING ===== */
body .ui-rating .ui-rating-star { width: 1.143rem; height: 1.143rem; margin-right: .5rem }
body .ui-rating .ui-rating-star .pi { color: #bfc2c6; font-size: 1.143rem; transition: color .2s }
body .ui-rating .ui-rating-star.ui-rating-cancel .pi,
body .ui-rating .ui-rating-star.ui-rating-cancel:hover .pi { color: #f48fb1 }
body .ui-rating .ui-rating-star.ui-state-highlight .pi { color: #ffa858 }
body .ui-rating:not(.ui-state-disabled):not(.ui-rating-readonly) .ui-rating-star:hover .pi { color: #ffa858 }

/* ===== SPINNER ===== */
body .ui-spinner .ui-spinner-input { padding-right: 2rem }
body .ui-spinner .ui-spinner-button { border-left: 0 none }

/* ===== PAGINATOR ===== */
body .ui-paginator {
    background: #293241;
    color: #bfc2c6;
    border: solid #545b67;
    border-width: 0;
    padding: .5rem 1rem;
    border-radius: 6px
}
body .ui-paginator .ui-paginator-first,
body .ui-paginator .ui-paginator-prev,
body .ui-paginator .ui-paginator-next,
body .ui-paginator .ui-paginator-last {
    background-color: transparent;
    border: 0 none;
    color: #bfc2c6;
    min-width: 2.357rem;
    height: 2.357rem;
    border-radius: 6px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-paginator .ui-paginator-first:hover,
body .ui-paginator .ui-paginator-prev:hover,
body .ui-paginator .ui-paginator-next:hover,
body .ui-paginator .ui-paginator-last:hover { background: rgba(255,168,88,.2); color: #eaebec; border-color: transparent }
body .ui-paginator .ui-paginator-page {
    background-color: transparent;
    border: 0 none;
    color: #bfc2c6;
    min-width: 2.357rem;
    height: 2.357rem;
    border-radius: 6px;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-paginator .ui-paginator-page:hover { background: rgba(255,168,88,.2); color: #eaebec; border-color: transparent }
body .ui-paginator .ui-paginator-page.ui-state-active { background: #ffa858; border-color: #ffa858; color: #3e4754 }

/* ===== DATATABLE ===== */
body .ui-datatable .ui-datatable-header {
    background: #293241;
    border: 1px solid #545b67;
    border-width: 0 0 1px 0;
    color: #bfc2c6;
    padding: 1rem;
    font-weight: 600;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    text-align: left
}
body .ui-datatable .ui-datatable-footer {
    background: #293241;
    border: 1px solid #545b67;
    border-width: 0 0 1px 0;
    color: #eaebec;
    padding: 1rem;
    font-weight: 600;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    text-align: left
}
body .ui-datatable thead th {
    background: #293241;
    color: #eaebec;
    padding: 1rem;
    border: 1px solid #545b67;
    border-width: 0 0 1px 0;
    text-align: left;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-datatable thead th .ui-column-title { font-weight: 600; vertical-align: middle }
body .ui-datatable thead th.ui-state-hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-datatable thead th.ui-state-active { background: #293241; color: #ffa858 }
body .ui-datatable thead th.ui-sortable-column.ui-state-focus { box-shadow: inset 0 0 0 1px #ffc591 }

body .ui-datatable .ui-datatable-data>tr {
    background: #293241;
    color: #eaebec;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-datatable .ui-datatable-data>tr>td {
    padding: 1rem;
    border: 1px solid #545b67;
    border-width: 0 0 1px 0
}
body .ui-datatable .ui-datatable-data>tr.ui-state-hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-datatable .ui-datatable-data>tr.ui-state-highlight { background: #ffa858; color: #3e4754 }
body .ui-datatable .ui-datatable-data>tr.ui-datatable-selectable { cursor: pointer }
body .ui-datatable .ui-datatable-data>tr.ui-datatable-emptymessage>td { padding: 1rem }

/* ===== PANEL / CARD ===== */
body .ui-panel {
    border: 1px solid #545b67;
    border-radius: 6px;
    background: #293241;
    color: #eaebec
}
body .ui-panel .ui-panel-titlebar {
    border: 1px solid #545b67;
    background: #293241;
    color: #eaebec;
    border-width: 0 0 1px 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    padding: 1rem;
    font-weight: 600
}
body .ui-panel .ui-panel-content { padding: 1rem; background: #293241; color: #eaebec }
body .ui-panel .ui-panel-footer { padding: 1rem; background: #293241; border-top: 1px solid #545b67 }

body .ui-card {
    background: #293241 !important;
    color: #eaebec !important;
    border-radius: 6px !important;
    box-shadow: 0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12) !important;
    border: none !important
}
body .ui-card .ui-card-body { padding: 1.25rem }
body .ui-card .ui-card-title { font-size: 1.5rem; font-weight: 700; margin-bottom: .5rem; color: #eaebec }
body .ui-card .ui-card-subtitle { color: #bfc2c6; margin-bottom: 1rem; font-weight: 400 }
body .ui-card .ui-card-content { padding: 1rem 0 }
body .ui-card .ui-card-footer { padding: 1rem 0 0 0 }

/* ===== DIALOG ===== */
body .ui-dialog {
    border-radius: 6px;
    box-shadow: 0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);
    border: 0 none
}
body .ui-dialog .ui-dialog-titlebar {
    border-bottom: 1px solid #545b67;
    background: #293241;
    color: #eaebec;
    padding: 1.5rem;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px
}
body .ui-dialog .ui-dialog-title { font-weight: 700; font-size: 1.25rem; line-height: 1 }
body .ui-dialog .ui-dialog-content { background: #293241; color: #eaebec; padding: 0 1.5rem 2rem 1.5rem }
body .ui-dialog .ui-dialog-footer { border-top: 0 none; background: #293241; color: #eaebec; padding: 0 1.5rem 1.5rem 1.5rem; display: flex; justify-content: flex-end; align-items: center; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px }
body .ui-dialog .ui-dialog-footer button { margin: 0 .5rem 0 0 }

/* ===== MESSAGES ===== */
body .ui-messages .ui-messages-info { background: rgba(129,212,250,.2); border: solid rgba(129,212,250,.5); border-width: 0 0 0 6px; border-radius: 0; color: #81d4fa }
body .ui-messages .ui-messages-warn { background: rgba(255,224,130,.2); border: solid rgba(255,224,130,.5); border-width: 0 0 0 6px; border-radius: 0; color: #ffe082 }
body .ui-messages .ui-messages-error { background: rgba(244,143,177,.2); border: solid rgba(244,143,177,.5); border-width: 0 0 0 6px; border-radius: 0; color: #f48fb1 }
body .ui-messages .ui-messages-fatal { background: rgba(244,143,177,.2); border: solid rgba(244,143,177,.5); border-width: 0 0 0 6px; border-radius: 0; color: #f48fb1 }
body .ui-messages .ui-messages-success { background: rgba(197,225,165,.2); border: solid rgba(197,225,165,.5); border-width: 0 0 0 6px; border-radius: 0; color: #c5e1a5 }
body .ui-messages { margin: 0 0 1rem 0; padding: 1rem 1.5rem }

/* ===== TABS ===== */
body .ui-tabs { background: #3e4754; border: 1px solid #545b67; border-radius: 6px; padding: 0 }
body .ui-tabs .ui-tabs-nav { background: #293241; padding: 0; border-width: 0 0 2px 0; border-color: #545b67 }
body .ui-tabs .ui-tabs-nav li { margin: 0 }
body .ui-tabs .ui-tabs-nav li a { background: #293241; border: none; color: #bfc2c6; padding: 1rem; font-weight: 700; border-radius: 0; border-bottom: 2px solid transparent; transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s; margin: 0 0 -2px 0 }
body .ui-tabs .ui-tabs-nav li a:hover { color: #eaebec; border-bottom-color: #ffa858 }
body .ui-tabs .ui-tabs-nav li.ui-tabs-selected a,
body .ui-tabs .ui-tabs-nav li.ui-state-active a { color: #ffa858; border-bottom-color: #ffa858 }
body .ui-tabs .ui-tabs-panels { background: #3e4754; color: #eaebec; padding: 1rem 0; border: 0 }

/* ===== ACCORDION ===== */
body .ui-accordion .ui-accordion-header a {
    padding: 1rem;
    border: 1px solid #545b67;
    border-radius: 6px;
    color: #eaebec;
    background: #293241;
    font-weight: 700;
    transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s
}
body .ui-accordion .ui-accordion-header a:hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-accordion .ui-accordion-header.ui-state-active a { background: rgba(255,168,88,.2); border-color: #545b67; color: #ffa858; border-radius: 6px }
body .ui-accordion .ui-accordion-header.ui-state-active .ui-accordion-content { border-top: 0; background: #293241; color: #eaebec }
body .ui-accordion .ui-accordion-content { padding: 1rem; border: 1px solid #545b67; border-top: 0; background: #293241; color: #eaebec; border-bottom-left-radius: 6px; border-bottom-right-radius: 6px }

/* ===== MENU / MENUBAR ===== */
body .ui-menu {
    background: #293241;
    border: 1px solid #545b67;
    border-radius: 6px;
    color: #eaebec;
    padding: .5rem 0
}
body .ui-menu .ui-menu-list .ui-menuitem > .ui-menuitem-link { padding: .75rem 1rem; color: #eaebec; border-radius: 0; transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s }
body .ui-menu .ui-menu-list .ui-menuitem > .ui-menuitem-link:hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-menu .ui-menu-list .ui-menuitem > .ui-menuitem-link.ui-state-active { background: #ffa858; color: #3e4754 }

/* ===== TOOLTIP ===== */
body .ui-tooltip .ui-tooltip-text {
    background: #eaebec;
    color: #293241;
    padding: .5rem;
    box-shadow: 0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);
    border-radius: 6px;
    font-size: .875rem
}

/* ===== PROGRESSBAR ===== */
body .ui-progressbar { background: #545b67; border: 0 none; height: 1.5rem; border-radius: 6px }
body .ui-progressbar .ui-progressbar-value { border: 0 none; margin: 0; background: #ffa858; border-radius: 6px }
body .ui-progressbar .ui-progressbar-label { color: #3e4754; line-height: 1.5rem }

/* ===== BADGE / TAG ===== */
body .ui-badge {
    background: #ffa858;
    color: #3e4754;
    font-size: .75rem;
    font-weight: 700;
    min-width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    border-radius: 50%
}
body .ui-badge.ui-badge-secondary { background: #78909c; color: #fff }
body .ui-badge.ui-badge-success { background: #c5e1a5; color: #121212 }
body .ui-badge.ui-badge-info { background: #81d4fa; color: #121212 }
body .ui-badge.ui-badge-warning { background: #ffe082; color: #121212 }
body .ui-badge.ui-badge-danger { background: #f48fb1; color: #121212 }

body .ui-tag { background: #ffa858; color: #3e4754; font-size: .75rem; font-weight: 700; padding: .25rem .4rem; border-radius: 6px }
body .ui-tag.ui-tag-success { background: #c5e1a5; color: #121212 }
body .ui-tag.ui-tag-info { background: #81d4fa; color: #121212 }
body .ui-tag.ui-tag-warning { background: #ffe082; color: #121212 }
body .ui-tag.ui-tag-danger { background: #f48fb1; color: #121212 }

/* ===== SKELETON ===== */
body .ui-skeleton { background-color: #545b67; border-radius: 6px }
body .ui-skeleton:after { background: linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent) }

/* ===== DIVIDER ===== */
body .ui-divider-horizontal { margin: 1rem 0; border-top: 1px solid #545b67 }
body .ui-divider-horizontal:before { border-top: 1px solid #545b67 }
body .ui-divider-vertical:before { border-left: 1px solid #545b67 }
body .ui-divider .ui-divider-content { background: #3e4754; color: #bfc2c6; padding: 0 .5rem }

/* ===== FIELDSET ===== */
body .ui-fieldset { border: 1px solid #545b67; background: #293241; color: #eaebec; border-radius: 6px }
body .ui-fieldset legend { background: #293241; color: #eaebec; padding: .5rem; border-radius: 6px }
body .ui-fieldset.ui-fieldset-toggleable legend { padding: .5rem; border-radius: 6px; transition: background-color .2s,color .2s,border-color .2s,box-shadow .2s }
body .ui-fieldset.ui-fieldset-toggleable legend:hover { background: rgba(255,168,88,.2); color: #eaebec }
body .ui-fieldset .ui-fieldset-content { padding: 1rem }

/* ===== SCROLLBAR ===== */
::-webkit-scrollbar { width: 6px; height: 6px }
::-webkit-scrollbar-track { background: #3e4754 }
::-webkit-scrollbar-thumb { background: #545b67; border-radius: 3px }
::-webkit-scrollbar-thumb:hover { background: #ffa858 }