/*
AS CORRECÇÕES NOSSAS AO STREAMIT.

O CSS do template (streamit.min.css e companhia) não se edita: uma
actualização do template apagava as alterações. Tudo o que for nosso
fica aqui, carregado por último para ganhar.
*/

/* o nome do sistema no lugar do logótipo da Streamit: no escuro, o
   template pinta-o quase preto (#0c0b0b) e ele desaparecia */
.navbar-brand .logo-title {
	color: var(--bs-heading-color, var(--bs-body-color)) !important;
	font-weight: 700;
	white-space: nowrap;
}

/* a inicial do nome no lugar da fotografia de perfil */
.avatar-inicial {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--bs-primary);
	color: #fff;
	font-weight: 700;
	font-size: 1.1rem;
	flex-shrink: 0;
}

/* o título de um grupo do menu ("Catálogo", "Vendas") */
.sidebar .menu-grupo {
	display: block;
	padding: .9rem 1rem .3rem;
	font-size: .72rem;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--bs-secondary-color);
}
.sidebar.sidebar-mini:not(:hover) .menu-grupo {
	visibility: hidden;
}

/* o botão de mostrar a palavra-passe tem de parecer parte do campo */
#verSenha {
	cursor: pointer;
}

/* páginas soltas (404) */
.ecra-centrado {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
}
.erro-numero {
	font-size: 4.5rem;
	font-weight: 700;
	line-height: 1;
	margin-bottom: .5rem;
}

/* as acções de uma linha de tabela, lado a lado e sem quebrar */
.acoes-linha {
	display: flex;
	gap: .35rem;
	justify-content: flex-end;
	white-space: nowrap;
}
.acoes-linha form {
	margin: 0;
}

/* o cartaz de um filme ou série na grelha: proporção 2:3, a dos cartazes
   de cinema, para a grelha ficar alinhada com capas de tamanhos diferentes */
.cartaz {
	overflow: hidden;
	position: relative;
}
/* o visto da selecção (ver extras/seleccao.phtml), no canto do cartaz;
   o "Desligado" chega-se para o lado para não ficar por baixo dele */
.cartaz-sel {
	position: absolute;
	top: .5rem;
	left: .5rem;
	z-index: 2;
	width: 1.35rem;
	height: 1.35rem;
	margin: 0;
	cursor: pointer;
	box-shadow: 0 0 0 2px rgba(0, 0, 0, .35);
}
.cartaz:has(.cartaz-sel) .cartaz-estado {
	left: 2.4rem;
}
.cartaz:has(.cartaz-sel:checked) {
	outline: 2px solid var(--bs-danger);
}
.cartaz-imagem {
	position: relative;
	aspect-ratio: 2 / 3;
	background: var(--bs-tertiary-bg);
	display: flex;
	align-items: center;
	justify-content: center;
}
.cartaz-imagem img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.cartaz-imagem > i {
	font-size: 3rem;
	color: var(--bs-secondary-color);
}
.cartaz-estado {
	position: absolute;
	top: .5rem;
	left: .5rem;
}
.cartaz-nota {
	position: absolute;
	top: .5rem;
	right: .5rem;
}
.cartaz-extra {
	position: absolute;
	bottom: .5rem;
	left: .5rem;
}

/* a capa no formulário, para se ver o que se está a editar */
.capa-previa {
	display: block;
	width: 100%;
	max-width: 180px;
	aspect-ratio: 2 / 3;
	object-fit: cover;
	border-radius: .5rem;
	margin-inline: auto;
}

/* subcategoria: a seta antes do nome */
.sub-seta {
	color: var(--bs-secondary-color);
	margin: 0 .35rem 0 .6rem;
}

/* ======================================================================
   AS TABELAS DINÂMICAS (js/tabelas.js, DataTables)
   ====================================================================== */

/* menos folga em cada célula: o Streamit põe 1rem+ e uma lista de 25 linhas
   não cabia no ecrã */
.nz-tabela > :not(caption) > * > * {
	padding: .45rem .6rem;
	vertical-align: middle;
}
.nz-tabela thead th {
	font-size: .78rem;
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--bs-secondary-color);
	white-space: nowrap;
	border-bottom-width: 1px;
}
.nz-tabela tbody tr {
	transition: background-color .12s ease;
}
.nz-tabela tbody tr:hover {
	background-color: rgba(var(--bs-primary-rgb), .06);
}
/* a linha seleccionada */
.nz-tabela tbody tr.nz-escolhida {
	background-color: rgba(var(--bs-primary-rgb), .14);
	box-shadow: inset 3px 0 0 var(--bs-primary);
}
.nz-col-visto { width: 2.2rem; }
.nz-tabela .acoes-linha { justify-content: flex-end; flex-wrap: nowrap; }

/* a barra de cima (mostrar N, pesquisar) e a de baixo (contagem, páginas) */
.nz-tabela-topo, .nz-tabela-baixo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	margin: .25rem 0 .75rem;
}
.nz-tabela-baixo { margin: .75rem 0 0; }
.nz-tabela-topo .dataTables_filter input {
	min-width: 16rem;
	margin-left: 0 !important;
}
.nz-tabela-topo label { margin: 0; display: flex; align-items: center; gap: .4rem; }
.dataTables_wrapper .dataTables_processing {
	background: var(--bs-gray-900);
	border: 1px solid var(--bs-border-color);
	border-radius: .5rem;
	color: var(--bs-body-color);
}
.dataTables_wrapper .pagination { margin: 0; }

/* as capas e os logótipos pequenos das linhas */
.nz-capa {
	width: 34px;
	height: 50px;
	object-fit: cover;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.nz-logo-canal {
	width: 32px;
	height: 32px;
	object-fit: contain;
	border-radius: 4px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}
.nz-capa-vazia {
	background: rgba(var(--bs-body-color-rgb), .07);
	color: var(--bs-secondary-color);
}
.nz-cartao-lista > .card-body { padding: 1rem 1.25rem; }

/* o logotipo das Definições, no menu e no site */
.nz-logo { max-height: 38px; width: auto; display: inline-block; }
/* o símbolo da marca (simbolo_marca) e o nome com o "Play" na cor dela */
.nz-marca { flex-shrink: 0; vertical-align: middle; }
.logo-title { font-family: "Sora", var(--bs-font-sans-serif); font-weight: 800; letter-spacing: -.03em; }
.nz-marca-play { color: #57A4B6; }

/* ======================================================================
   "A MÃO": tudo o que se escolhe ou se carrega mostra o cursor de clicar
   ====================================================================== */
input[type=checkbox], input[type=radio], input[type=color], input[type=file],
select, .form-select, .form-check-label, label[for], summary,
.nz-tabela tbody tr, .nz-tabela thead th.sorting, .nz-tabela thead th.sorting_asc, .nz-tabela thead th.sorting_desc,
.page-link, .dropdown-item, [data-bs-toggle], button:not(:disabled), .btn:not(:disabled) {
	cursor: pointer;
}
input:disabled, select:disabled, .btn:disabled { cursor: not-allowed; }

/* as janelas de confirmação (SweetAlert2) com as cores do painel, e não brancas.
   Com o .swal2-container à frente: as regras do próprio SweetAlert são
   "div:where(.swal2-container) ...", que pesam mais do que uma classe só. */
.swal2-container .swal2-popup {
	background: var(--bs-gray-900);
	color: var(--bs-body-color);
	border: 1px solid var(--bs-border-color);
}
.swal2-container .swal2-title { color: var(--bs-heading-color, var(--bs-body-color)); }
.swal2-container .swal2-html-container, .swal2-container .swal2-input-label, .swal2-container .swal2-label { color: var(--bs-body-color); }
.swal2-container .swal2-input {
	background: var(--bs-body-bg);
	color: var(--bs-body-color);
	border-color: var(--bs-border-color);
}
.swal2-container .swal2-checkbox { background: transparent; color: var(--bs-body-color); }

/* ======================================================================
   LISTA OU CARTÕES (filmes e séries: extras/lista-catalogo.phtml)
   A mesma tabela do DataTables, desenhada como grelha de cartazes.
   Cada célula traz o papel dela (nz-c-capa, nz-c-nome...) do <th>.
   ====================================================================== */
.nz-modos .btn.active { background: var(--bs-primary); border-color: var(--bs-primary); color: #fff; }

.nz-modo-cartoes .nz-tabela thead { display: none; }
.nz-modo-cartoes .nz-tabela,
.nz-modo-cartoes .nz-tabela tbody { display: block; }
.nz-modo-cartoes .nz-tabela tbody {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 14px;
}
.nz-modo-cartoes .nz-tabela tbody tr {
	display: flex;
	flex-direction: column;
	position: relative;
	overflow: hidden;
	border-radius: 14px;
	background: var(--bs-gray-900);
	border: 1px solid var(--bs-border-color);
	transition: transform .12s ease, box-shadow .12s ease;
}
.nz-modo-cartoes .nz-tabela tbody tr:hover { transform: translateY(-3px); box-shadow: 0 10px 24px rgba(0, 0, 0, .35); }
.nz-modo-cartoes .nz-tabela tbody tr.nz-escolhida { box-shadow: 0 0 0 2px var(--bs-primary); }
.nz-modo-cartoes .nz-tabela tbody td {
	display: block;
	border: 0;
	padding: 0 .6rem;
	background: transparent;
}
/* a capa ocupa o cimo do cartão, em 2:3 */
.nz-modo-cartoes .nz-tabela td.nz-c-capa { padding: 0; order: -1; }
.nz-modo-cartoes .nz-tabela td.nz-c-capa .nz-capa {
	width: 100%;
	height: auto;
	aspect-ratio: 2 / 3;
	border-radius: 0;
	font-size: 2.4rem;
}
.nz-modo-cartoes .nz-tabela td.nz-c-nome { padding-top: .5rem; font-size: .9rem; line-height: 1.25; }
.nz-modo-cartoes .nz-tabela td.nz-c-nome a { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nz-modo-cartoes .nz-tabela td.nz-c-info { font-size: .75rem; color: var(--bs-secondary-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nz-modo-cartoes .nz-tabela td.nz-c-info:empty { display: none; }
/* o visto, a nota e o estado por cima da capa */
.nz-modo-cartoes .nz-tabela td.nz-c-visto { position: absolute; top: .5rem; left: .1rem; z-index: 2; }
.nz-modo-cartoes .nz-tabela td.nz-c-visto .form-check-input { width: 1.3rem; height: 1.3rem; box-shadow: 0 0 0 2px rgba(0, 0, 0, .4); }
.nz-modo-cartoes .nz-tabela td.nz-c-nota { position: absolute; top: .5rem; right: 0; z-index: 2; font-size: .75rem; }
.nz-modo-cartoes .nz-tabela td.nz-c-nota:not(:empty) { background: rgba(0, 0, 0, .7); border-radius: 8px 0 0 8px; padding: .15rem .45rem; }
.nz-modo-cartoes .nz-tabela td.nz-c-estado { padding-top: .3rem; }
.nz-modo-cartoes .nz-tabela td.nz-c-accoes { padding: .5rem .6rem .6rem; margin-top: auto; }
.nz-modo-cartoes .nz-tabela td.nz-c-accoes .acoes-linha { justify-content: flex-start; }
/* a linha "Nada encontrado" ocupa a grelha toda */
.nz-modo-cartoes .nz-tabela td.dataTables_empty { grid-column: 1 / -1; padding: 1rem; text-align: center; }
.nz-modo-cartoes .nz-tabela tbody tr:has(td.dataTables_empty) { grid-column: 1 / -1; }

/* ======================================================================
   SIGA-NOS E APPS, no painel (links/, aplicacoes/)
   ====================================================================== */
.nz-rede {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 9px;
	background: var(--bs-primary);
	color: #fff;
	font-size: 1.15rem;
	flex-shrink: 0;
}
.nz-escolha-rede {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .35rem;
	padding: .6rem .3rem;
	border-radius: 12px;
	border: 1px solid var(--bs-border-color);
	text-align: center;
}
.nz-escolha-rede:has(input:checked) { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .12); }
.nz-plataforma {
	padding: .9rem 1rem;
	margin-bottom: .9rem;
	border-radius: 12px;
	border: 1px solid var(--bs-border-color);
}
.nz-icone-app {
	width: 64px;
	height: 64px;
	border-radius: 22%;
	object-fit: cover;
	flex-shrink: 0;
}
.nz-icone-app-sm { width: 40px; height: 40px; font-size: 1rem !important; }
.nz-icone-app-vazio {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: rgba(var(--bs-primary-rgb), .25);
	color: #fff;
	font-weight: 700;
	font-size: 1.6rem;
}

/* ======================================================================
   CANTOS ARREDONDADOS EM TODO O PAINEL
   Os do Streamit eram quase rectos; aqui ficam todos da mesma família.
   ====================================================================== */
.card, .modal-content, .alert, .dropdown-menu, .offcanvas, .swal2-container .swal2-popup { border-radius: 16px; }
.card > .card-header:first-child { border-top-left-radius: 16px; border-top-right-radius: 16px; }
.btn, .form-control, .form-select, .input-group-text, .page-link { border-radius: 10px; }
.btn-sm, .form-control-sm, .form-select-sm { border-radius: 8px; }
.badge { border-radius: 7px; }
.progress { border-radius: 10px; }
.dropdown-item { border-radius: 8px; }
.pagination .page-item .page-link { border-radius: 10px; margin: 0 2px; }
.nz-tabela { border-radius: 12px; overflow: hidden; }
.sidebar .nav-link { border-radius: 10px; }
.iq-navbar { border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; }

/* os botões dentro dos cartões (modo cartões de filmes e séries): pequenos,
   para caberem os três numa linha sem empurrar o cartão */
.nz-modo-cartoes .nz-tabela td.nz-c-accoes .acoes-linha { gap: 5px; flex-wrap: wrap; }
.nz-modo-cartoes .nz-tabela td.nz-c-accoes .btn {
	padding: 5px 7px;
	font-size: .78rem;
	line-height: 1;
	border-radius: 7px;
}
.nz-modo-cartoes .nz-tabela td.nz-c-accoes .btn i { font-size: .95rem; }
.nz-modo-cartoes .nz-tabela td.nz-c-estado .badge { font-size: .7rem; padding: 3px 6px; }

/* ======================================================================
   AS DEFINIÇÕES EM GRELHA (definicoes/index.phtml): dois cartões por
   linha, da mesma altura; num ecrã estreito, um por linha
   ====================================================================== */
.nz-grelha-def {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.25rem;
	align-items: stretch;
	margin-bottom: 1.25rem;
}
.nz-grelha-def > .card { margin-bottom: 0; height: 100%; }
@media (max-width: 991.98px) {
	.nz-grelha-def { grid-template-columns: minmax(0, 1fr); }
}

/* ---------- os números das contas (painel/numeros.phtml) ---------- */
.nz-num-grupo {
	margin: 1rem 0 .5rem;
	font-size: .8rem;
	text-transform: uppercase;
	letter-spacing: .06em;
	color: var(--bs-secondary-color);
}
.nz-num {
	height: 100%;
	transition: transform .15s ease, box-shadow .15s ease;
}
.nz-num:hover { transform: translateY(-2px); }
.nz-num-topo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .5rem;
	padding: .65rem 1rem;
	border-bottom: 1px solid var(--bs-border-color);
	font-size: .85rem;
	font-weight: 600;
}
.nz-num-etiqueta {
	flex: 0 0 auto;
	padding: .1rem .45rem;
	border-radius: .35rem;
	background: var(--bs-tertiary-bg);
	color: var(--bs-secondary-color);
	font-size: .7rem;
	font-weight: 400;
}
.nz-num-corpo {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 1rem 1.25rem;
}
.nz-num-valor { font-size: 1.6rem; font-weight: 600; }
.nz-num-icone { font-size: 2rem; }
.nz-num-azul .nz-num-icone     { color: #1890ff; }
.nz-num-verde .nz-num-icone    { color: #13c35a; }
.nz-num-vermelho .nz-num-icone { color: #f5222d; }
.nz-num-laranja .nz-num-icone  { color: #faad14; }
.nz-codigo { font-family: var(--bs-font-monospace); letter-spacing: .04em; font-weight: 600; }
/* a tabela das contas tem treze colunas: letra mais pequena e sem quebrar as datas */
.nz-tabela-contas { font-size: .875rem; }
.nz-tabela-contas td, .nz-tabela-contas th { white-space: nowrap; }
/* o nome (2.ª coluna) pode partir em duas linhas; o resto não */
.nz-tabela-contas td:nth-child(2) { white-space: normal; min-width: 12rem; }
.nz-tabela-contas td:last-child, .nz-tabela-contas th:last-child { text-align: right; }

/*
OS BOTÕES SÓ COM ÍCONE das linhas das tabelas (a ficha, o "...").
Eram um btn-link com o ícone solto: o ícone do cartão tem uma moldura
própria e ficava com um "rebordo" desalinhado ao lado dos três pontos.
Agora são todos a mesma caixa: o mesmo tamanho, a mesma borda, o ícone ao
centro.
*/
.nz-accoes { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; }
.nz-btn-icone {
	display: inline-flex; align-items: center; justify-content: center;
	width: 32px; height: 32px; padding: 0; margin: 0;
	border-radius: 8px; border: 1px solid rgba(255, 255, 255, .14); background: transparent;
	color: #d0d0d0; font-size: 1.1rem; line-height: 1; text-decoration: none;
	transition: background .12s ease, border-color .12s ease, color .12s ease;
}
.nz-btn-icone:hover, .nz-btn-icone[aria-expanded="true"] { background: rgba(255, 255, 255, .06); border-color: var(--bs-primary); color: #fff; }
.nz-btn-icone:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.nz-btn-icone i { pointer-events: none; }

/* ==========================================================================
   AS JANELAS DO SWEETALERT (as perguntas das tabelas: apagar em massa,
   "escreva TODOS") com o aspecto das do nz-modal.js -- uma janela só, no
   sistema todo, e não duas com cara diferente.
   ========================================================================== */
.swal2-popup {
	background: #161616 !important;
	color: #e6e6e6 !important;
	border: 1px solid rgba(255, 255, 255, .08) !important;
	border-radius: 16px !important;
	box-shadow: 0 24px 60px rgba(0, 0, 0, .55) !important;
	padding: 28px 24px 20px !important;
	width: min(420px, calc(100vw - 32px)) !important;
}
.swal2-title { color: #fff !important; font-size: 1.15rem !important; font-weight: 600 !important; padding-top: 4px !important; }
.swal2-html-container { color: #b5b5b5 !important; font-size: 1rem !important; line-height: 1.5 !important; margin-top: 8px !important; }
.swal2-icon { transform: scale(.75); margin: 0 auto !important; }
.swal2-backdrop-show { background: rgba(0, 0, 0, .72) !important; }
.swal2-actions { width: 100%; gap: 10px; flex-wrap: nowrap !important; margin-top: 18px !important; }
.swal2-actions .btn { flex: 1 1 0; border-radius: 10px; padding: 10px 16px; font-weight: 600; margin: 0 !important; }
.swal2-input, .swal2-checkbox { background: #0f0f0f !important; color: #fff !important; border: 1px solid rgba(255, 255, 255, .15) !important; border-radius: 10px !important; }
.swal2-checkbox { padding: 10px 14px; }

/*
A PAGINAÇÃO DAS TABELAS: os botões tinham cada um a largura do seu número
(o activo 31 px, as setas 27 px) e não eram quadrados -- o verde do activo
ficava desencontrado dos vizinhos. Agora são todos a mesma caixa de 34 px,
com o número ao centro, e o activo com a borda da cor dele.
*/
.dataTables_paginate .pagination { gap: 6px; margin: 0; }
.dataTables_paginate .page-item .page-link {
	min-width: 34px; height: 34px; padding: 0 10px; margin: 0 !important;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px !important; line-height: 1;
}
.dataTables_paginate .page-item.active .page-link { border-color: var(--bs-primary); }
.dataTables_paginate .page-item.disabled .page-link { opacity: .45; }