/* ============================================================================== */
/* Styles par defaut                                                              */
/* ============================================================================== */

body {
/*	background: var(--apl-surface) url(/htdocs/theme/aplweb/img/background_aplweb_1024.png) 0 0 no-repeat;*/
    -moz-background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
  background-color: var(--apl-bg);
  color: var(--apl-text-body);
  font-size: 12px;
    font-family: arial,tahoma,verdana,helvetica;
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
    margin-left: 0;
    text-align: left;
  width:100% !important;
    direction: ltr;
}

/* Variáveis ajustadas para tamanho menor */
:root {
    /* ==== gerado por PHP: modo claro ==== */
    color-scheme: light;

    /* --- marca (derivada de MAIN_PDF_CABECALHO) --- */
    --primary:          #3fb030;
    --primary-dark:     #2c7b21;
    --primary-color:    #3fb030;   /* faltava: e' quem colore os links */
    --hover-color:      #2c7b21;
    --cor_suave:        #e2f3df;
    --bg-suave:         #e2f3df;       /* faltava: fundo do item ativo do menu lateral */
    --cor_fundo_suave:  #5bbb4f;
    --cor_fundo_suave2: #95d38d;
    --cor-principal:    #CEF0D6;
    --fg-color:         #ffffff;
    --cor_super_suave:  #f5fbf5;
    
    --apl-fundo-escuro:            #333333;
    --apl-fundo-escuro-2:          #555555;
    --apl-fundo-4:                 #666666;
    --apl-fundo-slate:             #475569;
    --apl-fundo-strong:            #1e293b;
    
    /* --- tipografia e formas (nao mudam com o tema) --- */
    --font-family: Arial, Tahoma, Verdana, sans-serif;
    --font-size: 12px;
    --border-radius: 6px;
    --tamanho-borda: 5px;
    --raio-borda: 12px;

    /* --- superficies --- */
    --apl-bg:                      #FFFFFF;
    --apl-surface:                 #FFFFFF;
    --apl-surface-2:               #f8fafc;
    --apl-surface-3:               #f1f5f9;
    --apl-surface-4:               #e9ecef;
    --apl-surface-5:               #e6e6e6;

    /* --- bordas --- */
    --apl-border:                  #cbd5e1;
    --apl-border-2:                #DDDDDD;
    --pdv-cinza:                   #e1e1e1;
    --pdv-cinza-2:                 #cccccc;
    --pdv-linha:                   #cccccc;
    --apl-roxo-pdv:               #6d3f6d;
    --apl-nota-priv: #fffdf3;
    --apl-nota-priv-foco: #fffbe8;
    --apl-info-300: #bfdbfe;
    --apl-border-3:                #CCCCCC;
    --apl-border-4:                #C0C4C7;
    --apl-border-5:                #CED4DA;
    --apl-border-6:                #C5D0DD;
    --apl-border-azul:             #B3C5CC;
    --apl-border-azul-2:           #ACBCBB;
    --apl-border-azul-3:           #D3E5EC;
    --apl-border-azul-4:           #8C9CAB;
    --apl-border-quente:           #EBD5AA;
    --apl-border-rosa:             #E1A4A4;

    /* --- texto --- */
    --apl-text-body:               #101010;
    --apl-text-0:                  #222222;
    --apl-text:                    #333333;
    --apl-text-2:                  #444444;
    --apl-text-3:                  #555555;
    --apl-text-4:                  #666666;
    --apl-text-5:                  #888888;
    --apl-text-soft:               #556070;
    --apl-text-slate:              #475569;
    --apl-text-strong:             #1e293b;
    --apl-text-mute:               #BBBBBB;
    --apl-text-mute-2:             #BDBDBD;
    --apl-azul-escuro:             #002255;
    --apl-azul-escuro-2:           #000055;
    --apl-verde-texto:             #234046;
    --apl-black:                   #000000;
    --apl-white:                   #FFFFFF;

    /* --- estados --- */
    --apl-danger-bg:               #ffe7ec;
    --apl-danger-bg-2:             #fee2e2;
    --apl-danger-border:           #fca5a5;
    --apl-danger-fg:               #961400;
    --apl-danger-fg-2:             #b91c1c;
    --apl-danger-fg-3:             #550000;
    --apl-danger-fg-4:             #842F00;
    --apl-danger-fg-5:             #7F1D1D;
    --apl-danger-pura:             #FF0000;
    --apl-warn-bg:                 #FAF8E8;
    --apl-warn-bg-2:               #EFEFD4;
    --apl-warn-bg-3:               #E0E0D0;
    --apl-warn-fg:                 #887711;
    --apl-warn-fg-2:               #997711;
    --apl-ok-bg:                   #EBF5EB;
    --apl-ok:                      #4CAF50;
    --apl-ok-2:                    #459B49;
    --apl-ok-dark:                 #0C7858;
    --apl-ok-dark-2:               #1D7A62;
    --apl-excel:                   #15803D;
    --apl-excel-2:                 #166534;
    --apl-azul-btn:                #1D4ED8;
    --apl-azul-btn-2:              #1E40AF;
    --apl-info-dark:               #114466;
    
    /* --- escala semantica do padrao 2026 --- */
    --apl-ok-50:                   #f0fdf4;
    --apl-ok-100:                  #dcfce7;
    --apl-ok-200:                  #bbf7d0;
    --apl-ok-600:                  #16a34a;
    --apl-danger-200:              #fecaca;
    --apl-danger-500:              #ef4444;
    --apl-danger-600:              #dc2626;
    --apl-danger-800:              #991b1b;
    --apl-warn-100:                #fef3c7;
    --apl-warn-500:                #f59e0b;
    --apl-warn-700:                #b45309;
    --apl-warn-800:                #92400e;
    --apl-info-100:                #dbeafe;
    --apl-info-500:                #3b82f6;
    --apl-info-600:                #2563eb;
    --apl-roxo:                    #7c3aed;
    --apl-ciano:                   #0891b2;
    --apl-verde-fundo:             #104336;
    
    /* --- achados no inbox do CRM e no financeiro --- */
    --apl-chat-fundo:              #ecf0e9;
    --apl-warn-50:                 #fffbeb;
    --apl-warn-200:                #fef08a;
    --apl-warn-300:                #fde68a;
    --apl-danger-50:               #fef2f2;
    --apl-ok-500:                  #22c55e;
    --apl-roxo-100:                #ddd6fe;
    --apl-cinza-800:               #1f2937;
    --apl-laranja:                 #ea580c;
    
    /* --- balões de conversa (convenção do WhatsApp) --- */
    --apl-bolha-out:               #d9fdd3;
    --apl-bolha-in:                #ffffff;
    --apl-bolha-txt:               #111b21;
    --apl-conv-ativa:              #e6f1fb;
    
    /* --- desempate por propriedade --- */
    --apl-text-invert:             #FFFFFF;
    --apl-text-preto:              #000000;
    --apl-border-clara:            #FFFFFF;
    --apl-surface-escura:          #222222;
    --apl-border-escura-2:         #444444;
    --apl-border-escura-3:         #555555;
    --apl-border-escura-5:         #888888;
    --apl-border-soft:             #64748b;

    /* --- escala slate (ja existia) --- */
    --slate-50:                    #f8fafc;
    --slate-100:                   #f1f5f9;
    --slate-200:                   #e2e8f0;
    --slate-300:                   #cbd5e1;
    --slate-400:                   #94a3b8;
    --slate-500:                   #64748b;
    --slate-600:                   #475569;
    --slate-700:                   #334155;
    --slate-800:                   #1e293b;
    --slate-900:                   #0f172a;

    /* --- formularios --- */
    --background-color:            #FDFDFD;
    --border-color:                #e2e8f0;
    --disabled-background-color:   #f1f5f9;

    /* --- calendario --- */
    --fundo-principal:             #f0f4f7;
    --cor-secundaria:              #ffffff;
    --cor-borda:                   #e0e0e0;
    --cor-texto:                   #fff;
    --cor-texto-destaque:          #fff;
    --cor-destaque:                #bdbdbd;
    --cor-numeros-calendario:      #00695c;
}



.bouton_mode_reglement_add:hover{
    background: #3fb030;//#45a049;
}

.bouton_mode_reglement_add{
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif !important;
    font-weight: bold;
    background: #2c7b21;//#0C7858;
    border-radius: 8px;
    border: 1px solid var(--apl-border-escura-3);
    color: var(--apl-text-invert);
    padding: 5px 16px;
    margin: 0 10px;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
    font-size: 13px !important;
    line-height: 1;
}


/* Estilo de links ajustado */
a:link, a:visited, a:active {
    font-family: var(--font-family);
    font-weight: bold;
    color: var(--primary-color);
    text-decoration: none;
}

a:hover {
    color: var(--hover-color);
    text-decoration: underline;
}

/* Estilo uniforme para inputs, textarea, e select, agora menor */
input, textarea, select.flat {
    font-size: var(--font-size);
    font-family: var(--font-family);
    background: var(--background-color);
    border: 1px solid var(--slate-200);
    border-radius: 6px;
    font-weight: 600;
    padding: 6px 10px;
    margin: 1px 0;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}

input:focus, textarea:focus, select.flat:focus {
    border-color: var(--primary);
    box-shadow: 0 0 0 3px var(--cor_suave);
}

input:hover, textarea:hover, select.flat:hover {
    border-color: var(--primary-dark);
}

input:disabled, textarea:disabled {
    background: var(--disabled-background-color);
    color: var(--slate-400);
    cursor: not-allowed;
}

.conection-cell {
    vertical-align: middle;
  }
  
  .shopify-logo {
    width: 25px;
    height: 25px;
    vertical-align: middle;
  }
  
  .status-light {
    width: 15px;
    height: 15px;
    vertical-align: middle;
    margin-left: 5px; /* Esto asegurará que haya un pequeño espacio entre los dos iconos */
}
  
/* Aperfeiçoamento no hover e foco, mantendo a proporção */
input:hover, textarea:hover, select.flat:hover,
input:focus, textarea:focus, select.flat:focus {
    border-color: darken(var(--border-color), 10%);
    transition: border-color 0.3s ease-in-out;
}

/* Estilo para elementos desabilitados */
input:disabled, textarea:disabled {
    background: var(--disabled-background-color);
    color: var(--apl-text-4);
}


input.button[type=submit],
.button,
.buttonajax {
    font-family: var(--font-family);
    font-weight: 700;
    background: var(--primary);
    border-radius: 8px;
    border: none;
    color: var(--apl-text-invert);
    padding: 8px 18px;
    margin: 0 6px;
    text-decoration: none;
    white-space: nowrap;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
}

input.button[type=submit]:hover,
.button:hover,
.buttonajax:hover {
    background: var(--primary-dark);
    transform: translateY(-1px);
    color: var(--apl-text-invert);
    text-decoration: none;
}

.button:focus,
.buttonajax:focus {
    outline: none; /* Remover a borda de foco */
}

.buttonajax {
    background-color: var(--apl-border-3); /* Cinza */
    color: var(--apl-text); /* Texto escuro */
}

.buttonajax:hover {
    background-color: var(--apl-text-mute); /* Cinza mais escuro ao passar o mouse */
}


form {
    padding: 0em 0em 0em 0em;
    margin: 0em 0em 0em 0em;
}
div.float
{
    float:left;
}

/* For hide object and add pointer cursor */

.hideobject { display: none; }
.linkobject { cursor: pointer; }

/* For dragging lines */

.dragClass {
  color: var(--apl-azul-escuro);
}
td.showDragHandle {
  cursor: move;
}
.tdlineupdown {
  white-space: nowrap;
}


/* ============================================================================== */
/* Styles de positionnement des zones                                             */
/* ============================================================================== */
div.leftContent {
  margin-left: 0px !important;
        width: 200px !important;
        background-color: var(--apl-surface);
    overflow: auto;
    overflow-y:auto;
    overflow-x:hidden;
}


td.vmenu {
    margin-right: 2px;
    padding: 0px;
    padding-bottom: 0px;
    padding-top: 1px;
    width: 200px;
}

div.fiche {
    margin-left: 5px;
  margin-right: 5px;*/
}

/* ============================================================================== */
/* Menu top et 1ere ligne tableau                                                 */
/* ============================================================================== */


@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap');

/* Estiliza o contêiner do menu */
div.tmenu {
    position: relative;
    display: block;
    white-space: nowrap;
    padding: 0;
    margin: 0 auto;
    height: 40px; /* Altura ajustada do menu */
    background: #e2f3df; /* #EBF5EB Cor de fundo do menu, verde mais escuro */
    border-bottom: 2px solid #2c7b21; /* #2E7D32 Destaque inferior em verde mais escuro */
    font-family: 'Roboto', sans-serif; /* Fonte Roboto */
}

/* Estiliza a lista de navegação */
ul.tmenu {
    list-style: none;
    padding: 0;
    margin: 0;
    height: 100%;
    display: block;
  text-align: center;
  overflow-x: auto;
}

/* Estiliza os itens da lista */
li.tmenu {
    margin: 3px 5px 0; /* Espaçamento horizontal entre os itens */
  display: inline-block;
}

/* Estiliza os links do menu */
a.tmenu:link, a.tmenu:visited {
    color: var(--apl-text); /* Cor do texto dos links */
    padding: 10px 15px; /* Preenchimento dos links */
    text-decoration: none; /* Remove o sublinhado dos links */
    transition: background-color 0.2s; /* Transição suave de cor de fundo */
}

/* Estiliza o hover dos links do menu */
a.tmenu:hover, a.tmenu:active {
    background-color: #95d38d; /* #A5D6A7 Cor de fundo ao passar o mouse, verde mais claro */
    color: #ffffff;
    border-radius: 5px; /* Bordas arredondadas */
}

/* Estiliza o item do menu selecionado */
a.tmenusel:link, a.tmenusel:visited, a.tmenusel:hover, a.tmenusel:active {
    color: var(--apl-text-invert); /* Cor do texto do item selecionado */
    background-color: #5bbb4f; /* #66BB6A Cor de fundo do item selecionado, verde mais claro */
    border-radius: 5px; /* Bordas arredondadas */
    padding: 10px 15px; /* Ajuste no padding para aumentar o tamanho do botão */
    height: 15px; /* Altura aumentada para o item selecionado */
    line-height: 15px; /* Ajuste na altura da linha para centralizar o texto verticalmente */
    display: inline-block; /* Permite ajustar a altura */
    text-decoration: none;
}

/* Sobrepondo menu/style.css */
.nav > li > .parent {
    background: #3fb030;//#66BB6A;
    border-radius: 10px;
    padding: 8px;
    text-decoration: none;
    position: relative;
    z-index: 2;
    margin: 0 4px;
    border: 4px solid var(--apl-border-clara);
    box-shadow: 2px 2px 0px rgba(0,0,0,0.2);
}

.nav li li a {
    display: block;
    background: #e2f3df;//#EBF5EB;
    position: relative;
    z-index: 100;
    /* height: 25px; */
    padding: 8px;
/*    width: 254px;*/
    /* border-top: 1px solid #175e4c; */
    /* border-width: 1px; */
    /* border-style: solid; */
    /* border-color: rgb(217, 217, 217); */
    border-radius: 4px;
    color: var(--apl-text);
    border: 0.55px solid #3fb030;//#66BB6A;
    text-decoration: none;
}
.nav li li li a {
    background:#3fb030;//#249578;
    z-index:200;
    border-top: 1px solid var(--apl-ok-dark-2);
}

.nav li li a:hover {
    background:#3fb030;//#A5D6A7;
    color:#ffffff;
}

.vmenu.ui-accordion .ui-accordion-content.ui-accordion-content-active {
    background: #e2f3df;//#EBF5EB

}

.vmenu.ui-accordion .ui-accordion-content {
    padding: 0;
    padding-top: 0 !important;
    padding-bottom: 0 !important;    
}

.vmenu.ui-accordion .ui-accordion-content .menu_contenu:hover {   
    background:#5bbb4f;//#A5D6A7
}

.vmenu.ui-accordion .ui-accordion-content .menu_contenu { 
    border-bottom: 0.55px solid #5bbb4f;//#66BB6A
    margin: 0 2px;
    border-radius: 4px;
}

.vmenu.ui-accordion .ui-accordion-content .menu_contenu a { 
    color:var(--apl-text);
    text-decoration: none;
  padding:8px 12px;
  display:inline-block;
  width:calc( 100% - 24px );
}

.vmenu.ui-accordion .ui-accordion-content .menu_contenu a:hover { 
    background:#95d38d;
    color: #ffffff;
}

div.menu_titre.ui-state-active a
{
    color: #ffffff;
    background-color: #5bbb4f;//#66BB6A
    box-sizing: border-box;
    padding: 8px 8px 8px 2.2em;
    border-radius: 4px;
}

.ui-accordion .blockvmenusearch {
    padding-bottom:16px;
}

.ui-accordion .blockvmenusearch .ui-accordion-header a  {
    display: unset;
}

.ui-accordion .blockvmenusearch form input[type=submit]  {
    margin:0;
}

.ui-accordion .blockvmenusearch form {
    padding: 0 .5em 0 .7em;
}

div.menu_titre
{
    padding: 2px;
    padding-left:2px;
    margin-top: 8px;
    margin: 0px;
    text-align: left;
    font-size : 12px;
    color : #5bbb4f;//#66BB6A;
    font-weight: bold;
    height: 30px;
    line-height: 30px;
}

/*div.menu_titre a.vmenu {
    font-weight: bold;
    font-family: arial,tahoma,verdana,helvetica;
    font-size: 12px;
}
*/
/* Estiliza os links desativados */
a.tmenudisabled:link, a.tmenudisabled:visited, a.tmenudisabled:hover, a.tmenudisabled:active {
    color: var(--apl-text-mute-2); /* Cor do texto dos links desativados */
    cursor: not-allowed; /* Muda o cursor para indicar ação não permitida */
}


.tmenuimage {
    padding:0 0 0 0 !important;
    margin:0 0px 0 0 !important;
}



/* Login */

div.login_block {
  position: absolute;
  right: 5px;
  top: 3px;
  font-weight: bold;
  }

div.logomarca {
    position: relative;
  top: 5px;
    background-image: url(/htdocs/theme/Logo_Directa-125.png);
    background-position: top right;
    background-repeat: no-repeat;
  display: block;
}

div.login_block table {
  display: inline;
}

div.login {
  white-space:nowrap;
    padding: 8px 0px 0px 0px;
    margin: 0px 0px 0px 8px;
  font-weight: bold;
}
div.login a {
  color: var(--apl-verde-texto);
}
div.login a:hover {
  color: var(--apl-text-preto);
  text-decoration:underline;
}

img.login, img.printer, img.entity {
  padding: 8px 0px 0px 0px;
  margin: 0px 0px 0px 8px;
  text-decoration: none;
  color: var(--apl-text-invert);
  font-weight: bold;
}


/* ============================================================================== */
/* Menu gauche                                                                    */
/* ============================================================================== */


/* Estilização do botão do menu */
.menu-button {
    background-color: var(--apl-ok); /* Verde */
    color: var(--apl-text-invert);
    padding: 10px;
    border: none;
    cursor: pointer;
    border-radius: 5px;
}

/* Estilização do menu popup */
.menu-popup {
    position: absolute;
    background-color: var(--apl-surface-2); /* Cinza claro */
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    padding: 12px 16px;
    z-index: 1;
    border-radius: 5px;
}

.menu-popup a {
    padding: 10px 15px;
    display: block;
    color: var(--apl-ok); /* Verde */
    text-decoration: none;
}

.menu-popup a:hover {
    background-color: var(--apl-border-2); /* Cinza mais claro */
}



/* ============================================================================== */
/* Panes for Main                                                   */
/* ============================================================================== */

/*
 *  PANES and CONTENT-DIVs
 */

#mainContent {
  /*background: var(--apl-surface) url(/htdocs/theme/aplweb/img/headbg2.jpg) 0 0 no-repeat;*/
}

#mainContent, #leftContent .ui-layout-pane {
    padding:    0px;
    overflow:	auto;
}

#mainContent, #leftContent .ui-layout-center {
  padding:    0px;
  position:   relative; /* contain floated or positioned elements */
    overflow:   auto;  /* add scrolling to content-div */
    z-index:3 !important;
}

/* ============================================================================== */
/* Barre de redmiensionnement menu                                                */
/* ============================================================================== */

.ui-layout-resizer-west-open {
  left: 200px !important;
}

.ui-layout-north {
        height: 57px !important;
}
/* ============================================================================== */
/* Toolbar for ECM or Filemanager                                                 */
/* ============================================================================== */

.toolbar {
    background-image: url(/htdocs/theme/aplweb/img/tmenu2.png) !important;
    background-repeat: repeat-x !important;
    border: 1px solid var(--apl-text-mute) !important;
}

.toolbarbutton {
    margin-top: 2px;
    margin-left: 4px;
/*    border: solid 1px #AAAAAA;
    width: 34px;*/
    height: 34px;
/*    background: #FFFFFF;*/
}


/* ============================================================================== */
/* Panes for ECM or Filemanager                                                   */
/* ============================================================================== */

#containerlayout .layout-with-no-border {
    border: 0 !important;
    border-width: 0 !important;
}

#containerlayout .layout-padding {
    padding: 2px !important;
}

/*
 *  PANES and CONTENT-DIVs
 */
#containerlayout .ui-layout-pane { /* all 'panes' */
    background: var(--apl-surface);
    border:     1px solid var(--apl-text-mute);
    /* DO NOT add scrolling (or padding) to 'panes' that have a content-div,
       otherwise you may get double-scrollbars - on the pane AND on the content-div
    */
    padding:    0px;
    overflow:   auto;
}
/* (scrolling) content-div inside pane allows for fixed header(s) and/or footer(s) */
#containerlayout .ui-layout-content {
  padding:    10px;
  position:   relative; /* contain floated or positioned elements */
  overflow:   auto; /* add scrolling to content-div */
}

/*
 *  RESIZER-BARS
 */
.ui-layout-resizer  { /* all 'resizer-bars' */
    background:     var(--apl-surface);
    border:         1px solid var(--apl-text-mute);
    border-width:   0;
    }
    .ui-layout-resizer-drag {       /* REAL resizer while resize in progress */
    }
    .ui-layout-resizer-hover    {   /* affects both open and closed states */
    }
    /* NOTE: It looks best when 'hover' and 'dragging' are set to the same color,
        otherwise color shifts while dragging when bar can't keep up with mouse */
    /*.ui-layout-resizer-open-hover ,*/ /* hover-color to 'resize' */
    .ui-layout-resizer-dragging {   /* resizer beging 'dragging' */
        background: var(--apl-text-mute);
    }
    .ui-layout-resizer-dragging {   /* CLONED resizer being dragged */
        border-left:  1px solid var(--apl-text-mute);
        border-right: 1px solid var(--apl-text-mute);
    }
    /* NOTE: Add a 'dragging-limit' color to provide visual feedback when resizer hits min/max size limits */
    .ui-layout-resizer-dragging-limit { /* CLONED resizer at min or max size-limit */
        background: var(--apl-border-rosa); /* red */
    }

    .ui-layout-resizer-closed-hover { /* hover-color to 'slide open' */
        background: var(--apl-border-quente);
    }
    .ui-layout-resizer-sliding {    /* resizer when pane is 'slid open' */
        opacity: .10; /* show only a slight shadow */
        filter:  alpha(opacity=10);
        }
        .ui-layout-resizer-sliding-hover {  /* sliding resizer - hover */
            opacity: 1.00; /* on-hover, show the resizer-bar normally */
            filter:  alpha(opacity=100);
        }
        /* sliding resizer - add 'outside-border' to resizer on-hover
         * this sample illustrates how to target specific panes and states */
        .ui-layout-resizer-north-sliding-hover  { border-bottom-width:  1px; }
        .ui-layout-resizer-south-sliding-hover  { border-top-width:     1px; }
        .ui-layout-resizer-west-sliding-hover   { border-right-width:   1px; }
        .ui-layout-resizer-east-sliding-hover   { border-left-width:    1px; }

/*
 *  TOGGLER-BUTTONS
 */

.  {
    position: relative; /* Garante que o pseudo-elemento seja posicionado relativamente a este elemento */
    background-color: var(--apl-border-2); /* Cor de fundo do interruptor */
    border: 1px solid var(--apl-border-escura-5); /* Borda para melhor visualização */
}

.ui-layout-toggler.ui-layout-toggler-open::before {
    content: ''; /* Necessário para que o pseudo-elemento seja exibido */
    position: absolute; /* Posicionamento absoluto em relação ao seu pai */
    top: 50%;
    left: 50%;
    margin-top: -5px;
    margin-left: -3px;
    border: solid var(--apl-border-clara); /* Cor da seta */
    border-width: 0 3px 3px 0; /* Espessura da borda para criar a forma da seta */
    display: inline-block;
    padding: 3px; /* Tamanho da seta */
    transform: rotate(135deg); /* Rotaciona para formar a seta para a esquerda */
    cursor: pointer; /* Muda o cursor para indicar interatividade */
}

.ui-layout-toggler.ui-layout-toggler-closed::after {
    content: ''; /* Necessário para que o pseudo-elemento seja exibido */
    position: absolute; /* Posicionamento absoluto em relação ao seu pai */
    top: 50%;
    left: 50%;
    margin-top: -5px;
    margin-left: -7px;
    border: solid var(--apl-border-clara); /* Cor da seta */
    border-width: 0 3px 3px 0; /* Espessura da borda para criar a forma da seta */
    display: inline-block;
    padding: 3px; /* Tamanho da seta */
    transform: rotate(315deg); /* Rotaciona para formar a seta para a esquerda */
    cursor: pointer; /* Muda o cursor para indicar interatividade */
}

.ui-layout-toggler {
    position: relative; /* Garante que o pseudo-elemento seja posicionado relativamente a este elemento */
    background-color: #3fb030;//#66BB6A;
    border: 1px solid #3fb030;//#66BB6A;
    cursor: pointer; /* Muda o cursor para indicar interatividade */
}


/* ============================================================ */
/* ABAS APLWeb 2026                                             */
/* ============================================================ */


.dc-dropzone-btn { display:unset !important; max-width:200px !important; margin:0 auto !important; }
.dc-dropzone, .dn-dropzone, .cf-dropzone { display: flex !important; width: 95% !important; flex-direction: column !important; }

div.tabs,
.tabs-nav {
    display: flex;
    background: var(--apl-surface-2);
    border-bottom: 2px solid #e2f3df;
    overflow-x: auto;
    scrollbar-width: none;
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
    background-image: none;
}

div.tabs::-webkit-scrollbar,
.tabs-nav::-webkit-scrollbar { display: none; }

/* Título da aba (ex: "Pedido de Cliente") */
div.tabs a.tabTitle {
    display: flex;
    align-items: center;
    padding: 0 20px 0 10px;
    font-family: arial,tahoma,verdana,helvetica;
    font-weight: 800;
    font-size: 14px;
    color: var(--primary-dark, #2c7b21);
    text-decoration: none;
    white-space: nowrap;
    border-right: 1px solid #e2f3df;
    flex-shrink: 0;
}

/* Aba normal */
div.tabs a.tab,
.tab-button {
    padding: 13px 20px;
    border: none;
    background: transparent;
    color: var(--apl-text-3) !important;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: all 0.2s;
    border-bottom: 3px solid transparent;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    text-decoration: none !important;
    font-size: 13px;
    font-family: arial,tahoma,verdana,helvetica;
    line-height: 1;
    float: none;
    position: relative;
    margin-bottom: -2px;
    border-radius: 0;
    height: auto;
}

div.tabs a.tab i,
.tab-button i {
    width: 18px;
    text-align: center;
    font-size: 13px;
}

/* Hover */
div.tabs a.tab:hover,
.tab-button:hover {
    background: var(--apl-surface-4);
    color: var(--primary, #3fb030) !important;
    border-bottom: 3px solid transparent;
    text-decoration: none !important;
}

/* Aba ativa */
div.tabs a.tab#active,
div.tabs a.tab.active,
.tab-button.active {
    background: var(--primary, #3fb030);
    color: var(--apl-text-invert) !important;
    border-bottom: 3px solid var(--primary-dark, #2c7b21);
    font-weight: 800;
    border-radius: 0;
    height: auto;
    padding: 13px 20px;
    margin-bottom: -2px;
}

div.tabs a.tab#active i,
div.tabs a.tab.active i,
.tab-button.active i {
    color: var(--apl-text-invert);
}

/* Conteúdo abaixo das abas */
div.tabBar,
.tab-content-container {
    background: var(--apl-surface);
    border: 1px solid var(--slate-200, #e2f3df);
    border-top: none;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.02);
    padding: 25px;
    margin: 0;
    color: var(--apl-text-strong);
}

.tab-content {
    display: none;
    padding: 25px;
    min-height: 400px;
}

.tab-content.active {
    display: block !important;
    animation: fadeInTab 0.3s ease;
}

@keyframes fadeInTab {
    from { opacity: 0; transform: translateY(5px); }
    to   { opacity: 1; transform: translateY(0); }
}

div.tabsAction {
    margin: 16px 0 4px 0;
    padding: 0;
    text-align: right;
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    flex-wrap: wrap;
}

td.tab { background: transparent; }

span.tabspan {
    background: var(--cor_suave, #e2f3df);
    color: var(--primary-dark, #2c7b21);
    font-family: arial,tahoma,verdana,helvetica;
    padding: 4px 10px;
    margin: 0 2px;
    border-radius: 6px;
    white-space: nowrap;
    font-weight: 600;
}

/* ============================================================ */
/* HEADER DE FICHA APLWeb 2026 — substitui o dol_fiche_head    */
/* ============================================================ */

/* Esconde o título/ícone antigo do dol_fiche_head */
div.tabs a.tabTitle {
    display: none !important;
}

/* Container das abas — recebe borda superior como separador do header */
div.tabs {
    border-top: none !important;
    margin-top: 0 !important;
}

/* Estiliza o div.tabBar como conteúdo limpo */
div.tabBar {
    background: #e2f3df !important;
    border: 1px solid #e2f3df;
    border-top: none;
    border-radius: 0 0 12px 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.04);
    padding: 20px;
    margin: 0;
}

/* Header moderno gerado dinamicamente via JS abaixo das abas */
.apl-fiche-header {
    background: var(--primary, #3fb030);
    border-radius: 12px 12px 0 0;
    padding: 18px 24px;
    display: flex;
    align-items: center;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 0;
}

.apl-fiche-header .fh-icon {
    width: 48px; height: 48px;
    background: rgba(255,255,255,0.18);
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    font-size: 20px;
    color: var(--apl-text-invert);
}

.apl-fiche-header .fh-ref {
    font-size: 20px;
    font-weight: 900;
    color: var(--apl-text-invert);
    line-height: 1;
}

.apl-fiche-header .fh-meta {
    font-size: 12px;
    color: rgba(255,255,255,0.8);
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.apl-fiche-header .fh-badge {
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 11px;
    font-weight: 800;
    background: var(--apl-surface);
    color: var(--primary-dark, #2c7b21);
}

.palco-container {
    border: unset !important;
}

/* ============================================================================== */
/* Boutons actions                                                                */
/* ============================================================================== */

/* Nouvelle syntaxe a utiliser */

.butAction,
.butAction:link,
.butAction:visited,
.butAction:hover,
.butAction:active {
    font-family: var(--font-family);
    font-weight: 700;
    background: var(--primary);
    border-radius: 8px;
    border: none;
    color: var(--apl-text-invert);
    padding: 8px 18px;
    margin: 0 6px;
    text-decoration: none;
    white-space: nowrap;
    font-size: 12px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: background 0.2s, transform 0.1s;
}

.butAction:hover {
    background: var(--primary-dark);
    transform: translateY(-1px);
    color: var(--apl-text-invert);
    text-decoration: none;
}

.butActionDelete,
.butActionDelete:link,
.butActionDelete:visited {
    background: var(--apl-danger-bg-2);
    color: var(--apl-danger-fg-2);
    border: 1px solid var(--apl-danger-border);
    font-family: var(--font-family);
    font-weight: 700;
    border-radius: 8px;
    padding: 8px 18px;
    margin: 0 6px;
    text-decoration: none;
    white-space: nowrap;
    font-size: 12px;
    cursor: pointer;
    transition: 0.2s;
}

.butActionDelete:hover {
    background: var(--apl-danger-border);
    color: var(--apl-danger-fg-5);
    text-decoration: none;
}

.butActionRefused {
    background: var(--slate-100);
    color: var(--slate-400);
    font-family: var(--font-family);
    font-weight: 700;
    border-radius: 8px;
    border: 1px solid var(--slate-200);
    padding: 8px 18px;
    margin: 0 6px;
    white-space: nowrap;
    font-size: 12px;
    cursor: not-allowed;
}

/* ============================================================================== */
/* Tables                                                                         */
/* ============================================================================== */

/*
#undertopmenu {
background-image: url("/htdocs/theme/aplweb/img/gradient.gif");
background-repeat: repeat-x;
}
*/


.nocellnopadd {
list-style-type:none;
margin: 0px;
padding: 0px;

}

.notopnoleft {
border-collapse: collapse;
border: 0px;
padding-top: 0px;
padding-left: 0px;
padding-right: 6px;
padding-bottom: 0px;
margin: 0px 0px;
}

.notopnoleftnoright {
    border-collapse: collapse;
    border: none; /* Removendo a borda */
    padding: 0; /* Removendo todo o preenchimento */
    margin: 0; /* Removendo todas as margens */
}

.sembordas td,
.sembordas th {
  border: 0px !important;
}

.nobordertable td,
.nobordertable th{
    padding: 0px;
    border: none !important;
    max-height: 500px;
}

.notopnoleftnoright td,
.notopnoleftnoright th{
    padding: 0px;
    border: 1px solid var(--apl-border-2);
    max-height: 500px;
}
/* Tabelas com borda */
/*table.border {
    border: 1px solid #CED4DA; 
    border-collapse: collapse;
    box-shadow: 3px 3px 0px rgba(0, 0, 0, 0.2);
    width: 100%;
}

table.border {
    
}

table.border td,
table.border th {
    padding: 10px; 
    border: 1px solid #ddd;
}

table.border th {
    padding: 2px 4px; 
    border: 1px solid #CED4DA;
    background: #FFFFFF; 
    border-collapse: collapse;
}*/

/* Tabelas sem borda */
table.noborder, 
table.border,
table.liste {
    background: var(--apl-surface); /* Fundo branco */
    border: 1px solid var(--apl-border-5); /* Atualizando para exibir a borda com cinza claro */
    border-radius: 8px; /* Borda arredondada para um look moderno */
    border-spacing: 0; /* Espaçamento entre células */
    padding: 0;
    box-shadow: 0 4px 4px rgba(0,0,0,0.4); /* Sombra sutil para profundidade */
    overflow: hidden; /* Garante que o conteúdo extra é recortado */
}

/* Estilos adicionais para cabeçalho da tabela para maior destaque */
table.noborder,
table.border,
table.liste {
    background: var(--apl-surface);
    border: 1px solid var(--slate-200);
    border-radius: 12px;
    border-spacing: 0;
    padding: 0;
    box-shadow: 0 4px 12px rgba(0,0,0,0.06);
    overflow: hidden;
    width: 100%;
}

/* Estilização das células para um espaçamento uniforme e apresentável */
table.noborder td,
table.border td,
table.liste td {
    padding: -1px 12px;
    border-bottom: 1px solid var(--slate-100);
}

/* Última linha sem borda inferior para ajustar com a borda da tabela */
table.border tr:last-child td,
table.noborder tr:last-child td, 
table.liste tr:last-child td {
    border-bottom: none;
}

/* Estilização para linhas alternadas para melhorar a legibilidade */
table.noborder tr:nth-child(odd),
table.border tr:nth-child(odd),
table.liste tr:nth-child(odd) {
    background: var(--apl-surface-2);
}

table.noborder thead,
table.border thead,
table.liste thead {
    background: var(--primary);
    color: var(--fg-color);
    border-bottom: none;
}

/* Cabeçalhos */
tr.liste_titre {
    height: auto;
    color: var(--fg-color);
    font-weight: 700;
    font-family: var(--font-family);
    background: var(--cor_fundo_suave2);
    line-height: 1;
    white-space: nowrap;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

tr.liste_titre td,
tr.liste_titre th {
    background: var(--primary) !important;
    color: var(--fg-color) !important;
    padding: 12px 15px !important;
    border: none !important;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid var(--apl-border-2);
}

tr.liste_filtro td,
tr.liste_filtro th {
    background: var(--cor_fundo_suave2) !important;
    color: var(--fg-color) !important;
    padding: 10px 12px;
    border: none !important;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

table.nobordernopadding {
border: 0px;
border-spacing: 0px 0px;
}
table.nobordernopadding tr {
border: 0px;
padding: 0px 0px;
}
table.nobordernopadding td {
border: 0px;
padding: 0px 0px !important;
}

tr.liste_titre td {
    padding: 8px; /* Espaçamento interno ainda mais reduzido */
}

/* Linhas de total */
tr.liste_total td {
    border-top: 2px solid var(--primary) !important;
    background: var(--primary-dark) !important;
    color: var(--apl-text-invert) !important;
    font-weight: 900;
    white-space: nowrap;
    padding: 12px !important;
}

tr.liste_total td:hover {
    background: var(--primary-dark) !important;
}


/* Linhas alternadas */
tr.cab_fluxo, .impair {
    background: var(--apl-surface-4); /* Fundo cinza mais claro */
    font-weight: normal;
    color: var(--apl-text-0); /* Texto preto */
    white-space: nowrap;
}

/* Linhas alternadas - hover */
.impair:hover, .pair:hover {
    background: var(--apl-surface-5); /* Fundo cinza mais escuro ao passar o mouse */
}

/* Cabeçalho da tabela */
th {
    background: var(--primary);
    color: var(--fg-color);
    font-family: var(--font-family);
    font-weight: 700;
    border: none;
    white-space: nowrap;
    padding: 10px 12px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Células pares */
.pair, .pair td {
    background: var(--apl-surface);
    font-family: var(--font-family);
    border: 0;
    transition: background 0.15s;
}

.impair, .impair td {
    background: var(--slate-50);
    font-family: var(--font-family);
    border: 0;
    transition: background 0.15s;
}

.impair:hover td, .pair:hover td,
.impair:hover, .pair:hover {
    background: var(--cor_suave) !important;
}


.apl-vs-wrap {
     display: flex;
     gap: 6px;
     flex-wrap: wrap;
     align-items: center;
     padding: 10px 0;
     border-bottom: 2px solid var(--cor_suave, #e2f3df);
     margin-bottom: 16px;
 }
 
 /* Botão simples (Detalhado) */
 .apl-vs-btn {
     display: inline-flex; align-items: center; gap: 7px;
     padding: 8px 16px; border-radius: 8px;
     font-size: 12px; font-weight: 700;
     text-decoration: none !important; white-space: nowrap;
     transition: all 0.2s;
     border: 1px solid var(--slate-200, var(--apl-border));
     background: var(--apl-surface); color: var(--apl-text-soft) !important; cursor: pointer;
 }
 .apl-vs-btn:hover {
     border-color: var(--primary, #3fb030);
     color: var(--primary, #3fb030) !important;
     background: var(--cor_suave, #e2f3df);
     text-decoration: none !important;
 }
 .apl-vs-btn.active {
     background: var(--primary, #3fb030);
     color: var(--apl-text-invert) !important;
     border-color: var(--primary, #3fb030);
     font-weight: 800;
 }
 .apl-vs-btn i { font-size: 12px; width: 14px; text-align: center; }
 
 /* Dropdown */
 .apl-vs-dropdown { position: relative; display: inline-block; }
 .apl-vs-trigger {
     display: inline-flex; align-items: center; gap: 7px;
     padding: 8px 14px; border-radius: 8px;
     font-size: 12px; font-weight: 700;
     white-space: nowrap; transition: all 0.2s;
     border: 1px solid var(--slate-200, var(--apl-border));
     background: var(--apl-surface); color: var(--apl-text-soft); cursor: pointer;
     user-select: none;
 }
 .apl-vs-trigger:hover,
 .apl-vs-dropdown.open .apl-vs-trigger {
     border-color: var(--primary, #3fb030);
     color: var(--primary, #3fb030);
     background: var(--cor_suave, #e2f3df);
 }
 .apl-vs-trigger.has-active {
     background: var(--primary, #3fb030);
     color: var(--apl-text-invert) !important;
     border-color: var(--primary, #3fb030);
     font-weight: 800;
 }
 .apl-vs-trigger i.arrow {
     font-size: 10px; margin-left: 2px;
     transition: transform 0.2s;
 }
 .apl-vs-dropdown.open .apl-vs-trigger i.arrow { transform: rotate(180deg); }
 
 .apl-vs-menu {
     display: none;
     position: absolute;
     top: calc(100% + 6px);
     left: 0;
     background: var(--apl-surface);
     border: 1px solid var(--slate-200, var(--apl-border));
     border-radius: 10px;
     box-shadow: 0 8px 24px rgba(0,0,0,0.12);
     min-width: 220px;
     z-index: 999;
     overflow: hidden;
     padding: 6px 0;
 }
 .apl-vs-dropdown.open .apl-vs-menu { display: block; animation: vsMenuIn 0.15s ease; }
 
 @keyframes vsMenuIn {
     from { opacity:0; transform:translateY(-6px); }
     to   { opacity:1; transform:translateY(0); }
 }
 
 .apl-vs-menu a {
     display: flex; align-items: center; gap: 10px;
     padding: 9px 16px;
     font-size: 13px; font-weight: 600;
     color: var(--apl-text-slate) !important; text-decoration: none !important;
     transition: background 0.15s;
     white-space: nowrap;
 }
 .apl-vs-menu a:hover {
     background: var(--cor_suave, #e2f3df);
     color: var(--primary, #3fb030) !important;
 }
 .apl-vs-menu a.active {
     background: var(--cor_suave, #e2f3df);
     color: var(--primary, #3fb030) !important;
     font-weight: 800;
 }
 .apl-vs-menu a i { width:16px; text-align:center; font-size:12px; color:var(--primary, #3fb030); }
 .apl-vs-menu-sep {
     border: none; border-top: 1px solid var(--slate-200, var(--apl-border));
     margin: 4px 0;
 }
 
 
.fc-wrap         { background:var(--apl-surface); border:1px solid var(--slate-200); border-left:5px solid var(--primary); border-radius:10px; padding:20px 24px; margin-bottom:16px; }
.fc-row          { display:flex; gap:16px; flex-wrap:wrap; align-items:flex-end; margin-bottom:14px; }
.fc-row:last-child { margin-bottom:0; }
.fc-group        { display:flex; flex-direction:column; gap:5px; min-width:0; }
.fc-group.grow   { flex:1; }
.fc-label        { font-size:10px; font-weight:800; color:var(--slate-500); text-transform:uppercase; letter-spacing:0.5px; display:flex; align-items:center; gap:5px; white-space:nowrap; }
.fc-label i      { color:var(--primary); font-size:11px; }
.fc-input        { height:36px; background:var(--apl-surface-2); border:1px solid var(--slate-200); border-radius:7px; padding:0 10px; font-size:13px; width:100%; box-sizing:border-box; transition:0.2s; font-family:inherit; }
.fc-input:focus  { border-color:var(--primary); box-shadow:0 0 0 3px var(--cor_suave); outline:none; background:var(--apl-surface); }
.fc-select       { height:36px; background:var(--apl-surface-2); border:1px solid var(--slate-200); border-radius:7px; padding:0 10px; font-size:13px; width:100%; box-sizing:border-box; font-family:inherit; }
.fc-select:focus { border-color:var(--primary); outline:none; }
/* Sobrescreve selects nativos do Dolibarr dentro dos filtros */
.fc-group select, .fc-group select.flat { height:36px !important; background:var(--apl-surface-2) !important; border:1px solid var(--slate-200) !important; border-radius:7px !important; padding:0 10px !important; font-size:13px !important; min-width:120px; box-sizing:border-box; font-family:inherit; }
.fc-group input[type=text], .fc-group input[type=date] { height:36px !important; background:var(--apl-surface-2) !important; border:1px solid var(--slate-200) !important; border-radius:7px !important; padding:0 10px !important; font-size:13px !important; box-sizing:border-box; font-family:inherit; }
.fc-sep          { width:1px; background:var(--slate-200); align-self:stretch; margin:0 4px; flex-shrink:0; }
.fc-divider      { border:none; border-top:1px solid var(--slate-200); margin:4px 0 14px; }
.fc-period-btns  { display:flex; gap:6px; flex-wrap:wrap; }
.fc-period-btn   { background:var(--apl-surface); border:1px solid var(--slate-200); border-radius:20px; padding:4px 12px; font-size:11px; font-weight:700; color:var(--slate-500); cursor:pointer; transition:0.2s; text-decoration:none; white-space:nowrap; }
.fc-period-btn:hover { border-color:var(--primary); color:var(--primary); text-decoration:none; }
.fc-check-group  { display:flex; align-items:center; gap:6px; cursor:pointer; white-space:nowrap; }
.fc-check-group input[type=checkbox] { width:15px; height:15px; accent-color:var(--primary); cursor:pointer; }
.fc-check-label  { font-size:12px; font-weight:600; color:var(--slate-500); }
/* Seção avançada */
.fc-advanced     { display:none; background:var(--cor_suave,#e2f3df); border-radius:8px; padding:16px 20px; margin-top:12px; }
.fc-advanced.open{ display:block; }
/* Botões de ação */
.fc-actions      { display:flex; gap:8px; justify-content: center; flex-wrap:wrap; align-items:center; padding-top:16px; border-top:1px solid var(--slate-200); margin-top:4px; }
.fc-btn          { display:inline-flex; align-items:center; gap:7px; padding:9px 20px; border-radius:8px; font-size:13px; font-weight:700; cursor:pointer; border:none; transition:0.2s; text-decoration:none; white-space:nowrap; }
.fc-btn-primary  { background:var(--primary); color:var(--apl-text-invert); }
.fc-btn-primary:hover { background:var(--primary-dark); color:var(--apl-text-invert); text-decoration:none; }
.fc-btn-secondary{ background:var(--apl-surface); border:1px solid var(--slate-200); color:var(--slate-500); }
.fc-btn-secondary:hover { background:var(--apl-surface-3); color:var(--slate-900); text-decoration:none; }
.fc-btn-danger   { background:var(--apl-danger-bg-2); border:1px solid var(--apl-danger-border); color:var(--apl-danger-fg-2); }
.fc-btn-danger:hover { background:var(--apl-danger-border); text-decoration:none; }
.fc-btn-blue     { background:var(--apl-azul-btn); color:var(--apl-text-invert); }
.fc-btn-blue:hover { background:var(--apl-azul-btn-2); color:var(--apl-text-invert); text-decoration:none; }
.fc-btn-excel    { background:var(--apl-excel); color:var(--apl-text-invert) !important; }
.fc-btn-excel:hover { background:var(--apl-excel-2); color:var(--apl-text-invert); text-decoration:none; }

.fc-wrap.hidden-wrap {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

.fc-wrap {
    max-width: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

.fc-row {
    flex-wrap: wrap !important;
    max-width: 100%;
}

.fc-group {
    min-width: 0;
    flex-shrink: 1;
}

/* ── Filtro retrátil APLWeb 2026 ── */
.fc-wrap { transition: all 0.3s ease; }
.fc-wrap.hidden-wrap {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
.fc-collapsible {
  overflow: hidden;
  transition: max-height 0.35s ease, opacity 0.3s ease;
}
.fc-collapsible.collapsed {
  max-height: 0 !important;
  opacity: 0;
  pointer-events: none;
}


/* --- CONTAINER DOS BOTÕES --- */
.apl-vs-wrap {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

/* --- O BOTÃO GATILHO (TRIGGER) --- */
.apl-vs-dropdown {
  position: relative; /* Segura o menu flutuante preso a este botão */
}

.apl-vs-btn, .apl-vs-trigger {
  background: var(--apl-surface);
  border: 1px solid var(--slate-200);
  padding: 10px 16px;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--slate-700);
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: all 0.2s ease;
  user-select: none;
  text-decoration: none;
}

.apl-vs-btn:hover, .apl-vs-trigger:hover {
  background: var(--slate-100);
}

/* Cores quando um item dentro dele está ativo na URL atual */
.apl-vs-btn.active, .apl-vs-trigger.has-active, .apl-vs-dropdown.active .apl-vs-trigger {
  background: var(--primary);
  color: var(--apl-text-invert);
  border-color: var(--primary);
}

/* Gira a setinha quando clica */
.apl-vs-trigger .arrow {
  margin-left: 5px;
  font-size: 10px;
  transition: transform 0.2s ease;
}
.apl-vs-dropdown.active .arrow {
  transform: rotate(180deg);
}

/* --- A MÁGICA: O MENU FLUTUANTE --- */
.apl-vs-menu {
  display: none; /* Escondido por padrão */
  position: absolute;
  top: calc(100% + 5px);
  left: 0;
  background: var(--apl-surface);
  border: 1px solid var(--slate-200);
  border-radius: 8px;
  box-shadow: 0 10px 25px rgba(0,0,0,0.15);
  min-width: 220px;
  z-index: 1000;
  overflow: hidden;
}

/* Quando o JS injeta a classe 'active' no pai, o menu aparece! */
.apl-vs-dropdown.active .apl-vs-menu {
  display: flex;
  flex-direction: column;
  animation: aplFadeInDown 0.2s ease;
}

/* Links dentro do menu */
.apl-vs-menu a {
  padding: 12px 16px;
  font-size: 12px;
  font-weight: 600;
  color: var(--slate-700);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid var(--slate-100);
  transition: background 0.2s;
}

.apl-vs-menu a:last-child {
  border-bottom: none;
}

.apl-vs-menu a:hover {
  background: var(--slate-100);
  color: var(--primary);
}

.apl-vs-menu a.active {
  background: var(--bg-suave);
  color: var(--primary);
  font-weight: 800;
}

/* Animação suave 2026 */
@keyframes aplFadeInDown {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}
/* Garante que inputs e selects não estourem */
.fc-group input,
.fc-group select,
.fc-group select.flat {
    max-width: 100% !important;
    box-sizing: border-box !important;
}


/* ============================================================================== */
/* Boutons actions      APL                                                          */
/* ============================================================================== */

/* Nouvelle syntaxe a utiliser */

.butActionAPL,
.butActionAPL:link,
.butActionAPL:visited,
.butActionAPL:hover,
.butActionAPL:active,
.butActionAPLDelete,
.butActionAPLRefused,
.butActionAPLDelete:link,
.butActionAPLDelete:visited,
.butActionAPLDelete:hover,
.butActionAPLDelete:active {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    background: var(--apl-ok-dark); /* Verde escuro */
    border-radius: 8px;
    border: 1px solid var(--apl-border-escura-3); /* Cinza mais escuro */
    color: var(--apl-text-invert); /* Texto branco */
    text-decoration: none;
    white-space: nowrap;
    font-size: 14px; /* Tamanho da fonte */
    height: 30px; /* Altura do botão */
    line-height: 30px; /* Alinhamento vertical */
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s; /* Transição suave de cores */
}

.butActionAPL:hover {
    background: var(--apl-danger-bg); /* Cor de destaque em hover */
    color: var(--apl-danger-fg); /* Cor de destaque do texto em hover */
}

.butActionAPLDelete {
    border-color: red; /* Borda vermelha */
}

.butActionAPLDelete:hover {
    background: var(--apl-danger-bg); /* Cor de destaque em hover */
    color: var(--apl-danger-fg); /* Cor de destaque do texto em hover */
}

.butActionAPLRefused {
    background: var(--apl-danger-bg); /* Fundo rosa claro */
    color: var(--apl-text-4); /* Texto cinza */
}

span.butActionAPL,
span.butActionAPLDelete {
    cursor: pointer;
}

.butActionAPLMobile,
.butActionAPLMobile:link,
.butActionAPLMobile:visited,
.butActionAPLMobile:hover,
.butActionAPLMobile:active,
.butActionAPLMobileDelete,
.butActionAPLMobileRefused,
.butActionAPLMobileDelete:link,
.butActionAPLMobileDelete:visited,
.butActionAPLMobileDelete:hover,
.butActionAPLMobileDelete:active {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    background: var(--apl-ok-dark); /* Verde escuro */
    border-radius: 8px;
    border: 1px solid var(--apl-border-escura-3); /* Cinza mais escuro */
    color: var(--apl-text-invert); /* Texto branco */
    text-decoration: none;
    white-space: nowrap;
    font-size: 42px; /* Tamanho da fonte */
    height: 120px; /* Altura do botão */
    line-height: 120px; /* Alinhamento vertical */
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s; /* Transição suave de cores */
}

.butActionAPLMobile:hover {
    background: var(--apl-danger-bg); /* Cor de destaque em hover */
    color: var(--apl-danger-fg); /* Cor de destaque do texto em hover */
}

.butActionAPLMobileDelete {
    border-color: red; /* Borda vermelha */
}

.butActionAPLMobileDelete:hover {
    background: var(--apl-danger-bg); /* Cor de destaque em hover */
    color: var(--apl-danger-fg); /* Cor de destaque do texto em hover */
}

.butActionAPLMobileRefused {
    background: var(--apl-danger-bg); /* Fundo rosa claro */
    color: var(--apl-text-4); /* Texto cinza */
}

span.butActionAPLMobile,
span.butActionAPLMobileDelete {
    cursor: pointer;
}


/*
 *  Boxes
 */

.box {
padding-right: 0px;
padding-left: 0px;
padding-bottom: 4px;
}

tr.box_titre {
/*background-image: url(/htdocs/theme/aplweb/img/liste_titre2.png);*/
background-repeat: repeat-x;
color: var(--apl-danger-fg-4);
font-weight: normal;
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
white-space: nowrap;
  -moz-border-radius-topleft:6px;
  -moz-border-radius-topright:6px;
    border-top-left-radius:6px;
    border-top-right-radius:6px;
}

tr.box_impair {
/* background: #e6ebed; */
background: var(--apl-surface-5);
font-family: arial,tahoma,verdana,helvetica;
}

tr.box_impair:hover {
background: var(--apl-border-4);
border: 0px;
}

tr.box_pair {
/* background: #d0d4d7; */
background: var(--apl-surface-3);
font-family: arial,tahoma,verdana,helvetica;
}

tr.box_pair:hover {
background: var(--apl-border-4);
border: 0px;
}

tr.fiche {
font-family: arial,tahoma,verdana,helvetica;
}




/*
 *   Ok, Warning, Error
 */
.ok      { color: var(--apl-info-dark); }
.warning { color: var(--apl-warn-fg); }
.error   { color: var(--apl-danger-fg-3); font-weight: bold; }

div.ok {
  color: var(--apl-info-dark);
}

div.warning {
  color: var(--apl-warn-fg-2);
  padding: 0.2em 0.2em 0.2em 0.2em;
  margin: 0.5em 0em 0.5em 0em;
  border: 1px solid var(--apl-warn-bg-3);
  -moz-border-radius:6px;
  border-radius:6px;
  background: var(--apl-warn-bg-2);
}

div.error {
  color: var(--apl-danger-fg-3); font-weight: bold;
  padding: 0.2em 0.2em 0.2em 0.2em;
  margin: 0.5em 0em 0.5em 0em;
  border: 1px solid var(--apl-border-azul-4);
  -moz-border-radius:6px;
  border-radius:6px;
}

/* Info admin */
div.info {
  color: var(--apl-text-4);
  padding: 0.2em 0.2em 0.2em 0.2em;
  margin: 0.5em 0em 0.5em 0em;
  border: 1px solid var(--apl-warn-bg-3);
  -moz-border-radius:6px;
  border-radius:6px;
  background: var(--apl-warn-bg-2);
}


/*
 *   Liens Payes/Non payes
 */

a.normal:link { font-weight: normal }
a.normal:visited { font-weight: normal }
a.normal:active { font-weight: normal }
a.normal:hover { font-weight: normal }

a.impayee:link { font-weight: bold; color: var(--apl-danger-fg-3); }
a.impayee:visited { font-weight: bold; color: var(--apl-danger-fg-3); }
a.impayee:active { font-weight: bold; color: var(--apl-danger-fg-3); }
a.impayee:hover { font-weight: bold; color: var(--apl-danger-fg-3); }



/*
 *  Other
 */

.fieldrequired { font-weight: bold; color: var(--apl-azul-escuro-2); }

#pictotitle {
  }

.photo {
border: 0px;
/* filter:alpha(opacity=55); */
/* opacity:.55; */
}

div.titre {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    font-weight: bold;
    color: #2c7b21;//#0C7858; /* Tom de verde do botão */
    font-size: 24px;
    text-decoration: none;
    margin-left: 20px;
}



/* ============================================================================== */
/* Formulaire confirmation (When Ajax JQuery is used)                             */
/* ============================================================================== */

.ui-dialog-titlebar {
    border-top: solid 1px #3fb030;//#66BB6A;
    font-size: 14px;
    font-weight: bold;
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    height: 19px;
    color: var(--apl-text-invert);
    background: #3fb030;//#66BB6A;
}

.ui-dialog-buttonset{
    background: var(--apl-ok-bg);
}

.ui-dialog ui-widget ui-widget-content {
    background: var(--apl-ok-bg);
}

div.ui-dialog-content {
    font-size: 12px !important;
    background: var(--apl-ok-bg);
}

/* ============================================================================== */
/* Formulaire confirmation (When HTML is used)                                    */
/* ============================================================================== */

table.valid {
    border-top: solid 1px var(--apl-surface-5);
    border-left: solid 1px var(--apl-surface-5);
    border-right: solid 1px var(--apl-text-2);
    border-bottom: solid 1px var(--apl-border-escura-3);
  padding-top: 0px;
  padding-left: 0px;
  padding-right: 0px;
  padding-bottom: 0px;
  margin: 0px 0px;
    font-size: 13px;
    font-weight: bold;
    color: var(--apl-text-preto);
    background: var(--apl-ok-bg);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.2); /* Sobre leve */
}

table.valid select,
table.valid textarea,
table.valid input[type=file] {
    padding:4px;   
}

.validtitre {
    background: #3fb030;//#4CAF50; /* Uma tonalidade um pouco mais escura ou mais clara para diferenciação */
    color: #ffffff;//#FFF;
    font-weight: bold;
    padding: 4px 10px; /* Adiciona um pouco mais de espaço ao redor do texto */
    box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.15); /* Sombra mais sutil */
    border-radius: 4px; /* Adiciona bordas arredondadas para um toque moderno */
    font-size: 16px;
    margin-bottom: 10px; /* Espaço extra abaixo do título para separá-lo do conteúdo */
}


/* ============================================================================== */
/* Tooltips                                                                       */
/* ============================================================================== */

#tooltip {
position: absolute;
width: 450px;
border-top: solid 1px var(--apl-text-mute);
border-left: solid 1px var(--apl-text-mute);
border-right: solid 1px var(--apl-text-2);
border-bottom: solid 1px var(--apl-border-escura-2);
padding: 2px;
z-index: 3000;
background-color: var(--apl-warn-bg);
opacity: 1;
-moz-border-radius:6px;
border-radius:6px;
}


/* ============================================================================== */
/* Calendar                                                                       */
/* ============================================================================== */
/* Cores e estilos base ajustados com o novo tom de verde para os números do calendário */
/* :root do calendario foi fundido com o :root principal (topo do arquivo) */

/* Reset básico para o body e table */
.bodyline {
    padding: 0;
    margin-bottom: 10px;
    z-index: 3000;
    background-color: var(--fundo-principal);
}

table.dp {
    width: 100%; /* Tornando o calendário mais amplo */
    background-color: var(--cor-secundaria);
    border: var(--tamanho-borda) solid var(--cor-borda);
    border-radius: var(--raio-borda);
    box-shadow: 0 4px 6px rgba(0,0,0,0.2); /* Sombra suave para profundidade */
}

/* Estilos para células e texto */
.dp td, .tpHour td, .tpMinute td {
    padding: 8px; /* Mais espaço para facilidade de leitura */
    font-size: 14px; /* Tamanho de fonte maior */
    color: var(--cor-numeros-calendario); /* Cor dos números do calendário ajustada para verde escuro */
    border-bottom: 1px solid var(--cor-borda); /* Separador suave */
}

/* Cabeçalho do calendário */
.dpHead, .tpHead {
    font-weight: bold;
    color: var(--cor-texto-destaque);
    background-color: var(--cor-principal);
    font-size: 16px;
    padding: 10px;
    border-radius: var(--raio-borda) var(--raio-borda) 0 0; /* Arredondamento superior */
}

/* Botões */
.dpButtons, .tpButtons {
    text-align: center;
    background-color: var(--cor-principal);
    color: var(--cor-texto-destaque);
    font-weight: bold;
    cursor: pointer;
    padding: 5px 10px;
    border: none;
    border-radius: 4px; /* Botões mais arredondados */
    transition: background-color 0.3s ease;
}

.dpButtons:hover, .tpButtons:hover {
    background-color: darken(var(--cor-principal), 10%);
}

/* Dias da semana */
.dpDayNames td, .dpExplanation {
    background-color: var(--cor-destaque); /* Cor de fundo ajustada para cinza */
    color: var(--cor-texto); /* Cor do texto ajustada para branco */
    font-weight: bold;
    text-align: center;
}

/* Destaque para o dia atual e selecionado */
.dpToday, .dpReg:hover, .dpToday:hover, .dpSelected {
    cursor: pointer;
    background-color: var(--cor-destaque); /* Cor de fundo ajustada para cinza */
    color: var(--cor-texto-destaque); /* Cor do texto ajustada para branco */
    font-weight: bold;
}

/* Ajustes finais para aparência limpa */
.dpExplanation, .tpHour td:hover, .tpMinute td:hover {
    border-radius: var(--raio-borda);
}

.tpMinute td, .tpHour td {
    background-color: var(--cor-secundaria);
    text-align: center;
}

/* Botão invisível de fechar */
.dpInvisibleButtons {
    border-style: none;
    background-color: transparent;
    font-size: 16px; /* Tamanho ajustado para visibilidade */
    color: var(--cor-numeros-calendario); /* Cor ajustada para o verde azulado mais claro */
    cursor: pointer;
    text-align: right;
    ont-weight: bold;
}



/* ============================================================================== */
/*  Afficher/cacher                                                               */
/* ============================================================================== */

div.visible {
    display: block;
}

div.hidden {
    display: none;
}

tr.visible {
    display: block;
}

td.hidden {
    display: none;
}


/* ============================================================================== */
/*  Module agenda                                                                 */
/* ============================================================================== */

.cal_other_month   { background: var(--apl-border-2); border: solid 1px var(--apl-border-azul-2); padding-left: 2px; padding-right: 1px; padding-top: 0px; padding-bottom: 0px; }
.cal_past_month    { background: var(--apl-surface-4); border: solid 1px var(--apl-border-azul-2); padding-left: 2px; padding-right: 1px; padding-top: 0px; padding-bottom: 0px; }
.cal_current_month { background: var(--apl-surface); border: solid 1px var(--apl-border-azul-2); padding-left: 2px; padding-right: 1px; padding-top: 0px; padding-bottom: 0px; }
.cal_today         { background: var(--apl-surface); border: solid 2px var(--apl-border-soft); padding-left: 2px; padding-right: 1px; padding-top: 0px; padding-bottom: 0px; }
table.cal_event    { border-collapse: collapse; margin-bottom: 1px; }
table.cal_event td { border: 0px; padding-left: 0px; padding-right: 2px; padding-top: 0px; padding-bottom: 0px; }
.cal_event a:link    {font-size: 11px; font-weight: bold !important; }
.cal_event a:visited {color: var(--apl-text-invert); font-size: 11px; font-weight: bold !important; }
.cal_event a:active  {font-size: 11px; font-weight: bold !important; }
.cal_event a:hover   {color: var(--apl-text-invert); font-size: 11px; font-weight: bold !important; }



/* ============================================================================== */
/*  Afficher/cacher                                                               */
/* ============================================================================== */

#evolForm input.error {
                        font-weight: bold;
                        border: solid 1px var(--apl-danger-pura);
                        padding: 1px 1px 1px 1px;
                        margin: 1px 1px 1px 1px;
              }

#evolForm input.focuserr {
                        font-weight: bold;
                        background: var(--apl-warn-bg);
                        color: var(--apl-text-preto);
                        border: solid 1px var(--apl-danger-pura);
                        padding: 1px 1px 1px 1px;
                        margin: 1px 1px 1px 1px;
              }


#evolForm input.focus {	/*** Mise en avant des champs en cours d'utilisation ***/
                        background: var(--apl-warn-bg);
                        color: var(--apl-text-preto);
                        border: solid 1px var(--apl-black);
                        padding: 1px 1px 1px 1px;
                        margin: 1px 1px 1px 1px;
              }

#evolForm input.normal {	/*** Retour a l'etat normal apres l'utilisation ***/
                         background: var(--apl-white);
                         color: var(--apl-text-preto);
                         border: solid 1px var(--apl-border-clara);
                         padding: 1px 1px 1px 1px;
                         margin: 1px 1px 1px 1px;
               }



/* ============================================================================== */
/*  Ajax - Liste deroulante de l'autocompletion                                   */
/* ============================================================================== */

.ui-autocomplete-loading { background: var(--apl-white) url(/htdocs/theme/aplweb/img/working.gif) right center no-repeat; }
.ui-autocomplete {
         position:absolute;
         width:auto;
         font-size: 1.0em;
         background-color: var(--apl-white);
         border:1px solid var(--apl-border-escura-5);
         margin:0px;
         padding:0px;
           max-height:300px !important;
           overflow:auto !important;
       }
.ui-autocomplete ul {
         list-style-type:none;
         margin:0px;
         padding:0px;
       }
.ui-autocomplete ul li.selected { background-color: var(--apl-border-azul-3);}
.ui-autocomplete ul li {
         list-style-type:none;
         display:block;
         margin:0;
         padding:2px;
         height:16px;
         cursor:pointer;
       }

/* ============================================================================== */
/*  Ajax - In place editor                                                        */
/* ============================================================================== */

form.inplaceeditor-form { /* The form */
}

form.inplaceeditor-form input[type="text"] { /* Input box */
}

form.inplaceeditor-form textarea { /* Textarea, if multiple columns */
background: var(--apl-warn-bg);
color: var(--apl-text-preto);
}

form.inplaceeditor-form input[type="submit"] { /* The submit button */
  font-size: 100%;
  font-weight:normal;
  border: 0px;
  background-image : url(/htdocs/theme/aplweb/img/button_bg.png);
  background-position : bottom;
  cursor:pointer;
}

form.inplaceeditor-form a { /* The cancel link */
  margin-left: 5px;
  font-size: 11px;
  font-weight:normal;
  border: 0px;
  background-image : url(/htdocs/theme/aplweb/img/button_bg.png);
  background-position : bottom;
  cursor:pointer;
}



/* ============================================================================== */
/* Admin Menu                                                                     */
/* ============================================================================== */

/* CSS for treeview */

/* Lien plier /deplier tout */
.arbre-switch {
    text-align: right;
    padding: 0 5px;
    margin: 0 0 -18px 0;
}

/* Arbre */
ul.arbre {
    padding: 5px 10px;
}
/* strong : A modifier en fonction de la balise choisie */
ul.arbre strong {
    font-weight: normal;
    padding: 0 0 0 20px;
    margin: 0 0 0 -7px;
    background-image: url(/htdocs/theme/common/treemenu/branch.gif);
    background-repeat: no-repeat;
    background-position: 1px 50%;
}
ul.arbre strong.arbre-plier {
    background-image: url(/htdocs/theme/common/treemenu/plus.gif);
    cursor: pointer;
}
ul.arbre strong.arbre-deplier {
    background-image: url(/htdocs/theme/common/treemenu/minus.gif);
    cursor: pointer;
}
ul.arbre ul {
    padding: 0;
    margin: 0;
}
ul.arbre li {
    padding: 0;
    margin: 0;
    list-style: none;
}
/* This is to create an indent */
ul.arbre li li {
    margin: 0 0 0 16px;
}
/* Classe pour masquer */
.hide {
    display: none;
}

img.menuNew
{
  display:block;
  border:0px;
}

img.menuEdit
{
  border: 0px;
  display: block;
}

img.menuDel
{
  display:none;
  border: 0px;
}

div.menuNew
{
  margin-top:-20px;
  margin-left:270px;
  height:20px;
  padding:0px;
  width:30px;
  position:relative;
}

div.menuEdit
{
  margin-top:-15px;
  margin-left:250px;
  height:20px;
  padding:0px;
  width:30px;
  position:relative;

}

div.menuDel
{
  margin-top:-20px;
  margin-left:290px;
  height:20px;
  padding:0px;
  width:30px;
  position:relative;

}

div.menuFleche
{
  margin-top:-16px;
  margin-left:320px;
  height:20px;
  padding:0px;
  width:30px;
  position:relative;

}


/* ============================================================================== */
/*  Show Excel tabs                                                               */
/* ============================================================================== */

.table_data
{
  border-style:ridge;
  border:1px solid;
}
.tab_base
{
  background:var(--apl-border-6);
  font-weight:bold;
  border-style:ridge;
  border: 1px solid;
  cursor:pointer;
}
.table_sub_heading
{
  background:var(--apl-border-3);
  font-weight:bold;
  border-style:ridge;
  border: 1px solid;
}
.table_body
{
  background:var(--apl-surface-3);
  font-weight:normal;
  font-family:sans-serif;
  border-style:ridge;
  border: 1px solid;
  border-spacing: 0px;
  border-collapse: collapse;
}
.tab_loaded
{
  background:var(--apl-surface-escura);
  color: var(--apl-text-invert);
  font-weight:bold;
  border-style:groove;
  border: 1px solid;
  cursor:pointer;
}


/* ============================================================================== */
/*  CSS for color picker                                                          */
/* ============================================================================== */

A.color, A.color:active, A.color:visited {
 position : relative;
 display : block;
 text-decoration : none;
 width : 10px;
 height : 10px;
 line-height : 10px;
 margin : 0px;
 padding : 0px;
 border : 1px inset var(--apl-border-clara);
}
A.color:hover {
 border : 1px outset var(--apl-border-clara);
}
A.none, A.none:active, A.none:visited, A.none:hover {
 position : relative;
 display : block;
 text-decoration : none;
 width : 10px;
 height : 10px;
 line-height : 10px;
 margin : 0px;
 padding : 0px;
 cursor : default;
 border : 1px solid var(--apl-border-azul);
}
.tblColor {
 display : none;
}
.tdColor {
 padding : 1px;
}
.tblContainer {
 background-color : var(--apl-border-azul);
}
.tblGlobal {
 position : absolute;
 top : 0px;
 left : 0px;
 display : none;
 background-color : var(--apl-border-azul);
 border : 2px outset;
}
.tdContainer {
 padding : 5px;
}
.tdDisplay {
 width : 50%;
 height : 20px;
 line-height : 20px;
 border : 1px outset var(--apl-border-clara);
}
.tdDisplayTxt {
 width : 50%;
 height : 24px;
 line-height : 12px;
 font-family : arial,tahoma,verdana,helvetica;
 font-size : 8pt;
 color: var(--apl-text-preto);
 text-align : center;
}
.btnColor {
 width : 100%;
 font-family : arial,tahoma,verdana,helvetica;
 font-size : 10pt;
 padding : 0px;
 margin : 0px;
}
.btnPalette {
 width : 100%;
 font-family : arial,tahoma,verdana,helvetica;
 font-size : 8pt;
 padding : 0px;
 margin : 0px;
}


/* Style to overwrites JQuery styles */
.ui-menu .ui-menu-item a {
    text-decoration:none;
    display:block;
    padding:.2em .4em;
    line-height:1.5;
    zoom:1;
    font-weight: normal;
/*    font-family:arial,tahoma,verdana,helvetica;*/
    font-size:1em;
}
.ui-widget {
    font-family:arial,tahoma,verdana,helvetica;
    font-size:12px;
}

.ui-widget-content {
    background: var(--apl-ok-bg);
}

.ui-button { margin-left: -1px; }
.ui-button-icon-only .ui-button-text { height: 8px; }
.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: 2px 0px 6px 0px; }
.ui-button-text {
    line-height: 1em !important;
    color: var(--apl-text-invert);
    background: #2c7b21;//#91e391; /* Verde escuro */
    border-radius: 4px; /* Cantos arredondados */
    width: 50px;
    font-size: 13px; 
}

.ui-button-text:hover {
    background: #3fb030;//#45a049; /* Verde mais claro para o hover */
    color: var(--apl-text-invert);
}




.ui-autocomplete-input { margin: 0; padding: 1px; }


/* ============================================================================== */
/*  CKEditor                                                                      */
/* ============================================================================== */

.cke_editor table, .cke_editor tr, .cke_editor td
{
    border: 0px solid var(--apl-danger-pura) !important;
}
span.cke_skin_kama { padding: 0 !important; }
.cke_wrapper { padding: 4px !important; }


/* ============================================================================== */
/*  File upload                                                                   */
/* ============================================================================== */

.template-upload {
    height: 72px !important;
}

/* ============================================================================== */
/*  Searchbox                                                                     */
/* ============================================================================== */

.search-box {
  padding: 16px 16px 0 16px;
    width: 100%;
    box-sizing: border-box;
}

.search-box .results {
  display:none;
  position: absolute;
    width: 100%;
    background: var(--apl-surface);
    border-radius: 4px;
    box-shadow: 4px 4px 6px rgba(0,0,0,0.5);
  font-family:'Trebuchet MS';
  z-index: 9999;
}

.search-box .results .result-item {
    display: block;
    border-radius: 4px;
  background-image: url(img/arrow-icon.png);
    background-repeat: no-repeat;
    background-size: 18px 18px;
    background-position: right center;
}

.search-box .results .result-item:hover {
  background-color:var(--apl-ok-bg);
}

.search-box .results .result-item a {
  display: inline-block;
    width: calc(100% - 16px);
    border: 0.55px solid #3fb030;//#66BB6A;
    border-radius: 4px;
    margin: 0 0 1px;
    padding: 8px;
  font-size: 1.2em;
  color:var(--apl-text);
}

.search-box .results .result-item a span.subtitle {
  width: 100%;
    display: inline-block;
    color: var(--apl-ok-2);
    font-size: 0.8em;
    font-weight: normal;
    padding: 0 0 4px 0;
  white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.search-box .results .result-item a span.title {
  width: 100%;
    display: inline-block;
}

.search-box .search-box-inner {
  position: relative;
}

.search-box .search-box-inner input[type=text] {
  width: calc(100% - 16px);
    display: block;
    font-weight: normal;
    padding: 8px;
    border: 0.55px solid #3fb030;//#66BB6A;
}

.search-box .search-box-inner .icon {
  position: absolute;
    right: 10px;
    width: 20px;
    height: 33px;
    background-image: url(img/search-icon.png);
    background-size: 100%;
    z-index: 9999;
    background-repeat: no-repeat;
    opacity: 0.4;
    background-position: center center;
}

/* ============================================================================== */
/*  Pagination                                                                     */
/* ============================================================================== */

.pagination {
  font-family: 'Trebuchet MS';
    font-weight: bold;
    font-size: 1.2em;
  text-align: right;
}

.pagination .pagination-flex {
  display: flex;
    align-items: center;
    justify-content: center;
}

.pagination .pagination-inner {
  display:inline-block;
}

.pagination .pagination-inner a {
}

.pagination .pagination-inner a:hover {
  text-decoration:none;
}

.pagination .pagination-inner a.arrow-left {
  background: #3fb030;//#66BB6A;
    color: var(--apl-text-invert);
    height: 22px;
    width: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
  transform: rotate(180deg);
  padding: 0px 0 0px 0;
}

.pagination .pagination-inner a.arrow-right {
  background: #3fb030;//#66BB6A;
    color: var(--apl-text-invert);
    height: 22px;
    width: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
  padding: 0px 0 0px 0;
}

.pagination .pagination-inner .current-page {
  padding: 6px;
}

.pagination .pagination-inner .current-page u {
  background: var(--apl-border-3);
    color: var(--apl-text-invert);
    height: 19px;
    width: 22px;
    border-radius: 4px;
    padding: 3px 0 0px 0;
    display: inline-block;
    text-align: center;
  text-decoration:none;
}

.pagination .pagination-inner .current-page a {
  background: #3fb030;//#66BB6A;
    color: var(--apl-text-invert);
    height: 19px;
    width: 22px;
    border-radius: 4px;
    padding: 3px 0 0px 0;
    display: inline-block;
    text-align: center;
  text-decoration:none;
}


/* ==============================================================================
 * MODO ESCURO - ajustes finais
 * ============================================================================== */