/* =======================================================
   Archivo Digital del Patriarca – Tema institucional
   ======================================================= */

:root{
  --grid-font-size: 20px;
  --menu-font-size: 20px;
  --menu-line-height: 34px;
  --radius: 10px;

  --files-data-display: none;
  --files-data-display-hover: none;

  /* Paleta */
  --patriarca-granate: #7A1C1C;
  --patriarca-oro: #d4a017;
  --patriarca-papel: #f4f1ea;
  --patriarca-texto: #2f2a24;

  /* Neutralizar colores del tema */
  --background: #f4f1ea;
  --surface1: #f4f1ea;
  --surface2: #f4f1ea;
  --surface3: #f4f1ea;
  --surface4: #f4f1ea;
  --primary: #7A1C1C;
  --primary-contrast: #ffffff;
  --color: #2f2a24;
  --text: #2f2a24;
  --link: #7A1C1C;

  /* Carpetas */
  --svg-folder-bg-light: #f4c542;
  --svg-folder-fg-light: #ffd86b;
  --svg-folder-bg-large-light: #f4c542;
  --svg-folder-fg-large-light: #ffe08a;

  --svg-folder-bg-dark: #caa233;
  --svg-folder-fg-dark: #e6c56a;
  --svg-folder-bg-large-dark: #b78f2c;
  --svg-folder-fg-large-dark: #d9b95f;
}

/* ================================
   Base
   ================================ */

html,
body{
  font-size: 20px !important;
  line-height: 1.55 !important;
}

body{
  background: var(--patriarca-papel) !important;
  color: var(--patriarca-texto) !important;
  font-family: Georgia, "Times New Roman", serif !important;
}

/* Toda la app al mismo fondo papel */
html,
body,
.fg,
.fg-wrap,
.fg-main,
.fg-content,
.fg-body,
.fg-path,
.fg-breadcrumb,
.fg-row,
.fg-grid,
.fg-list,
.fg-items,
main,
section,
article,
#app,
#content,
#main{
  background: var(--patriarca-papel) !important;
  background-color: var(--patriarca-papel) !important;
  color: var(--patriarca-texto) !important;
}

/* Cualquier panel interno */
[class*="content"],
[class*="main"],
[class*="panel"],
[class*="view"],
[class*="browser"],
[class*="wrap"],
[class*="grid"],
[class*="list"]{
  background: var(--patriarca-papel) !important;
  background-color: var(--patriarca-papel) !important;
  color: var(--patriarca-texto) !important;
}

/* ================================
   Contenedor
   ================================ */

.fg,
.fg-wrap,
.fg-main,
.fg-content{
  font-size: 1rem !important;
}

.fg-wrap,
.fg-main{
  max-width: 1320px;
  margin: 0 auto;
}

/* ================================
   Zona de carpetas
   ================================ */

.fg-main,
.fg-content,
.fg-body,
.fg-grid,
.fg-list,
.fg-items,
.fg-row,
.fg-path,
.fg-breadcrumb{
  background: var(--patriarca-papel) !important;
  background-color: var(--patriarca-papel) !important;
}

.fg-item,
.fg-row-item{
  background: #fbf8f1 !important;
  border-radius: var(--radius) !important;
  box-shadow: 0 6px 18px rgba(0,0,0,.08) !important;
  border: 1px solid rgba(0,0,0,.06) !important;
}

.fg-item:hover,
.fg-item:focus,
.fg-item.active,
.fg-item.selected,
.fg-row-item:hover,
.fg-row-item.active{
  background: #f8f4ec !important;
  color: var(--patriarca-texto) !important;
}

.fg-item-title,
.fg-row-title,
.fg-name,
.fg-file-name{
  font-size: 1.05rem !important;
  line-height: 1.55 !important;
  letter-spacing: .3px;
  font-weight: 600 !important;
  color: var(--patriarca-texto) !important;
}

.fg-menu,
.fg-path,
.fg-breadcrumb,
.fg-row{
  font-size: 1rem !important;
}

/* ================================
   Enlaces
   ================================ */

a{
  text-decoration: none !important;
  color: var(--patriarca-granate) !important;
}

a:hover{
  text-decoration: underline !important;
}

/* ================================
   Cabecera principal
   ================================ */

.fg-header,
.fg-top{
  background: var(--patriarca-granate) !important;
  color: #ffffff !important;
}

/* ================================
   Segunda cabecera
   ================================ */

#topbar{
  background-color: var(--patriarca-granate) !important;
  border-color: rgba(255,255,255,0.18) !important;
}

#topbar > *{
  background-color: transparent !important;
  color: #ffffff !important;
}

/* Elementos generales de la barra */
#topbar a,
#topbar button,
#topbar span,
#topbar div,
#topbar svg,
#topbar i,
#topbar small,
#topbar strong,
#topbar label,
#topbar [role="button"],
#topbar [class*="btn"],
#topbar [class*="button"],
#topbar [class*="tab"],
#topbar [class*="item"],
#topbar [class*="link"],
#topbar [class*="menu"],
#topbar [class*="meta"],
#topbar [class*="info"],
#topbar [class*="count"],
#topbar [class*="size"]{
  color: #ffffff !important;
  fill: currentColor !important;
  border-color: rgba(255,255,255,0.18) !important;
}

/* Solo navegación */
#topbar a,
#topbar button,
#topbar [role="button"],
#topbar [class*="btn"],
#topbar [class*="button"],
#topbar [class*="tab"],
#topbar [class*="item"],
#topbar [class*="link"]{
  background-color: var(--patriarca-granate) !important;
}

/* Buscador */
#topbar input,
#topbar input[type="search"],
#topbar input[type="text"],
#topbar .search,
#topbar [class*="search"],
#topbar form{
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #2f2a24 !important;
  border: 1px solid rgba(122,28,28,0.35) !important;
  box-shadow: none !important;
}

#topbar input::placeholder,
#topbar input[type="search"]::placeholder,
#topbar input[type="text"]::placeholder{
  color: #6b6258 !important;
  opacity: 1 !important;
}

/* Contenedor del buscador */
#topbar form,
#topbar [class*="search"],
#topbar [class*="finder"]{
  background-color: transparent !important;
  color: #ffffff !important;
}

/* Botones/iconos del buscador */
#topbar form button,
#topbar [class*="search"] button,
#topbar [class*="search"] svg,
#topbar [class*="search"] i{
  background: var(--patriarca-granate) !important;
  color: #ffffff !important;
  fill: currentColor !important;
  border-color: rgba(255,255,255,0.18) !important;
}

/* Zona derecha: número de archivos y tamaño */
#topbar .meta,
#topbar .info,
#topbar .count,
#topbar .size,
#topbar [class*="meta"],
#topbar [class*="info"],
#topbar [class*="count"],
#topbar [class*="size"],
#topbar small,
#topbar strong{
  background: transparent !important;
  color: #ffffff !important;
  border: none !important;
}

/* Hover y activo */
#topbar a:hover,
#topbar button:hover,
#topbar [role="button"]:hover,
#topbar .active,
#topbar .selected,
#topbar [aria-current="page"]{
  background-color: rgba(255,255,255,0.15) !important;
  color: #ffffff !important;
  text-decoration: none !important;
}

/* ================================
   Botones
   ================================ */

button,
.fg-btn,
.fg-button{
  border-radius: 999px !important;
}

button:not(#topbar button),
.fg-btn:not(#topbar .fg-btn),
.fg-button:not(#topbar .fg-button){
  background: #f7f1e6 !important;
  color: var(--patriarca-texto) !important;
  border-color: rgba(0,0,0,.10) !important;
}

/* ================================
   Cabecera con logo
   ================================ */

body::before{
  content: "Archivo Digital del Patriarca";
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 24px 20px;
  padding-left: 120px;

  background: var(--patriarca-papel);
  color: var(--patriarca-granate);
  font-size: 40px;
  font-weight: 600;
  letter-spacing: 0.6px;
  font-family: Georgia, serif;
  border-bottom: 3px solid var(--patriarca-oro);

  background-image: url("../img/logo.png");
  background-repeat: no-repeat;
  background-size: 100px 100px;
  background-position: 30px 50%;
}

/* ================================
   Móvil
   ================================ */

@media (max-width: 700px){
  body::before{
    font-size: 26px;
    padding: 18px 14px;
    padding-left: 86px;
    background-size: 64px 64px;
    background-position: 14px 50%;
  }

  html,
  body{
    font-size: 18px !important;
    line-height: 1.5 !important;
  }
}

/* ================================
   Popup
   ================================ */

.pswp__caption__center > *:not(.popup-basename){
  display: none;
}

.pswp__caption__center::after{
  content: "Zoom: clic para ampliar · Arrastra para moverte · ESC para cerrar";
  display: block;
  margin-top: 6px;
  font-size: 0.95rem;
  opacity: 0.85;
}

/* ================================
   Ocultar descargas
   ================================ */

.pswp__button--download,
.pswp__button[title*="Download"],
.pswp__button[aria-label*="Download"],
.pswp__button[title*="Descargar"],
.pswp__button[aria-label*="Descargar"]{
  display: none !important;
}

.fg-download,
.fg-btn-download,
a[download]{
  display: none !important;
}

/* ===== Visor de imágenes con fondo negro ===== */

.pswp,
.pswp__bg,
.pswp__scroll-wrap,
.pswp__container,
.pswp__item,
.pswp__img,
.pswp__zoom-wrap {
  background: #000000 !important;
  background-color: #000000 !important;
}

/* Laterales negros del visor */
.pswp__button--arrow--left,
.pswp__button--arrow--right{
  top: 0 !important;
  bottom: 0 !important;
  height: 100% !important;
  margin-top: 0 !important;
  width: 90px !important;
  opacity: 1 !important;
}

/* Lateral izquierdo */
.pswp__button--arrow--left{
  left: 0 !important;
  background: linear-gradient(to right, rgba(0,0,0,0.88), rgba(0,0,0,0.45), rgba(0,0,0,0)) !important;
}

/* Lateral derecho */
.pswp__button--arrow--right{
  right: 0 !important;
  background: linear-gradient(to left, rgba(0,0,0,0.88), rgba(0,0,0,0.45), rgba(0,0,0,0)) !important;
}

/* Al pasar el ratón, un poco más intenso */
.pswp__button--arrow--left:hover{
  background: linear-gradient(to right, rgba(0,0,0,0.96), rgba(0,0,0,0.60), rgba(0,0,0,0)) !important;
}

.pswp__button--arrow--right:hover{
  background: linear-gradient(to left, rgba(0,0,0,0.96), rgba(0,0,0,0.60), rgba(0,0,0,0)) !important;
}
