/*!
Theme Name: Repositorio
Author: Marco Reixa
*/

:root {
    --black: 		#000000;
	--dark: 		#444444;
	--gray: 		#666666;
	--white: 		#FFFFFF;

	--menuH:		80px;
	--availableH:	calc(100dvh - var(--menuH));

	--gap:			12px;
	--gap2x:		24px;
	--gap3x:		36px;
	--gap4x:		48px;
	--gap5x:		60px;
	--gap6x:		72px;
	--gap7x:		84px;
	--gap8x:		96px;	
	--gap9x:		108px;
	--gap10x:		120px;
  }

*					{ box-sizing: border-box !important; }
img					{ border: none; display: block; }
a					{ color: var(--black); text-decoration: underline; }
a:visited			{ color: var(--black); }
a:hover				{ color: var(--black); text-decoration: underline; }

p:first-of-type		{ margin-top: 0; }
p:last-of-type		{ margin-bottom: 0; }


/*
——————————————————————————————————————————
TYPOGRAPHY 
——————————————————————————————————————————
*/

/* FAMILIES */
body															{ font-family: "Geist", sans-serif; font-optical-sizing: auto; font-weight: 400; font-style: normal; }

/* VARIANTS & SIZES */
body, html 														{ font-size: 16px; line-height: 1.30em; }

.site-branding 													{ font-size: 16px; line-height: 1.00em; font-weight: 600; text-transform: uppercase; }
#primary-menu 													{ font-size: 12px; line-height: 1.00em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }

h1, h2, h3, h4, h5, h6 											{ margin: 0; padding: 0; }

.files-list-cell.title h2										{ font-size: 32px; line-height: 1.20em; font-weight: 100; text-transform: uppercase; }
.file-header h1													{ font-size: 16px; line-height: 1.20em; font-weight: 400; text-transform: uppercase; }
.viewer-document-title											{ font-size: 16px; line-height: 1.20em; font-weight: 400; text-transform: uppercase; }

.eyebrow														{ font-size: 12px; line-height: 1.20em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }

.files-list-cell.meta											{ font-size: 12px; line-height: 1.20em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }
.files-list-cell.lead											{ font-size: 14px; line-height: 1.50em; font-weight: 400; }

.btn															{ font-size: 12px; line-height: 1.00em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }

#colophon														{ font-size: 12px; line-height: 1.00em; font-weight: 400; text-transform: uppercase; letter-spacing: 0.05em; }


/*
——————————————————————————————————————————
STRUCTURE
——————————————————————————————————————————
*/

html, body														{ margin: 0 !important; padding: 0 !important; background-color: var(--white); color: var(--black); }

#page 															{ width: 100%; height: auto; margin: 0; padding: 0; }
#primary 														{ width: 100%; height: auto; min-height: var(--availableH); margin: 0 0 25vh 0; padding: 0; position: relative; background-color: var(--white); z-index: 8888; }

/*
——————————————————————————————————————————
HEADER & NAV
——————————————————————————————————————————
*/

#masthead 														{ width: 100%; height: var(--menuH); margin: 0; padding: 0 var(--gap); background-color: var(--white); display: flex; flex-direction: row; align-items: center; justify-content: space-between; position: sticky; top: 0; left: 0; z-index: 9999; }

.site-branding 													{ width: auto; height: auto; margin: 0; padding: 0; }
.site-branding a 												{ width: auto; height: auto; margin: 0; padding: 2px 0; display: block; color: var(--black); text-decoration: none; border-bottom: solid 1px transparent; }

#site-navigation												{ width: auto; height: auto; margin: 0; padding: 0 ; }

#primary-menu 													{ width: 100%; height: auto; margin: 0; padding: 0 var(--gap) var(--gap3x) var(--gap); background-color: var(--white); list-style: none; display: none; flex-direction: column; gap: 0; position: absolute; top: var(--menuH); left: 0; }
#primary-menu li 												{ width: 100%; height: auto; margin: 0; padding: 0; border-bottom: solid 1px var(--black); }
#primary-menu li a												{ width: 100%; height: auto; margin: 0; padding: var(--gap2x) var(--gap); display: block; color: var(--black); text-decoration: none; }
#primary-menu li.current-menu-item a,
.single-documents #primary-menu li.menu-item-28 a,
.single-videos #primary-menu li.menu-item-27 a 					{ color: var(--white); background-color: var(--black); text-decoration: none; }

#primary-menu li.return a 										{ background-image: url('img/icn-return.svg'); background-repeat: no-repeat; background-position: var(--gap) center; background-size: 18px 10px; text-indent: -9999px; overflow: hidden; }
.home #primary-menu li.return 									{ display: none; }

#primary-menu li.wpml-ls-item a									{ border: solid 1px transparent; border-radius: 4px; padding: 3px 4px 2px 4px; }
#primary-menu li.wpml-ls-item:hover a,
#primary-menu li.wpml-ls-current-language a						{ border: solid 1px var(--black); }
#primary-menu li.wpml-ls-last-item  							{ margin-left: -14px;	}

/* main menu toggle */
.menu-toggle                                                	{ width: auto; height: var(--menuH); margin: 0; padding: 0; border: none; border-radius: 0; background-color: transparent; cursor: pointer; display: flex; }
.menu-icon                                                 		{ width: 100%; height: 100%; margin: 0; padding: 0; display: flex; flex-direction: column;  align-items: center; justify-content:center; transition: all .2s ease-in-out, background-color 1ms; -moz-transition: all .2s ease-in-out, background-color 1ms; -webkit-transition: all .2s ease-in-out, background-color 1ms; }
.menu-icon:after, .menu-icon:before, .menu-icon span        	{ width: 24px; height: 2px; margin: 2px 0; padding: 0; display: block; background-color: var(--black); transition: all .2s ease-in-out, background-color 1ms; -moz-transition: all .2s ease-in-out, background-color 1ms; -webkit-transition: all .2s ease-in-out, background-color 1ms; content: ''; }

#site-navigation.toggled .menu-icon:before                  	{ transform: translateY(6px) rotate(135deg); -webkit-transform: translateY(4px) rotate(135deg); -moz-transform: translateY(8px) rotate(135deg); }
#site-navigation.toggled .menu-icon:after                   	{ transform: translateY(-6px) rotate(-135deg); -moz-transform: translateY(-4px) rotate(-135deg); -webkit-transform: translateY(-8px) rotate(-135deg); }
#site-navigation.toggled .menu-icon span                   		{ transform: scale(0); -moz-transform: scale(0); -webkit-transform: scale(0); }

#site-navigation.toggled #primary-menu                    		{ display: flex; }

/*
——————————————————————————————————————————
UI ELEMENTS
-—————————————————————————————————————————
*/	

.btn 															{ width: auto; height: auto; margin: 0; padding: 10px 20px; border: solid 1px var(--black); display: block; background-color: var(white); color: var(--black); text-decoration: none; }
.btn:active														{ background-color: var(white); color: var(--black); text-decoration: none; }
.btn:hover														{ border-color: solid 1px var(--gray); color: var(--gray); text-decoration: none; }

/*
——————————————————————————————————————————
HOME PAGE
-—————————————————————————————————————————
*/	

.recent-blocks													{ width: 100%; height: auto; margin: 0; padding: 0; position: relative; z-index: 2; }

/*
——————————————————————————————————————————
LISTS
-—————————————————————————————————————————
*/	

.files-list-block												{ width: 100%; height: auto; margin: 0; padding: var(--gap6x) var(--gap) 0 var(--gap); display: grid; grid-template-rows: auto; grid-template-columns: repeat(12, 1fr); gap: var(--gap); }

.files-aside													{ width: auto; height: auto; margin: 0; padding: var(--gap2x) 0; grid-column: 1 / span 12; }

.files-list														{ width: auto; height: auto; margin: 0; padding: 0; grid-column: 1 / span 12; display: grid; grid-template-columns: 50% 50%; }
.files-list-row.header											{ display: contents; }
.files-list-row.details											{ display: none; }

.files-list-cell												{ width: auto; height: 100%; margin: 0; padding: var(--gap2x) 0; grid-column: span 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
.files-list-cell.title											{ grid-column: span 2; padding: var(--gap2x) 0 0 0;}
.files-list-cell.meta											{ grid-column: span 1; padding: var(--gap) 0; border-bottom: dashed 1px var(--gray); }
.files-list-cell.icon											{ display: none; }
.files-list-cell.lead											{ grid-column: span 2; padding: var(--gap) 0; justify-content: flex-start; }
.files-list-cell.file											{ grid-column: span 2; padding: var(--gap) 0; justify-content: flex-start; border-bottom: dashed 1px var(--gray); }

.files-list-cell .view-icon										{ width: 18px; height: 18px; visibility: hidden; }

.files-list-row.header:hover .files-list-cell					{ cursor: pointer; }
.files-list-row.header:hover .files-list-cell .view-icon		{ visibility: visible; }
.files-list-row.active .files-list-cell							{ border-bottom-color: transparent; }
.files-list-row.active:hover .files-list-cell .view-icon		{ visibility: hidden; }

/*
——————————————————————————————————————————
PDF VIEWER
——————————————————————————————————————————
*/

.pdf-viewer-container 											{ width: 100%; height: var(--availableH); background: var(--dark); position: relative; display: flex; flex-direction: column; overflow: hidden;  }

/* HEADER - CONTROLS */
.viewer-header 													{ width: 100%; height: var(--menuH); margin: 0; padding: var(--gap); background-color: var(--black); display: flex; flex-direction: column; justify-content: center; align-items: center; gap:var(--gap); color: var(--white); }
.controls-left													{ display: flex; align-items: center; gap: 1rem;  }
.controls-center												{ display: none; align-items: center; gap: 1rem;  }
.controls-right													{ display: none; align-items: center; gap: 1rem;  }
.controls-center 												{ flex: 1; justify-content: center; }

/* BOTÕES DE NAVEGAÇÃO */
.nav-btn 														{ padding: 0.5rem 1rem; background: #fff; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; transition: all 0.2s; }
.nav-btn:hover:not(:disabled) 									{ background: #f0f0f0; border-color: #999; }
.nav-btn:disabled 												{ opacity: 0.4; cursor: not-allowed; }
.nav-btn .arrow 												{ display: inline-block; }

/* === PAGE INFO === */
.page-info 														{ display: flex; align-items: center; gap: 0.5rem; }
#page-input 													{ width: 60px; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px; text-align: center; font-size: 14px; }
#page-count 													{ font-size: 14px; white-space: nowrap; }

/* === ZOOM === */
.zoom-btn 														{ width: 36px; height: 36px; padding: 0; background: #fff; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; font-size: 20px; font-weight: bold; transition: all 0.2s; }
.zoom-btn:hover:not(:disabled) 									{ background: #f0f0f0; border-color: #999; }
.zoom-btn:disabled 												{ opacity: 0.4; cursor: not-allowed; }
#zoom-level 													{ font-size: 14px; min-width: 50px; text-align: center; }

/* === VIEWING AREA === */
.viewer-body 													{ flex: 1; display: flex; justify-content: center; align-items: flex-start; overflow: auto; padding: var(--gap) !important; position: relative; min-height: 0; }
#pdf-canvas 													{ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); background: #fff; display: block; }

/* === MESSAGES === */
.message 														{ margin: 0; padding: var(--gap2x) var(--gap4x); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: var(--white); border: 1px solid var(--black); border-radius: 10px; color: var(--black); text-align: center; }


/*
——————————————————————————————————————————
VIDEO
——————————————————————————————————————————
*/

.single-videos #primary											{ padding-bottom: var(--gap2x); background-color: var(--black); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }

.file-header													{ width: 100%; height: var(--menuH); margin: 0; padding:0 var(--gap3x); background-color: var(--black); color: var(--white); display: flex; flex-direction: row; align-items: center; justify-content: flex-start; }

.video-block													{ width: 100%; height: 100%; margin: auto; padding: 0 var(--gap); }
.video-container 												{ width: 100%; height: 0; margin: 0; padding: 56.25% 0 0 0; position: relative; display: flex; }
.video-container iframe											{ width: 100%; height: 100%; margin: 0; padding: 0; position: absolute; top: 0; left: 0; border: none; }




/*
——————————————————————————————————————————
COLOPHON
——————————————————————————————————————————
*/

#colophon 														{ width: 100%; height: 25vh; margin: 0; padding: var(--gap3x); position: fixed; bottom: 0; left: 0; background-color: var(--white); display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; }


/* 768 ipad vertical ******************************************************************************* */
/* 768 ipad vertical ******************************************************************************* */
/* 768 ipad vertical ******************************************************************************* */
@media only screen and (min-width: 768px) {

	
} /* @media 768 */




/* 900 ipad horizontal ******************************************************************************* */
/* 900 ipad horizontal ******************************************************************************* */
/* 900 ipad horizontal ******************************************************************************* */
@media only screen and (min-width: 900px) {

/*
——————————————————————————————————————————
HEADER & NAV
——————————————————————————————————————————
*/

#masthead 														{ padding: 0 var(--gap3x); }

.site-branding a:hover 											{ color: var(--black); text-decoration: none; border-bottom: solid 1px var(--black); }

#primary-menu 													{ width: auto; padding: 0; position: relative; top: 0; left: 0; display: flex; flex-direction: row; gap: var(--gap2x); align-items: flex-end; }
#primary-menu li 												{ width: auto; border-bottom: none; }
#primary-menu li a												{ width: auto; padding: 2px 0; border-bottom: solid 1px transparent; }
#primary-menu li a:hover,
#primary-menu li.current-menu-item a,
.single-documents #primary-menu li.menu-item-28 a,
.single-videos #primary-menu li.menu-item-27 a					{ background-color: var(--white); color: var(--black); text-decoration: none; border-bottom: solid 1px var(--black); }

#primary-menu li.return a 										{ width: 18px; height: 100%; margin: 0; padding: 2px 0; background-position: left center; }
#primary-menu li.return a:hover									{ border-bottom: solid 1px transparent; opacity: 0.5; }

#primary-menu li.wpml-ls-item a									{ border: solid 1px transparent; border-radius: 4px; padding: 3px 4px 2px 4px; }
#primary-menu li.wpml-ls-item:hover a,
#primary-menu li.wpml-ls-current-language a						{ border: solid 1px var(--black); }
#primary-menu li.wpml-ls-last-item  							{ margin-left: -14px; }

/* main menu toggle */
.menu-toggle                                                	{ display: none;  }

/*
——————————————————————————————————————————
LISTS
-—————————————————————————————————————————
*/	

.files-list-block												{ width: 100%; height: auto; margin: 0; padding: var(--gap10x) var(--gap3x) 0 var(--gap3x); display: grid; grid-template-rows: auto; grid-template-columns: repeat(12, 1fr); gap: var(--gap); }

.files-aside													{ width: auto; height: auto; margin: 0; padding: var(--gap2x) 0 0 0; grid-column: 1 / span 1; }

.files-list														{ width: auto; height: auto; margin: 0; padding: 0; grid-column: 4 / span 9; display: grid; grid-template-columns: 55% 15% 25% 5%; }
.files-list-row.header											{ display: contents; }
.files-list-row.details											{ display: none; }

.files-list-cell												{ width: auto; height: 100%; margin: 0; padding: var(--gap2x); grid-column: span 1; border-bottom: dashed 1px var(--gray); display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-end; }
.files-list-cell.title											{ grid-column: span 1; padding: var(--gap2x) var(--gap2x) var(--gap2x) 0; }
.files-list-cell.meta											{ padding: var(--gap2x); }
.files-list-cell.icon											{ padding: var(--gap2x) 0; align-items: flex-end; display: flex; }
.files-list-cell.lead											{ grid-column: span 1; padding: var(--gap) var(--gap4x) var(--gap4x) 0; justify-content: flex-start; }
.files-list-cell.file											{ grid-column: span 3;padding: var(--gap) 0 var(--gap4x) var(--gap2x); justify-content: flex-start; }

.files-list-cell .view-icon										{ width: 18px; height: 18px; visibility: hidden; }

.files-list-row.header:hover .files-list-cell					{ cursor: pointer; }
.files-list-row.header:hover .files-list-cell .view-icon		{ visibility: visible; }
.files-list-row.active .files-list-cell							{ border-bottom-color: transparent; }
.files-list-row.active:hover .files-list-cell .view-icon		{ visibility: hidden; }


/*
——————————————————————————————————————————
PDF VIEWER
——————————————————————————————————————————
*/

.pdf-viewer-container 											{ width: 100%; height: var(--availableH); background: var(--dark); position: relative; display: flex; flex-direction: column; overflow: hidden;  }

/* HEADER - CONTROLS */
.viewer-header 													{ width: 100%; height: var(--menuH); margin: 0; padding: 0 var(--gap3x); background-color: var(--black); display: flex; flex-direction: row; justify-content: space-between; align-items: center; gap: 0; color: var(--white); }
.controls-left, .controls-center, .controls-right				{ display: flex; align-items: center; gap: 1rem; }
.controls-center 												{ flex: 1; justify-content: center; }

/* BOTÕES DE NAVEGAÇÃO */
.nav-btn 														{ padding: 0.5rem 1rem; background: #fff; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; transition: all 0.2s; }
.nav-btn:hover:not(:disabled) 									{ background: #f0f0f0; border-color: #999; }
.nav-btn:disabled 												{ opacity: 0.4; cursor: not-allowed; }
.nav-btn .arrow 												{ display: inline-block; }

/* === PAGE INFO === */
.page-info 														{ display: flex; align-items: center; gap: 0.5rem; }
#page-input 													{ width: 60px; padding: 0.5rem; border: 1px solid #ddd; border-radius: 4px; text-align: center; font-size: 14px; }
#page-count 													{ font-size: 14px; white-space: nowrap; }

/* === ZOOM === */
.zoom-btn 														{ width: 36px; height: 36px; padding: 0; background: #fff; border: 1px solid #ddd; border-radius: 4px; cursor: pointer; font-size: 20px; font-weight: bold; transition: all 0.2s; }
.zoom-btn:hover:not(:disabled) 									{ background: #f0f0f0; border-color: #999; }
.zoom-btn:disabled 												{ opacity: 0.4; cursor: not-allowed; }
#zoom-level 													{ font-size: 14px; min-width: 50px; text-align: center; }

/* === VIEWING AREA === */
.viewer-body 													{ flex: 1; display: flex; justify-content: center; align-items: center; overflow: auto; padding: 2rem; position: relative; min-height: 0; }
#pdf-canvas 													{ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); background: #fff; display: block; }

/* === MESSAGES === */
.message 														{ margin: 0; padding: var(--gap2x) var(--gap4x); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: var(--white); border: 1px solid var(--black); border-radius: 10px; color: var(--black); text-align: center; }



/*
——————————————————————————————————————————
VIDEO
——————————————————————————————————————————
*/

.single-videos #primary											{ padding-bottom: var(--gap2x); background-color: var(--black); display: flex; flex-direction: column; align-items: center; justify-content: flex-start; }

.file-header													{ width: 100%; height: var(--menuH); margin: 0; padding:0 var(--gap3x); background-color: var(--black); color: var(--white); display: flex; flex-direction: row; align-items: center; justify-content: flex-start; }

.video-block													{ width: 70vw; height: 100%; margin: auto; padding: 0; }
.video-container 												{ width: 100%; height: 0; margin: 0; padding: 56.25% 0 0 0; position: relative; display: flex; }
.video-container iframe											{ width: 100%; height: 100%; margin: 0; padding: 0; position: absolute; top: 0; left: 0; border: none; }



} /* @media 900 */


/* 1280 macbook ******************************************************************************* */
/* 1280 macbook ******************************************************************************* */
/* 1280 macbook ******************************************************************************* */
@media only screen and (min-width: 1280px) {


} /* @media 1280 */




/* 1600 imac ******************************************************************************* */
/* 1600 imac ******************************************************************************* */
/* 1600 imac ******************************************************************************* */
@media only screen and (min-width: 1600px) {



	
} /* @media 1600 */